Page display methods, communication systems and electronic devices

By integrating page configuration information from different screen states on the server side and sending it to the terminal device all at once, the problem of performance degradation and poor user experience when foldable phones switch screen states is solved, achieving more efficient page display and a better user experience.

CN119166247BActive Publication Date: 2025-11-14HUAWEI TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202310731466.8
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2023-06-19
Publication Date
2025-11-14
Estimated Expiration
2043-06-19

AI Technical Summary

Technical Problem

When foldable phones frequently switch screen states, they repeatedly retrieve page configuration information from the server, leading to performance degradation and a poor user experience.

Method used

The server merges the page configuration information from different screen states into a unified target page configuration information, and sends it to the terminal device all at once after the application starts. The terminal device then displays the application page that matches the current screen state based on this configuration information.

Benefits of technology

It reduces the time required to acquire information when switching screen states, thereby improving the performance of terminal devices and the user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119166247B_ABST
    Figure CN119166247B_ABST
Patent Text Reader

Abstract

A page display method, communication system, and electronic device, relating to the field of terminal technology, reduces the process of repeatedly retrieving corresponding page configuration information from the server when the terminal device switches screen states, greatly saving information retrieval time, improving terminal device performance, and enhancing user experience. In this method, the server merges the different page configuration information corresponding to the target application in different screen states of the terminal device to obtain target page configuration information. In response to the launch operation of the target application, the target terminal device obtains the target page configuration information from the server and displays the application page matching the current first screen state based on the target page configuration information. If the target terminal device switches from the current first screen state to a second screen state, the target terminal device continues to display the application page matching the current second screen state based on the already obtained target page configuration information.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of terminal technology, and in particular to a page display method, a communication system, and an electronic device. Background Technology

[0002] To ensure that application pages displayed on different electronic devices adapt to their screen sizes, the server typically configures corresponding page settings for each device with a different screen size. This includes devices with different screen sizes, such as mobile phones and tablets. Alternatively, electronic devices may have different screen states, such as folded / unfolded, landscape / portrait, full-screen / split-screen, etc.

[0003] For example, when a foldable phone switches or changes its screen state, it sends a request to the server, including information indicating the phone's current state. The server determines the phone's current state based on this information. If the phone is folded, the server sends the corresponding page configuration information. The foldable phone receives this information and then lays out and displays the corresponding application page on its folded screen. Conversely, if the phone is unfolded, the server sends the corresponding page configuration information, and the foldable phone receives this information and then lays out and displays the corresponding application page on its unfolded screen.

[0004] However, if the foldable phone switches states frequently, the repeated requests for page configuration information from the server will also lead to poor performance and affect the user experience. Summary of the Invention

[0005] This application provides a page display method, a communication system, and an electronic device, which can reduce the process of repeatedly obtaining corresponding page configuration information from the server when the terminal device switches screen states, greatly saving information acquisition time, improving the performance of the terminal device, and also improving the user experience.

[0006] To achieve the above objectives, the embodiments of this application adopt the following technical solutions:

[0007] Firstly, a page display method is provided, applied to a server in a communication system. The communication system also includes at least one terminal device, and the server communicates with each of the at least one terminal device. In this method, the server obtains different page configuration information corresponding to a target application under different screen states of the terminal device, and merges the different page configuration information corresponding to the different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application. Upon receiving a first page information request sent by the target terminal device after the target application is launched, the server sends the target page configuration information and the first page content corresponding to the target application to the target terminal device. Upon receiving a second page information request sent by the target terminal device after the target application is launched, the server sends the second page content corresponding to the target application to the target terminal device.

[0008] The screen states mentioned above indicate whether the terminal device's screen is in a folded or unfolded state; the page configuration information is used to configure the application page of the target application; the target page configuration information includes configuration information for displaying the application page under multiple screen states; the first page content is used by the target terminal device to display the application page of the target application that matches the current screen state based on the target page configuration information; the second page content is used by the target terminal device to display the application page of the target application that matches the current screen state based on the target page configuration information that has been obtained.

[0009] In the above method, the server can merge the different page configuration information corresponding to the target application under different screen states of the terminal device into a unified target page configuration information. The target terminal device does not need to repeatedly retrieve page configuration information specific to the current screen state from the server; instead, it only needs to retrieve the unified target page configuration information once after the target application starts. Then, the target terminal device displays the application page matching the current screen state based on the target page configuration information. This reduces the process of repeatedly retrieving corresponding page configuration information from the server when the target terminal device switches screen states, greatly saving information retrieval time, thereby improving terminal device performance, reducing user waiting time, and enhancing the user experience.

[0010] In one possible implementation of the first aspect, the aforementioned page configuration information includes Hypertext Markup Language (HTML) information and Cascading Style Sheets (CSS) information for displaying the application page, and the target page configuration information includes merged target HTML information and merged target CSS information.

[0011] In one possible implementation of the first aspect, the target application corresponds to first page configuration information when the terminal device screen is in a folded state, and corresponds to second page configuration information when the terminal device screen is in an unfolded state. The first page configuration information includes first HTML information and first CSS information, and the second page configuration information includes second HTML information and second CSS information. When the server merges different page configuration information to obtain the target page configuration information of the terminal device corresponding to the target application, it can first merge the first HTML information in the first page configuration information with the second HTML information in the second page configuration information to obtain the target HTML information, and then merge the first CSS information in the first page configuration information with the second CSS information in the second page configuration information to obtain the target CSS information.

[0012] The target HTML information includes HTML information for the application pages used to configure the target application in multiple screen states; the target CSS information includes CSS information for the application pages used to configure the target application in multiple screen states.

[0013] In the above implementation, the server can merge different page configuration information into unified target page configuration information. Thus, when a target terminal device with the target application installed requests the target application's configuration information from the server after the target application starts, the server can send the corresponding target page configuration information to the target terminal device at once. During the normal operation of the target application after it starts, the target terminal device does not need to request page configuration information from the server again, saving information or data transmission time.

[0014] In one possible implementation of the first aspect, when the server obtains the target HTML information, it can first obtain a first syntax tree corresponding to the target application based on the first HTML information, and then obtain a second syntax tree corresponding to the target application based on the second HTML information. Next, the server obtains a first set of nodes based on the common nodes in the first and second syntax trees, and obtains a second set of nodes based on the different nodes in the first and second syntax trees. The server then inserts the nodes from the second set of nodes into the first set of nodes to generate the target syntax tree, and obtains the target HTML information based on the target syntax tree.

[0015] The first syntax tree and the second syntax tree are used to represent the syntax structure of the application page of the target application when the screen of the terminal device is in a collapsed state and the syntax structure of the application page of the target application when the screen of the terminal device is in an expanded state, respectively. The first syntax tree and the second syntax tree each include at least one node with a hierarchical relationship. At least one node in the first syntax tree is used to represent at least one syntax content in the first syntax tree, and at least one node in the second syntax tree is used to represent at least one syntax content in the second syntax tree. The target syntax tree includes multiple nodes corresponding to different screen states.

[0016] In the above implementation, when the server merges page configuration information corresponding to different screen states (or screen sizes), it can merge different syntax trees in different page configuration information, so that the merged target syntax tree can be applied to terminal devices with different screen states (or screen sizes).

[0017] In one possible implementation of the first aspect, when the server obtains the target CSS information, it can first obtain a first rule for displaying the application page on the terminal device when the screen is in a collapsed state, based on the first CSS information, and then obtain a second rule for displaying the application page on the terminal device when the screen is in an expanded state, based on the second CSS information. Afterwards, the server merges the first and second rules into a target rule, and obtains the target CSS information based on the target rule.

[0018] The target rules include rules for displaying application pages that meet the preset display conditions of the terminal device.

[0019] In the above implementation, when the server merges page configuration information corresponding to different screen states (or screen sizes), it can merge the different display rules in the different page configuration information, so that the merged target rule can be applied to terminal devices with different screen states (or screen sizes).

[0020] In one possible implementation of the first aspect, the aforementioned preset display conditions include a constant page width, a linearly varying page width, or a segmented variation of the page width.

[0021] It's understandable that a constant page width means the page width pre-configured for display on the terminal device is fixed and doesn't change with screen state (or screen size). A linearly changing page width means the page width pre-configured for display on the terminal device changes with screen size; for example, the wider the screen, the wider the page, exhibiting a linear change. A segmentedly changing page width means the page width pre-configured for display on the terminal device is related to screen size; for example, when the screen width is greater than or equal to a preset threshold, the page width is a fixed value, and when the screen width is less than the preset threshold, the page width is another fixed value.

[0022] In one possible implementation of the first aspect, the server can further mark nodes in the target syntax tree that match the collapsed state of the terminal device screen and nodes that match the unfolded state of the terminal device screen, thereby obtaining marking information for each node in the target syntax tree. This marking information is used by the target terminal device to determine which nodes in the target syntax tree match the current screen state, thus better distinguishing the affiliation of nodes in the target syntax tree. It is understood that since some nodes in the target syntax tree are the same nodes as those in the first and second syntax trees, there can be nodes in the target syntax tree that belong to both the first and second syntax trees.

[0023] In one possible implementation of the first aspect, when the server sends the target page configuration information corresponding to the target application to the target terminal device, it sends the target page configuration information corresponding to both the target terminal device and the target application.

[0024] Secondly, a page display method is provided, applied to a terminal device in a communication system. The communication system includes a server and at least one terminal device, with the server communicating with each of the at least one terminal device. In this method, in response to a launch operation of a target application, the terminal device sends a first page information request to the server and receives target page configuration information and first page content. Based on the target page configuration information and the first page content, the terminal device displays an application page of the target application that matches the current first screen state. If the terminal device switches from the current first screen state to a second screen state, it sends a second page request to the server and receives second page content. Based on the target page configuration information and the second page content, the terminal device displays an application page of the target application that matches the current second screen state.

[0025] The above target page configuration information is a fusion of different page configuration information corresponding to the application page of the target application in different screen states of the terminal device; the first screen state indicates that the screen of the terminal device is in a folded state or an unfolded state; the second screen state indicates that the screen of the terminal device is in an unfolded state or a folded state.

[0026] As can be seen, in the above page display method, the terminal device can obtain the target page configuration information from the server once after the target application starts, instead of repeatedly obtaining page configuration information specific to the current screen state. Then, the terminal device displays the application page that matches the current screen state based on the target page configuration information. This reduces the process of repeatedly obtaining the corresponding page configuration information from the server when the screen state changes, significantly saving information retrieval time, thereby improving terminal device performance, reducing user waiting time, and enhancing the user experience.

[0027] In one possible implementation of the second aspect, the terminal device obtains target HTML information and target CSS information from the target page configuration information, and obtains a target syntax tree based on the target HTML information; the target syntax tree includes nodes corresponding to multiple screen states. The terminal device obtains at least one target node matching the first screen state from the target syntax tree based on the tag information of each node. The terminal device obtains target rules that conform to the terminal device's preset display conditions based on the target CSS information. The terminal device displays the application page of the target application based on the hierarchical relationship between at least one target node, the syntax content of at least one target node, the target rules, and the content of the first page.

[0028] Wherein, at least one target node has a hierarchical relationship with another target node, and at least one target node in the target syntax tree is used to represent at least one grammatical content in the target syntax tree.

[0029] In this implementation, since the target page configuration information includes target HTML information and target CSS information, and the nodes in the target syntax tree corresponding to the target HTML information have their own affiliations, and the target rules corresponding to the target CSS information include rules that meet the preset display conditions of the terminal device, the terminal device can directly obtain the configuration information that matches the current screen state from the target page configuration information.

[0030] Thirdly, a page display method is provided, applied to a communication system, which includes a server and at least one terminal device, wherein the server communicates with at least one terminal device. In this method,

[0031] The server obtains the different page configuration information corresponding to the target application in different screen states of the terminal device; the page configuration information is used to configure the application pages of the target application.

[0032] The server merges the different page configuration information corresponding to different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application; the target page configuration information includes the configuration information used to display the application page in multiple screen states.

[0033] In response to the launch operation of the target application, the target terminal device sends a request for the first page information to the server; at least one terminal device includes the target terminal device.

[0034] The server receives the first page information request and sends the target page configuration information and first page content corresponding to the target application to the target terminal device.

[0035] The target terminal device receives the target page configuration information and the first page content, and displays the application page of the target application that matches the current first screen state based on the target page configuration information and the first page content; the first screen state indicates whether the terminal device's screen is in a folded state or an unfolded state.

[0036] If the target terminal device switches from the current first screen state to the second screen state, the target terminal device sends a second page request information to the server.

[0037] The server receives the second page information request and sends the second page content corresponding to the target application to the target terminal device.

[0038] The target terminal device receives the content of the second page and displays the application page of the target application that matches the current second screen state based on the target page configuration information and the content of the second page; the second screen state indicates whether the terminal device's screen is in an unfolded state or a collapsed state.

[0039] Fourthly, a communication system is provided, including a server and at least one terminal device, wherein the at least one terminal device includes a target terminal device.

[0040] The server is used to obtain different page configuration information corresponding to the target application under different screen states of the terminal device, and to merge the different page configuration information corresponding to different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application; the page configuration information is used to configure the application pages of the target application; the target page configuration information includes configuration information for displaying application pages under multiple screen states.

[0041] The target terminal device is used to send a request for the first page information to the server in response to the launch operation of the target application.

[0042] The server is also used to receive first page information requests and send the target page configuration information and first page content corresponding to the target application to the target terminal device.

[0043] The target terminal device is also used to receive target page configuration information and first page content, and display the application page of the target application that matches the current first screen state according to the target page configuration information and first page content; the first screen state indicates that the screen of the terminal device is in a folded state or an unfolded state.

[0044] If the target terminal device switches from the current first screen state to the second screen state, the target terminal device is also used to send a second page request information to the server.

[0045] The server is also used to receive requests for second-page information and send the second-page content corresponding to the target application to the target terminal device.

[0046] The target terminal device is also used to receive the content of the second page, and display the application page of the target application that matches the current second screen state according to the target page configuration information and the content of the second page; the second screen state indicates whether the screen of the terminal device is in an unfolded state or a folded state.

[0047] Fifthly, an electronic device is provided, including a memory and one or more processors; the memory is coupled to the processors; wherein the memory stores computer program code, the computer program code including computer instructions, which, when executed by the processor, cause the electronic device to perform a page display method as described in the first aspect and any implementation thereof, or to perform a page display method as described in the second aspect and any implementation thereof.

[0048] A sixth aspect provides a computer-readable storage medium including computer instructions that, when executed on an electronic device, cause the electronic device to perform a page display method as described in the first aspect and any implementation thereof, or to perform a page display method as described in the second aspect and any implementation thereof.

[0049] In a seventh aspect, a computer program product is provided, which, when run on a computer, causes the computer to execute a page display method as described in the first aspect and any implementation thereof, or to execute a page display method as described in the second aspect and any implementation thereof.

[0050] Understandably, the beneficial effects that the page display method described in the third aspect, the communication system described in the fourth aspect, the electronic device described in the fifth aspect, the computer-readable storage medium described in the sixth aspect, and the computer program product described in the seventh aspect can achieve can be referred to the beneficial effects of the first aspect and any possible design method therein or the second aspect and any possible design method therein, and will not be repeated here. Attached Figure Description

[0051] Figure 1 This is a schematic diagram illustrating the commonly used method for obtaining page configuration information in foldable screen phones, as shown in the embodiments of this application. Figure 1 ;

[0052] Figure 2 This is a schematic diagram illustrating the commonly used method for obtaining page configuration information in foldable screen phones, as shown in the embodiments of this application. Figure 2 ;

[0053] Figure 3 This is a schematic diagram illustrating a communication system according to an embodiment of this application;

[0054] Figure 4 A schematic diagram of a terminal device shown in an embodiment of this application. Figure 1 ;

[0055] Figure 5 A schematic diagram of a terminal device shown in an embodiment of this application. Figure 2 ;

[0056] Figure 6 A flowchart illustrating the page display method in an embodiment of this application. Figure 1 ;

[0057] Figure 7 A flowchart illustrating the page display method in an embodiment of this application. Figure 2 ;

[0058] Figure 8 This is a schematic diagram of the target syntax tree shown in an embodiment of this application;

[0059] Figure 9 A flowchart illustrating the page display method in an embodiment of this application. Figure 3 ;

[0060] Figure 10 This is a schematic diagram illustrating the target rule in an embodiment of this application;

[0061] Figure 11 This is a schematic diagram of an application page shown in an embodiment of this application;

[0062] Figure 12 This is a schematic diagram of the structure of an electronic device shown in an embodiment of this application. Detailed Implementation

[0063] The technical solutions of the embodiments of this application will be described below with reference to the accompanying drawings. In the description of this application, unless otherwise stated, " / " indicates that the objects before and after are in an "or" relationship. For example, A / B can represent A or B. "And / or" in this application is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A alone, A and B simultaneously, and B alone, where A and B can be singular or plural. Furthermore, in the description of this application, unless otherwise stated, "multiple" refers to two or more. "At least one of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one of a, b, or c can represent: a, b, c, ab, ac, bc, or abc, where a, b, and c can be single or multiple. Furthermore, to facilitate a clear description of the technical solutions in the embodiments of this application, the terms "first" and "second" are used in the embodiments of this application to distinguish identical or similar items with substantially the same function and effect. Those skilled in the art will understand that the terms "first" and "second" do not limit the quantity or execution order, and that "first" and "second" are not necessarily different. Meanwhile, in the embodiments of this application, the terms "exemplary" or "for example" are used to indicate that something is being used as an example, illustration, or description. Any embodiment or design scheme described as "exemplary" or "for example" in the embodiments of this application should not be construed as being more preferred or advantageous than other embodiments or design schemes. Specifically, the use of terms such as "exemplary" or "for example" is intended to present related concepts in a concrete manner for ease of understanding.

[0064] Furthermore, the business scenarios described in the embodiments of this application are for the purpose of more clearly illustrating the technical solutions of the embodiments of this application, and do not constitute a limitation on the technical solutions provided in the embodiments of this application. As those skilled in the art will know, with the emergence of new business scenarios, the technical solutions provided in the embodiments of this application are also applicable to similar technical problems.

[0065] Currently, to ensure that application pages displayed on different electronic devices adapt to their screen sizes, the server typically configures corresponding page settings for each device's screen size. These settings include Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS). Furthermore, different screen sizes are considered for different electronic devices, such as mobile phones and tablets. Alternatively, different screen states may be considered, such as folded / expanded, landscape / portrait, full-screen / split-screen displays, etc.

[0066] For example, see Figure 1 As shown, when a foldable phone switches or changes its screen state, it sends a request to the server. This request includes information indicating the phone's current state. The server determines the phone's current state based on this information. If the phone is folded, the server sends the corresponding page configuration information. The foldable phone receives this information and then uses the HTML and CSS provided to layout and display the corresponding application page on the folded screen. Conversely, if the phone is unfolded, the server sends the corresponding page configuration information. The foldable phone receives this information and then uses the HTML and CSS provided to layout and display the corresponding application page on the unfolded screen.

[0067] See Figure 2 As shown, every time a foldable phone switches states, it needs to retrieve the corresponding page configuration information from the server and re-display the application page. While this method ensures that the correct application page can be displayed in both folded and unfolded states, it takes time for the foldable phone to retrieve new page configuration information each time. At the same time, users also need to wait a long time for the application page to be re-displayed. If the foldable phone switches states frequently, repeatedly requesting page configuration information from the server will lead to poor performance of the foldable phone and affect the user experience.

[0068] Based on the above, this application provides a page display method. On one hand, the server obtains different page configuration information corresponding to the target application under different screen states of the terminal device, and then merges the different page configuration information corresponding to the different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application. Then, after receiving a first page information request sent by the target terminal device after the target application is launched, the server sends the target page configuration information and first page content to the target terminal device. The first page content is used by the target terminal device to display the application page of the target application that matches the current screen state, based on the target page configuration information. After receiving a second page information request sent by the target terminal device after the target application is launched, the server sends a second page content to the target terminal device. The second page content is used by the target terminal device to display the application page of the target application that matches the current screen state, based on the already obtained target page configuration information.

[0069] The above page configuration information is used to configure the application pages of the target application, and the target page configuration information includes configuration information for displaying the application pages in multiple screen states.

[0070] On the other hand, in response to the launch operation of the target application, the target terminal device sends a first page information request to the server. Upon receiving the first page information request, the server sends target page configuration information and first page content to the target terminal device. Furthermore, after receiving the target page configuration information and first page content, the target terminal device displays the application page of the target application that matches the current first screen state, based on these information. If the target terminal device switches from the current first screen state to the second screen state, the target terminal device sends a second page information request to the server, and the server sends the second page content to the target terminal device. Finally, the target terminal device displays the application page of the target application that matches the current second screen state, based on the already acquired target page configuration information and the currently acquired second page content.

[0071] The aforementioned first screen state indicates that the screen of the target terminal device is either folded or unfolded.

[0072] In the above method, the server can merge the different page configuration information corresponding to the target application in different screen states of the terminal device into a unified target page configuration information. The target terminal device does not need to repeatedly retrieve page configuration information specific to the current screen state from the server; instead, it only needs to retrieve the unified target page configuration information once after the target application starts. Then, the target terminal device displays the application page of the target application that matches the current screen state based on the target page configuration information. This reduces the process of repeatedly retrieving the corresponding page configuration information from the server when the target terminal device switches screen states, greatly saving information retrieval time, thereby improving terminal device performance, reducing user waiting time, and enhancing the user experience.

[0073] The page display method provided in this application embodiment can be applied to communication systems. For example... Figure 3 As shown, the communication system includes a server 300 and at least one terminal device 301. The at least one terminal device 301 is communicatively connected to the server 300.

[0074] Server 300 can refer to a single server or a server cluster. A server cluster includes multiple servers, and information and data can be shared among these servers.

[0075] In some potential application scenarios, server 300 can act as an "application marketplace," providing configuration information, data, and resources for the applications within it. These applications may include browsers, video, music, navigation, maps, and telephone applications.

[0076] When an application developer lists or registers their application in the "App Store," they will upload relevant application information to the "App Store." This information includes page configuration information used to display the application pages on the terminal device's 301 screen.

[0077] The application page of the same target application may be displayed in different forms, methods, and styles on screens of different sizes. Different terminal devices 301 may have different screen sizes, or a foldable terminal device 301 may have different screen sizes in its folded and unfolded states. In order to make the application page of the target application displayed on the terminal device 301 adapt to the screen size of the terminal device 301, developers often set corresponding page configuration information for terminal devices 301 with different screen sizes.

[0078] For example, for terminal device A1 with a screen size of 300px, the page configuration information corresponding to the application page of the target application is X1; for terminal device A2 with a screen size of 350px, the page configuration information corresponding to the application page of the target application is X2; for terminal device A3 with a screen size of 677px in the expanded state, the page configuration information corresponding to the application page of the target application is X3; and for terminal device A3 with a screen size of 375px in the folded state, the page configuration information corresponding to the application page of the target application is X4.

[0079] Among them, the content displayed on the application page of target application 1 on terminal device A3 with a screen size of 375px, according to the page configuration information X4, is as follows: Figure 4 As shown in (a); the content displayed on the application page of target application 1 on terminal device A3 with a screen size of 677px according to the page configuration information X3 is as follows. Figure 4 As shown in (b) above. It is understood that, for the foldable terminal device A3, different screen states can correspond to different page configuration information of the application page, and different screen states indicate that the screen of the terminal device A3 is in an unfolded state or a folded state, and the screen size in the folded state is smaller than the screen size in the unfolded state.

[0080] After obtaining the page configuration information of the target application's application page under different screen sizes or screen states, server 300 can merge the different page configuration information corresponding to a target application into a unified target page configuration information. For example, server 300 merges the page configuration information X3 and page configuration information X4 corresponding to target application 1 into target page configuration information X5 corresponding to target application 1.

[0081] When the target application starts, the terminal device 301 sends a request for application page information to the server 300. In response to this request, the server 300 sends the target page configuration information of the target application to the terminal device 301. The terminal device 301 obtains page configuration information that matches the current screen state from the target page configuration information and displays the application page of the target application according to the page configuration information.

[0082] In some potential application scenarios, after receiving a page information request, server 300 can also send other application page-related information, such as page resources and page content, to terminal device 301. Thus, based on the aforementioned target page configuration information and page content, terminal device 301 can display the complete application page content.

[0083] Among them, the terminal device 301 can lay out the content of the application page (such as content location, resource location, content display method, resource display method, etc.) and configure the style of the application page (such as font, background color, font color, etc.) according to the page configuration information.

[0084] In some potential application scenarios, the page configuration information corresponding to the application page of the aforementioned target application may include Hypertext Markup Language (HTML) information and Cascading Style Sheets (CSS) information. The merged target page configuration information includes the target HTML information and the target CSS information.

[0085] When merging configuration information from different pages, the HTML information from each page configuration is merged to obtain the target HTML information, and the CSS information from each page configuration is merged to obtain the target CSS information. The target HTML information includes the HTML information of the application pages used to configure the target application across multiple screen sizes (or multiple screen states); the target CSS information includes the CSS information of the application pages used to configure the target application across multiple screen sizes (or multiple screen states).

[0086] This involves parsing HTML information to obtain the syntax tree or abstract syntax tree (AST) corresponding to the application page. The syntax tree or AST is a tree-like representation of the abstract syntactic structure of the application page's source code. The syntax tree includes at least one node with a hierarchical relationship, and each node represents a structure or syntactic content in the source code. The abstract syntax tree does not depend on the syntax of the source language.

[0087] The aforementioned CSS information instructs the terminal device 301 on how to display the elements in the HTML on the screen. In other words, the CSS information defines the style of the application page, including design and layout tailored to different terminal devices 301 and screen sizes. Correspondingly, by parsing the CSS information, rules for displaying the application page can be obtained. These rules refer to the display rules for the application page configured for a specific screen size of the terminal device 301. Specifically, the elements in the aforementioned HTML can be displayed, thereby further showcasing the application page.

[0088] When fusing HTML information, server 300 can parse the different HTML information corresponding to each application page into corresponding syntax trees, and then fuse these different syntax trees into a target syntax tree. The target HTML information is then generated using this target syntax tree. The fused target syntax tree includes nodes corresponding to multiple screen sizes (or multiple screen states).

[0089] When fusing CSS information, server 300 can parse the different CSS information corresponding to each application page into corresponding rules, and then fuse these different rules into a target rule. The target rule is then used to generate the target CSS information. The fused target rule includes rules that conform to the preset display conditions of terminal device 301. These preset display conditions represent the display conditions or requirements preset by terminal device 301, which may specifically include a constant application page width, a linearly changing application page width, or a segmented changing application page width.

[0090] For example, taking a foldable screen terminal device 301 as an example, a constant application page width means that for terminal device 301, even if the screen state or screen size of terminal device 301 changes, the width of the displayed application page remains constant. A linearly changing application page width means that for terminal device 301, if the screen state or screen size of terminal device 301 changes, the width of the displayed application page changes linearly; for example, if the screen width increases, the width of the application page also increases accordingly. A segmentedly changing application page width means that for terminal device 301, if the screen state or screen size of terminal device 301 changes, the width of the displayed application page is a fixed value when the screen width is greater than or equal to a preset threshold, and another fixed value when the screen width is less than the preset threshold. For example, if the screen width is less than 350px after the screen size changes, the width of the displayed application page is 100px; if the screen width is greater than 350px after the screen size changes, the width of the displayed application page is 120px.

[0091] It is understood that the screen width mentioned in this application embodiment refers to the screen width that can display content in the current screen state. For example, see [link to example]. Figure 4 As shown in (a) of the diagram, the screen of the terminal device is currently in a folded state. In this case, the width L1 shown in the diagram represents the screen size. For another example, see [reference needed]. Figure 4 As shown in (b) in the figure, the terminal device is currently in the unfolded state. At this time, the width L2 shown in the figure represents the screen size.

[0092] In some potential application scenarios, in response to the launch of the target application, after the terminal device 301 sends a first page information request to the server 300, it can obtain the target page configuration information and the first page content from the server 300. Based on the information in the target page configuration information that matches the current screen state and the first page content, the terminal device 301 displays the application page in the current screen state. Subsequently, during the operation of the target application, the terminal device 301 will not obtain the target page configuration information from the server 300 again. When the screen state of the terminal device 301 changes, the terminal device 301 can send a second page information request to the server 300. The server 300 sends the second page content to the terminal device 301 without sending the target page configuration information again. Therefore, the terminal device 301 can rearrange the application page in the current screen state based on the already obtained target page configuration information and the currently obtained second page content.

[0093] In other possible application scenarios, the aforementioned first page information request can be seen as the first page information request sent by terminal device 301 to server 300 after the target application starts, while the second page information request can be seen as a page information request sent by terminal device 301 to server 300 again during the operation of the target application. Specifically, terminal device 301 can send page request information to server 300 again when the application page of the target application needs to be redirected or refreshed, thereby obtaining page content from server 300 that matches the application page to be displayed.

[0094] Referring to the foregoing embodiments, the target page configuration information includes target HTML information and target CSS information. The target syntax tree corresponding to the target HTML information includes nodes corresponding to multiple screen states (or screen sizes) of the terminal device 301. Furthermore, the target rules corresponding to the target CSS information include rules that conform to the preset display conditions of the terminal device 301. The terminal device 301 can obtain the corresponding nodes and the rules conforming to the preset display conditions from the target page configuration information based on the current screen state, and display an application page matching the current screen state based on the hierarchical relationship between the obtained nodes, the syntax content, the obtained rules, and the page content.

[0095] In some possible application scenarios, the process of changing or switching the above screen state (or screen size) can be, for example, switching from a folded state to an unfolded state, from an unfolded state to a folded state, from a landscape state to a portrait state, from a portrait state to a landscape state, from a full-screen display state to a split-screen display state, and from a split-screen display state to a full-screen display state.

[0096] For example, if the current screen state of terminal device 301 is expanded, terminal device 301 obtains the syntax tree node corresponding to the expanded state from the target HTML information in the target page configuration information, and obtains the corresponding target rule from the target CSS information. Based on the obtained hierarchy of the syntax tree nodes, syntax content, target rules, and page content, it displays the application page of the target application in the expanded state. When the screen state of terminal device 301 switches to the collapsed state, terminal device 301 again obtains the syntax tree node corresponding to the collapsed state from the target HTML information in the target page configuration information, and obtains the corresponding target rule from the target CSS information. Based on the currently obtained hierarchy of the syntax tree nodes, syntax content, target rules, and page content, it displays the application page of the target application in the collapsed state.

[0097] In some possible application scenarios, the screen sizes of at least one terminal device 301 in the above communication system can be the same or different. If terminal device 301 is not a foldable screen, after obtaining the target page configuration information from server 300, terminal device 301 can display the application page according to the configuration information (such as node content in the syntax tree, target rules, etc.) corresponding to the current screen size in the target page configuration information. Since the screen size or screen state of terminal device 301 does not change, terminal device 301 does not need to display the application page according to changes in screen size.

[0098] In other possible application scenarios, the terminal device 301 in the aforementioned communication system may also include at least two screen states: an unfolded state and a folded state. The terminal device 301 including at least two screen states can be a foldable screen terminal device such as a foldable screen phone, a foldable screen computer, or a foldable screen display. Furthermore, the screen folding direction of this foldable screen terminal device can be either horizontal or vertical.

[0099] In some potential application scenarios, the aforementioned foldable screen terminal device may include two screens, one of which is a foldable screen. For example, using... Figure 5 Taking (a) and (b) as examples, when the screen of the foldable terminal device is folded horizontally, the foldable terminal device includes a screen 501 and a foldable screen 502. In the folded state, the screen 502 folds inward. The screen 501 is used to display content when the screen 502 is in the folded state, while when the screen 502 is in the unfolded state, the screen 501 can be turned off and not display content.

[0100] In other possible application scenarios, the aforementioned foldable screen terminal device may include a screen that is foldable. For example, Figure 5Taking (c) and (d) as examples, when the screen of the foldable terminal device is folded horizontally, in the folded state, the foldable screen 503 folds outward, and half or part of the folded screen can display content.

[0101] It is understood that the screen size mentioned in this embodiment refers to the size of the screen currently in use or displaying content on the terminal device 301. For example, when the screen 502 is in a folded state, the screen size refers to the size of the screen 501; when the screen 502 is in an unfolded state, the screen size refers to the size of the screen 502. When the screen 503 is in a folded state, the screen size refers to the size of half or a portion of the content displayed on the screen 503; when the screen 503 is in an unfolded state, the screen size refers to the size of the screen 503.

[0102] In some potential application scenarios, after receiving different page configuration information corresponding to the target application, the server 300 can merge the corresponding target page configuration information for different manufacturers and models of terminal devices 301. When the terminal device 301 needs to obtain target page configuration information from the server 300, the page information request sent by the terminal device 301 to the server 300 may also include the model information or manufacturer information of the terminal device 301, so that the server 300 can send the corresponding target page configuration information to the terminal device 301 according to the model information or manufacturer information.

[0103] In other possible application scenarios, server 300 can integrate the corresponding target page configuration information for terminal devices 301 of different manufacturers and models, and then send all the target page configuration information to terminal devices 301. Terminal devices 301 can then retrieve the target page configuration information corresponding to their own manufacturer and model from the complete set of target page configuration information.

[0104] When implementing the page display method in this application embodiment based on the aforementioned communication system, the server can merge the different page configuration information corresponding to the target application under different screen states of the terminal device into unified target page configuration information. The terminal device does not need to repeatedly obtain page configuration information specific to the current screen state from the server; instead, it only needs to obtain the unified target page configuration information once after the target application starts. Then, the terminal device displays the application page matching the current screen state according to the target page configuration information. This reduces the process of repeatedly obtaining the corresponding page configuration information from the server when the terminal device switches screen states, greatly saving information acquisition time, thereby improving the performance of the terminal device, reducing user waiting time, and improving the user experience.

[0105] The following describes the aforementioned terminal devices as follows: Figure 5 Taking the foldable screen phone shown in (a) and (b) as an example, the page display method in the embodiments of this application will be described. Figure 6 As shown, the method for displaying this page includes the following steps S601-S608.

[0106] S601. The server obtains the different page configuration information corresponding to the target application in different screen states of the foldable phone.

[0107] Page configuration information is used to configure the application pages of the target application. The page size displayed on the target application's application pages may differ on foldable phones with different screen sizes. For example, the screen size of a foldable phone is smaller when the screen is folded compared to when it is unfolded. Therefore, the page size displayed on the folded screen will be smaller than the page size displayed on the unfolded screen.

[0108] Therefore, to ensure that application pages displayed on foldable phones can adapt to the screen size in different screen states, developers often set corresponding page configuration information for the target application based on the different screen states or screen sizes of the foldable phone. This page configuration information instructs the foldable phone to lay out and construct the application page accordingly. For example, for the folded state of the foldable phone, the application page corresponds to the first page configuration information; for the unfolded state, the application page corresponds to the second page configuration information.

[0109] It is understandable that, because the target application can be obtained and installed by multiple terminal devices, when the server obtains different page configuration information, the different page configuration information can include not only the configuration information corresponding to foldable screen phones, but also the page configuration information corresponding to other foldable screen terminal devices. Here, foldable screen phones and foldable screen terminal devices are all terminal devices that can install the aforementioned target application.

[0110] In some embodiments, the screen states of a foldable phone may include at least a folded state and an unfolded state. Furthermore, when the foldable phone is in the folded state, the angle of the folded screen is less than or equal to a preset angle, wherein the preset angle is at most 90 degrees and at least 0 degrees; for example, the preset angle can be 60 degrees, 50 degrees, 45 degrees, etc. If the angle of the folded screen is greater than the preset angle, it indicates that the foldable phone is in the unfolded state. When the foldable phone is in the unfolded state, the maximum angle of the unfolded screen is 180 degrees.

[0111] When developers of a target app list it on servers such as app stores, they also upload relevant information about the target app to the server. This information includes page configuration information for displaying the app's pages in different screen states on a foldable phone.

[0112] The aforementioned page configuration information includes HTML and CSS information used to display the application page. For example, if the collapsed state corresponds to the first page configuration information, the first page configuration information includes the first HTML information and the first CSS information. If the expanded state corresponds to the second page configuration information, the second page configuration information includes the second HTML information and the second CSS information.

[0113] S602, The server merges the different page configuration information corresponding to different screen states of the foldable phone to obtain the target page configuration information of the terminal device corresponding to the target application.

[0114] The target page configuration information includes the merged target HTML information and the merged target CSS information.

[0115] For example, if the target application corresponds to first page configuration information and second page configuration information respectively, the server can merge the first HTML information in the first page configuration information with the second HTML information in the second page configuration information to obtain the target HTML information. Similarly, the server can merge the first CSS information in the first page configuration information with the second CSS information in the second page configuration information to obtain the target CSS information.

[0116] The server can merge different page configuration information into unified target page configuration information. Therefore, when a foldable phone with the target application installed requests relevant information from the server after the target application is launched, the server can send the corresponding target page configuration information to the foldable phone in one go. During the normal operation of the target application after it is launched, the foldable phone does not need to request page configuration information from the server again, saving information or data transmission time.

[0117] In some embodiments, when a server merges different HTML information into a unified target HTML information, it can first parse the different HTML information separately to obtain different syntax trees (or abstract syntax trees). Then, the different syntax trees are merged.

[0118] For example, if the target application corresponds to the configuration information on the first page and the configuration information on the second page respectively, see [link to relevant documentation]. Figure 7As shown, the server can obtain a first syntax tree corresponding to the application page of the target application based on the first HTML information, and a second syntax tree corresponding to the application page of the target application based on the second HTML information. Then, the server continues to obtain a first set of nodes based on the same nodes in the first and second syntax trees, and a second set of nodes based on the different nodes in the first and second syntax trees. Finally, the server inserts the nodes from the second set of nodes into the first set of nodes to generate the target syntax tree, and obtains the target HTML information based on the target syntax tree.

[0119] In this context, "identical nodes" refers to nodes with identical syntax content and / or identical class and ID. In some applications, a node's syntax content can reflect its function and purpose, while its class and ID can reflect its hierarchy, position, and relationship with other nodes in the syntax tree. "Different nodes" refers to nodes with different syntax content, and / or different class and ID.

[0120] For example, when determining whether nodes in the first and second syntax trees are the same, the server can use, for example, a diff algorithm. The structures of the first and second syntax trees can be found in [reference needed]. Figure 8 As shown, the server can first compare the root node S11 in the first syntax tree and the root node S21 in the second syntax tree. If the syntax content of the two nodes is the same, then the two nodes are considered to be the same. If the syntax content of S11 and S21 is different, the server compares whether the class and id of S11 and S12 are the same. If both the class and id of the two nodes are the same, then the two nodes are considered to be the same. Afterwards, the server can continue to compare the child node S12 in the first syntax tree and the child node S22 in the second syntax tree.

[0121] If the syntax of S11 and S21 is different, and the class and / or id of S11 and S21 are different, then S11 and S21 are considered to be different. In this case, the server can determine whether S12 under the S11 node is the same as S22 under the S21 node. If S12 is the same as S21, the server can still consider S11 and S21 to be the same node.

[0122] like Figure 8As shown, in the two syntax trees, nodes S11 and S21, S12 and S22, S13 and S24, S14 and S25, S15 and S26, S18 and S28, and S19 and S29 are the same nodes, which form the first node set; while nodes S23, S27, S16, and S17 are different nodes, which form the second node set.

[0123] Furthermore, if the nodes in the node set have hierarchical or logical relationships with each other, these nodes can also be stored in the node set according to these relationships, such as storing a tree structure composed of nodes. Alternatively, the node set can also include individual nodes.

[0124] For example, such as Figure 8 As shown, when the server generates the target syntax tree, it can merge identical nodes from the first node set with different nodes from the second node set to form a single target syntax tree. Furthermore, to better distinguish the affiliation of nodes in the target syntax tree, nodes belonging to the first syntax tree (i.e., nodes matching the fold) and nodes belonging to the second syntax tree (i.e., nodes matching the unfolded state) can be marked. It is understandable that since some nodes in the target syntax tree are identical to those in both the first and second syntax trees, nodes belonging to both can exist in the target syntax tree. The marked nodes include corresponding marking information, specifically indicating the node's affiliation.

[0125] After obtaining the target syntax tree, the server then compresses and compiles the target syntax tree to obtain target HTML information that is easy to transmit.

[0126] In the above embodiments, when the server merges page configuration information corresponding to different screen states (or screen sizes), it can merge different syntax trees in different page configuration information, so that the merged target syntax tree can be applied to foldable screen phones with different screen states (or screen sizes).

[0127] In some embodiments, when a server merges different CSS information into a unified target CSS information, it can first parse the different CSS information separately to obtain different rules, and then merge the different rules.

[0128] For example, if the application pages correspond to the configuration information on the first page and the configuration information on the second page respectively, see [link to relevant documentation]. Figure 9As shown, the server can obtain a first rule based on the first CSS information, and a second rule based on the second CSS information. The server then merges the first rule and the second rule into a target rule that conforms to the preset display conditions of the foldable screen phone, and obtains the target CSS information based on the target rule.

[0129] The first rule mentioned above can represent the rules for displaying application pages on a foldable phone when the screen is folded, and the second rule can represent the rules for displaying application pages on a foldable phone when the screen is unfolded. For example, displaying an application page with a width of 16px on a foldable phone when the screen is folded can represent the first rule; displaying an application page with a width of 120px on a foldable phone when the screen is unfolded can represent the second rule.

[0130] Furthermore, the aforementioned preset display conditions include at least three: the first condition can indicate a constant page width, the second condition can indicate a linearly changing page width, and the third condition can indicate a segmentedly changing page width. A constant page width means the page width pre-configured for display on the foldable phone is fixed and does not change with screen state (or screen size). A linearly changing page width means the page width pre-configured for display on the foldable phone changes with screen size; for example, the wider the screen, the wider the page, exhibiting a linear change. A segmentedly changing page width means the page width pre-configured for display on the foldable phone is related to screen size; for example, when the screen width is greater than or equal to a preset threshold, the page width is a fixed value, and when the screen width is less than the preset threshold, the page width is another fixed value. Moreover, in the merged target rule, the page width displayed on the foldable phone is determined jointly based on the widths required by the first and second rules respectively.

[0131] For example, Figure 10The diagram illustrates rule fusion methods that meet various preset display conditions. If the impact of screen length variations on page display is disregarded, for multiple rules displaying application pages with dimensions of 300px*16px, 350px*16px, and 400px*16px respectively, the target rule obtained after the first conditional fusion rule is to display an application page with a width of 16px. For multiple rules displaying application pages with dimensions of 300px*270px, 350px*320px, and 400px*370px respectively, the target rule obtained after the second conditional fusion rule is to display an application page with a width of 100vw-30px, where vw represents the width unit of the visible window, and 100vx can represent the screen width of the currently displayed application page. For the multiple rules that display application pages with sizes of 300px*100px, 350px*120px, and 400px*120px respectively, the target rule obtained after merging the rules based on the third condition mentioned above is to display application pages with segmented width changes. That is, when the screen width is greater than or equal to 350px, the displayed page width is 120px, and when the screen width is less than 350px, the displayed page width is 100px.

[0132] Understandably, the server obtains the preset display conditions for different foldable screen phones, and then integrates them according to a unified target rule for different foldable screen phones.

[0133] After obtaining the target rules, the server then compresses and compiles the target syntax tree to obtain target CSS information that is easy to transmit.

[0134] In the above embodiments, when the server merges page configuration information corresponding to different screen states (or screen sizes), it can merge different display rules in different page configuration information so that the merged target rule can be applied to foldable screen phones with different screen states (or screen sizes).

[0135] In addition, since this application embodiment takes a horizontally foldable screen phone as an example, when integrating display rules, the impact of screen length changes on application page display can be temporarily ignored or disregarded, while the impact of screen width changes on application page display can be considered.

[0136] S603, the target foldable phone responds to the launch operation of the target application by sending a request for the first page information to the server.

[0137] The target foldable phone refers to a phone that has the target application installed. In order to provide the application page to the user as quickly as possible when the target application is launched and to ensure a good user experience, the target foldable phone needs to send a first page information request to the server when the target application is launched. This request asks the server to send relevant information about the target application so that the target foldable phone can display the application page based on that information.

[0138] S604. The server receives the first page information request and sends the target page configuration information and first page content corresponding to the target application to the target foldable screen phone.

[0139] The first page content represents the content and resources that the target application needs to display on its current application page, such as images, videos, text, search boxes, icons, etc.

[0140] It is understandable that the first page information request refers to the first page information request sent by the target foldable phone to the server after the target application is launched.

[0141] In some potential application scenarios, after the target application starts running, the application page may respond with actions such as redirection or refresh based on user input or the application's configuration. During these redirections or refreshes, the target foldable phone can send a request for a second page of information to the server.

[0142] In some embodiments, the server can merge the page configuration information of each application across different terminal devices and screen states. It is understood that the merged target page configuration information includes not only the corresponding application but also the corresponding terminal device. Therefore, the target page configuration information sent by the server to the target foldable phone is the target page configuration information corresponding to both the target foldable phone and the target application. This ensures that the target foldable phone receives accurate configuration information.

[0143] S605: The target foldable phone receives the target page configuration information and the first page content, and displays the application page of the target application that matches the current first screen state based on the target page configuration information and the first page content.

[0144] The first screen state can indicate whether the target foldable phone's screen is in a folded or unfolded state.

[0145] Referring to the aforementioned embodiments, the target page configuration information includes target HTML information and target CSS information. The nodes in the target syntax tree corresponding to the target HTML information also have their respective affiliations, and the target rules corresponding to the target CSS information include rules that conform to the preset display conditions of the foldable phone. In this way, the target foldable phone can directly obtain configuration information matching its current screen state from the target page configuration information. Furthermore, when the target foldable phone displays an application page, it can first determine its current screen state, such as the first screen state, and then obtain information corresponding to the first screen state from the target page configuration information before displaying the application page based on this information.

[0146] In some embodiments, when the target foldable phone displays an application page matching the current first screen state, it can obtain target HTML information and target CSS information from the target page configuration information. Then, the target foldable phone obtains a target syntax tree based on the target HTML information, and from the target syntax tree, based on the tag information of each node, obtains at least one target node matching the first screen state. The target foldable phone then obtains target rules that meet the target foldable phone's preset display conditions based on the target CSS information, and displays the application page of the target application based on the hierarchical relationship between at least one target node, the syntax content of at least one target node, the target rules, and the content of the first page.

[0147] For example, when the first screen state represents a folded state, the target node that matches the first screen state refers to the node in the target syntax tree corresponding to the target HTML information that matches the folded state, such as the node in the target syntax tree corresponding to the target HTML information that is marked as folded; and if the current preset display condition of the target foldable screen phone is the aforementioned first condition, then the target rule that satisfies the first condition in the target rule corresponding to the target CSS information is obtained.

[0148] When the first screen state is in the expanded state, the target node that matches the first screen state refers to the node in the target syntax tree corresponding to the target HTML information that matches the expanded state, such as the node in the target syntax tree corresponding to the target HTML information that is marked as expanded; and if the current preset display condition of the target foldable screen phone is the aforementioned third condition, then the target rule that satisfies the third condition in the target rule corresponding to the target CSS information is obtained.

[0149] S606. If the target foldable phone switches from the current first screen state to the second screen state, the target foldable phone sends a second page information request to the server.

[0150] The second screen state indicates whether the target foldable phone's screen is in an unfolded or folded state. It's understandable that the first and second screen states are different; the target foldable phone switching from the first to the second screen state can represent a switch from a folded to an unfolded state, or vice versa.

[0151] When the target foldable phone's screen state changes, its screen size also changes. The size of the previously displayed application page may no longer match the changed screen size, and the displayed page content and resources may also change. Therefore, in this situation, the target foldable phone will send a second page information request to the server to obtain the new page content.

[0152] S607. The server receives the second page information request and sends the second page content corresponding to the target application to the target foldable screen phone.

[0153] In this embodiment, even if the screen state of the target foldable phone changes after the target application is launched, the target foldable phone will not request page configuration information from the server again. For example, the first page information request sent by the target foldable phone to the server after the target application is launched may include a request for target page configuration information, while subsequent second page information requests sent to the server do not include such a request. Therefore, the server will send target page configuration information to the target foldable phone in response to the first page information request, but will not send target page configuration information to the target foldable phone in response to the second page information request.

[0154] S608 and the target foldable phone display the application page of the target application that matches the current state of the second screen, based on the target page configuration information and the content of the second page.

[0155] When the target foldable phone changes its screen state, it does not need to retrieve the corresponding target page configuration information from the server again. Instead, it retrieves the configuration information corresponding to the current screen state from the previously retrieved target page configuration information, and then displays the application page in the current screen state based on the configuration information corresponding to the current screen state. For details, please refer to [link to relevant documentation]. Figure 11 As shown.

[0156] In some potential application scenarios, since the device displaying the application page (i.e., the target foldable phone itself) remains unchanged, even if the screen state of the target foldable phone changes, the pre-configured display conditions for the target foldable phone may not change. Consequently, the target rules obtained from the target page configuration information may also remain unchanged when the screen state of the target foldable phone changes. For example, when the target foldable phone's screen is folded, the target rule obtained from the target page configuration information is the rule that satisfies the first condition. When the target foldable phone's screen switches to the unfolded state, the target rule obtained from the target page configuration information can also be the rule that satisfies the first condition.

[0157] In other possible application scenarios, even if the device displaying the application page (i.e., the target foldable phone itself) remains unchanged, the preset display conditions pre-configured for the target foldable phone may change when its screen state changes. Consequently, the target rules obtained from the target page configuration information may also change when the target foldable phone's screen state changes. For example, when the target foldable phone's screen is folded, the target rule obtained from the target page configuration information satisfies the first condition; when the target foldable phone's screen switches to an unfolded state, the target rule obtained from the target page configuration information satisfies the second condition.

[0158] As described above, in the page display method provided in this application embodiment, the server can merge the different page configuration information corresponding to the target application in different screen states of a foldable phone into unified target page configuration information. The target foldable phone does not need to repeatedly obtain page configuration information specific to the current screen state from the server; instead, it only needs to obtain the unified target page configuration information once after the target application starts. Then, the target foldable phone displays the application page matching the current screen state based on the target page configuration information. This reduces the process of the target foldable phone repeatedly obtaining the corresponding page configuration information from the server when switching screen states, greatly saving information acquisition time, thereby improving the performance of the foldable phone, reducing user waiting time, and improving the user experience.

[0159] In the foregoing embodiments, all are as follows Figure 5 The above page display method will be explained using the foldable screen phone shown in (a) and (b) as an example. In other embodiments, the above page display method can also be applied to, for example, Figure 5The above-described page display method can be applied to other non-foldable screen terminal devices, such as foldable screen phones or phones with vertically foldable screens, as shown in (c) and (d). However, the terminal device can still switch between one or more screen states: from landscape to portrait, from portrait to landscape, from full-screen to split-screen, and from split-screen to full-screen.

[0160] When the above page display method is applied to a mobile phone with a vertically foldable screen, the server can temporarily disregard or ignore the impact of screen width changes on the application page display when merging display rules, and instead consider the impact of screen length changes. Furthermore, the method for obtaining the merged target rule when considering the impact of screen length changes on the application page display can refer to the method used in the aforementioned embodiments for obtaining the target rule when considering the impact of screen width changes on the application page display, and will not be repeated here.

[0161] Regardless of the type of foldable screen device (phone or terminal device) the page display method in this application embodiment is applied to, it can reduce the process of repeatedly obtaining the corresponding page configuration information from the server when the foldable screen terminal device switches screen states, thereby improving the performance of the foldable screen terminal device, greatly saving the time for information acquisition, reducing the user's waiting time, and improving the user experience.

[0162] In some possible application scenarios, when the screen state of a foldable phone changes, the foldable phone may not send a second page information request to the server, but instead will still re-display the application page of the target application based on the previously obtained target page configuration information and page content.

[0163] In some solutions, multiple embodiments of this application can be combined, and the combined solution can be implemented. Optionally, some operations in the processes of each method embodiment may be combined, and / or the order of some operations may be changed. Furthermore, the execution order between the steps of each process is merely exemplary and does not constitute a limitation on the execution order between steps; other execution orders are also possible. It is not intended to indicate that the execution order is the only possible order in which these operations can be performed. Those skilled in the art will conceive of various ways to reorder the operations described in the embodiments of this application. In addition, it should be noted that the process details involved in one embodiment of this application are also applicable to other embodiments in a similar manner, or different embodiments may be combined.

[0164] Furthermore, some steps in the method embodiments can be equivalently replaced with other possible steps. Alternatively, some steps in the method embodiments may be optional and can be deleted in certain use cases. Or, other possible steps may be added to the method embodiments.

[0165] Furthermore, the various method embodiments can be implemented individually or in combination.

[0166] It is understood that, in order to achieve the above functions, the aforementioned servers, terminal devices, and other electronic devices include hardware and / or software modules corresponding to perform each function. Based on the algorithm steps of the various examples described in the embodiments disclosed herein, this application can be implemented in hardware or a combination of hardware and computer software. Whether a function is executed by hardware or by computer software driving hardware depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application in conjunction with the embodiments, but such implementation should not be considered beyond the scope of this application.

[0167] This embodiment can divide electronic devices such as servers and terminal devices into functional modules according to the above method examples. For example, each function can be divided into its own functional module, or two or more functions can be integrated into one processing module. The integrated modules can be implemented in hardware. It should be noted that the module division in this embodiment is illustrative and only represents one logical functional division; other division methods may be used in actual implementation.

[0168] This application also provides an electronic device, such as... Figure 12 As shown, the electronic device may include one or more processors 1201, a memory 1202, and a communication interface 1203. The electronic device may also be used as the aforementioned server, terminal device, etc.

[0169] The memory 1202, communication interface 1203, and processor 1201 are coupled together. For example, the memory 1202, communication interface 1203, and processor 1201 can be coupled together via bus 1204.

[0170] The communication interface 1203 is used for data transmission with other devices. The memory 1202 stores computer program code. The computer program code includes computer instructions, which, when executed by the processor 1201, cause the electronic device to perform the page display method described in this embodiment.

[0171] The processor 1201 can be a processor or controller, such as a central processing unit (CPU), a general-purpose processor, a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA), or other programmable logic devices, transistor logic devices, hardware components, or any combination thereof. It can implement or execute various exemplary logic blocks, modules, and circuits described in conjunction with the embodiments of this application. The processor can also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of a DSP and a microprocessor, etc.

[0172] Bus 1204 can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. Bus 1204 can be divided into address bus, data bus, control bus, etc. For ease of representation, Figure 12 The bus is represented by a single thick line, but this does not mean that there is only one bus or one type of bus.

[0173] This application also provides a computer-readable storage medium storing computer program code. When the processor executes the computer program code, the electronic device performs the relevant method steps in the above method embodiments.

[0174] This application also provides a computer program product that, when run on a computer, causes the computer to execute the relevant method steps described in the above method embodiments.

[0175] The electronic devices, computer storage media, or computer program products provided in this application are all used to execute the corresponding methods provided above. Therefore, the beneficial effects they can achieve can be referred to the beneficial effects in the corresponding methods provided above, and will not be repeated here.

[0176] Through the above description of the embodiments, those skilled in the art can clearly understand that, for the sake of convenience and brevity, only the division of the above functional modules is used as an example. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above.

[0177] In the several embodiments provided in this application, it should be understood that the disclosed apparatus and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of modules or units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another device, or some features may be ignored or not executed. Furthermore, the mutual coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between devices or units may be electrical, mechanical, or other forms.

[0178] The units described as separate components may or may not be physically separate. A component shown as a unit can be one or more physical units; that is, it can be located in one place or distributed in multiple different locations. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.

[0179] Furthermore, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.

[0180] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium. Based on this understanding, the technical solution of the embodiments of this application, in essence, or the part that contributes, or all or part of the technical solution, can be embodied in the form of a software product. This software product is stored in a storage medium and includes several instructions to cause a device (which may be a microcontroller, chip, etc.) or processor to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0181] The above description is merely a specific embodiment of this application, but the scope of protection of this application is not limited thereto. Any variations or substitutions within the technical scope disclosed in this application should be included within the scope of protection of this application. Therefore, the scope of protection of this application should be determined by the scope of the claims.

Claims

1. A page display method, characterized in that, A server applied in a communication system, the communication system further including at least one terminal device, the server communicating with each of the at least one terminal device; the method includes: Obtain different page configuration information for the target application under different screen states of the terminal device; the screen state indicates whether the screen of the terminal device is in a folded state or an unfolded state; the page configuration information is used to configure the application pages of the target application; The different page configuration information corresponding to the target application in different screen states of the terminal device is merged to obtain the target page configuration information of the terminal device corresponding to the target application; the target page configuration information includes configuration information for displaying the application page in multiple screen states; wherein, the target page configuration information includes target Hypertext Markup Language (HTML) information and target Cascading Style Sheets (CSS) information, the target HTML information is the merged information of the HTML information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device, and the target CSS information is the merged information of the CSS information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device. After receiving a first page information request sent by the target terminal device after the target application is launched, the target terminal device is sent the target page configuration information and the first page content corresponding to the target application; the first page content is used by the target terminal device to display the application page of the target application that matches the current screen state according to the target page configuration information. Upon receiving a second page information request sent by the target terminal device after the target application is launched, the system sends the second page content corresponding to the target application to the target terminal device. The second page content is used by the target terminal device to display the application page of the target application that matches the current screen state, based on the target page configuration information already obtained.

2. The method according to claim 1, characterized in that, The target application corresponds to a first page configuration information when the terminal device screen is in a folded state, and to a second page configuration information when the terminal device screen is in an unfolded state; the first page configuration information includes first HTML information and first CSS information, and the second page configuration information includes second HTML information and second CSS information; the step of fusing the different page configuration information corresponding to the target application in different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application includes: The first HTML information in the first page configuration information is merged with the second HTML information in the second page configuration information to obtain the target HTML information; the target HTML information includes HTML information for configuring application pages of the target application in multiple screen states; The first CSS information in the first page configuration information is merged with the second CSS information in the second page configuration information to obtain the target CSS information; the target CSS information includes CSS information for configuring application pages of the target application in multiple screen states.

3. The method according to claim 2, characterized in that, The step of fusing the first HTML information in the first page configuration information with the second HTML information in the second page configuration information to obtain the target HTML information includes: Based on the first HTML information, a first syntax tree corresponding to the target application is obtained, and based on the second HTML information, a second syntax tree corresponding to the target application is obtained; the first syntax tree and the second syntax tree are respectively used to characterize the syntax structure of the application page of the target application when the screen of the terminal device is in a collapsed state and the syntax structure of the application page of the target application when the screen of the terminal device is in an expanded state. A first set of nodes is obtained based on the same nodes in the first syntax tree and the second syntax tree, and a second set of nodes is obtained based on the different nodes in the first syntax tree and the second syntax tree; the first syntax tree and the second syntax tree each include at least one node with a hierarchical relationship, and at least one node in the first syntax tree is used to represent at least one grammatical content in the first syntax tree, and at least one node in the second syntax tree is used to represent at least one grammatical content in the second syntax tree. Insert the nodes from the second node set into the first node set to generate a target syntax tree; the target syntax tree includes nodes corresponding to multiple screen states respectively; Based on the target syntax tree, the target HTML information is obtained.

4. The method according to claim 2, characterized in that, The step of fusing the first CSS information in the first page configuration information with the second CSS information in the second page configuration information to obtain the target CSS information includes: Based on the first CSS information, a first rule is obtained for the terminal device to display the application page when the screen is in a folded state; Based on the second CSS information, a second rule is obtained for the terminal device to display the application page when the screen is in an expanded state; The first rule and the second rule are merged into a target rule; the target rule includes rules for displaying the application page that meet the preset display conditions of the terminal device; The target CSS information is obtained according to the target rules.

5. The method according to claim 4, characterized in that, The preset display conditions include a constant page width, a linearly changing page width, or a segmented changing page width.

6. The method according to claim 3, characterized in that, The method further includes: In the target syntax tree, nodes that match the collapsed state of the terminal device screen and nodes that match the unfolded state of the terminal device screen are marked to obtain the marking information of each node in the target syntax tree; the marking information is used by the target terminal device to determine the node that matches the current screen state from the target syntax tree.

7. The method according to any one of claims 1-6, characterized in that, Sending the target page configuration information corresponding to the target application to the target terminal device, including: Send the target page configuration information corresponding to the target terminal device and the target application to the target terminal device.

8. A method for displaying a page, characterized in that, A terminal device applied in a communication system, the communication system including a server and at least one terminal device, the server communicating with each of the at least one terminal device; the method includes: In response to the launch operation of the target application, a first page information request is sent to the server; The system receives target page configuration information and first page content. The target page configuration information is formed by fusing different page configuration information corresponding to the target application in different screen states of the terminal device. The target page configuration information includes target Hypertext Markup Language (HTML) information and target Cascading Style Sheets (CSS) information. The target HTML information is the fused information from the HTML information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device, respectively. The target CSS information is the fused information from the CSS information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device, respectively. Based on the target page configuration information and the content of the first page, display the application page of the target application that matches the current first screen state; the first screen state indicates that the screen of the terminal device is in a folded state or an unfolded state; If the terminal device switches from the current first screen state to the second screen state, it sends a second page request information to the server and receives the second page content; Based on the target page configuration information and the content of the second page, the application page of the target application that matches the current second screen state is displayed; the second screen state indicates that the screen of the terminal device is in an unfolded state or a collapsed state.

9. The method according to claim 8, characterized in that, The step of displaying the application page of the target application that matches the current first screen state based on the target page configuration information and the content of the first page includes: Obtain the target HTML information and the target CSS information from the target page configuration information respectively; Based on the target HTML information, a target syntax tree is obtained; the target syntax tree includes nodes corresponding to multiple screen states. From the target syntax tree, at least one target node matching the first screen state is obtained based on the tag information of each node; the at least one target node has a hierarchical relationship, and the at least one target node in the target syntax tree is used to represent at least one grammatical content in the target syntax tree; Based on the target CSS information, obtain the target rules that meet the preset display conditions of the terminal device; The application page of the target application is displayed based on the hierarchical relationship between the at least one target node, the grammatical content of the at least one target node, the target rules, and the content of the first page.

10. A method for displaying a page, characterized in that, The method is applied to a communication system, the communication system including a server and at least one terminal device, the server communicating with each of the at least one terminal device; the method includes: The server obtains different page configuration information corresponding to the target application in different screen states of the terminal device; the page configuration information is used to configure the application pages of the target application; The server merges the different page configuration information corresponding to the target application in different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application. The target page configuration information includes configuration information for displaying the application page in multiple screen states. The target page configuration information includes target Hypertext Markup Language (HTML) information and target Cascading Style Sheets (CSS) information. The target HTML information is the merged information of the HTML information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device, respectively. The target CSS information is the merged information of the CSS information in the page configuration information corresponding to the target application in the collapsed and expanded states of the terminal device, respectively. In response to the launch operation of the target application, the target terminal device sends a first page information request to the server; the at least one terminal device includes the target terminal device; The server receives the first page information request and sends the target page configuration information and the first page content corresponding to the target application to the target terminal device; The target terminal device receives the target page configuration information and the first page content, and displays the application page of the target application that matches the current first screen state according to the target page configuration information and the first page content; the first screen state indicates that the screen of the terminal device is in a folded state or an unfolded state. If the target terminal device switches from the current first screen state to the second screen state, the target terminal device sends a second page request information to the server; The server receives the second page information request and sends the second page content corresponding to the target application to the target terminal device; The target terminal device receives the content of the second page and displays the application page of the target application that matches the current second screen state according to the target page configuration information and the content of the second page; the second screen state indicates that the screen of the terminal device is in an unfolded state or in a collapsed state.

11. A communication system, characterized in that, It includes a server and at least one terminal device; the at least one terminal device includes a target terminal device; The server is used to obtain different page configuration information corresponding to the target application under different screen states of the terminal device, and to merge the different page configuration information corresponding to the target application under different screen states of the terminal device to obtain the target page configuration information of the terminal device corresponding to the target application. The page configuration information is used to configure the application pages of the target application; the target page configuration information includes configuration information for displaying the application pages in multiple screen states; wherein, the target page configuration information includes target Hypertext Markup Language (HTML) information and target Cascading Style Sheets (CSS) information, the target HTML information is the fusion of HTML information in the page configuration information corresponding to the target application when the screen of the terminal device is in a collapsed state and an expanded state, respectively, and the target CSS information is the fusion of CSS information in the page configuration information corresponding to the target application when the screen of the terminal device is in a collapsed state and an expanded state, respectively; The target terminal device is configured to send a first page information request to the server in response to the launch operation of the target application. The server is also configured to receive the first page information request and send the target page configuration information and the first page content corresponding to the target application to the target terminal device; The target terminal device is further configured to receive the target page configuration information and the first page content, and display the application page of the target application that matches the current first screen state according to the target page configuration information and the first page content; the first screen state indicates that the screen of the terminal device is in a folded state or an unfolded state. If the target terminal device switches from the current first screen state to the second screen state, the target terminal device is also used to send a second page request information to the server; The server is also configured to receive the second page information request and send the second page content corresponding to the target application to the target terminal device; The target terminal device is further configured to receive the content of the second page, and display the application page of the target application that matches the current second screen state according to the target page configuration information and the content of the second page; the second screen state indicates that the screen of the terminal device is in an unfolded state or in a folded state.

12. An electronic device, characterized in that, The device includes a memory and one or more processors; the memory is coupled to the processors; the memory stores computer program code, the computer program code including computer instructions, which, when executed by the processor, cause the electronic device to perform the page display method as described in any one of claims 1-7, or to perform the page display method as described in any one of claims 8-9.

13. A computer-readable storage medium, characterized in that, The method includes computer instructions that, when executed on an electronic device, cause the electronic device to perform the page display method as described in any one of claims 1-7, or to perform the page display method as described in any one of claims 8-9.

Citation Information

Patent Citations

  • Method and device for adapting to terminal screen, storage medium and electronic device

    CN110096322A

  • Data generation method, device, equipment and storage medium

    CN113721803A