Page switching method and device, terminal and storage medium

Abstract

The invention relates to the technical field of information processing, in particular to a page switching method and device, a terminal and a storage medium. The method comprises the following steps: when a sliding parameter sent by a display container is received, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on a monitored sliding event, the sliding parameter comprises a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound with a current page, and the current page is a page being displayed by the terminal; when it is determined that the sliding event is valid, determining a target page based on at least one parameter in the sliding parameters; and switching the display container from the page container bound with the current page to the page container bound with the target page so as to render and display the target page through the page container bound with the target page. By adopting the method provided by the invention, the page switching efficiency in the mobile terminal software can be improved.

Description

Technical Field

[0001] The present application relates to the field of information processing technology, and in particular to a page switching method, device, terminal and storage medium. Background Art

[0002] Currently, there are usually multiple home pages in mobile software, such as the several tabs corresponding to the Tab navigation bar at the bottom of the software, each tab corresponds to a different home page; the Tab container corresponding to the Tab navigation bar is used to control the switching between pages, and each page corresponds to a container; when the Tab container switches a page container to a display container, the page container renders the content in the page for display.

[0003] In the related art, the method of switching between home pages requires the user to select the target tag in the Tab navigation bar at the bottom, so as to switch the current page displayed in the display area of ​​the terminal to the home page corresponding to the target tag; that is, in the related art, the user can only switch pages by clicking the tag in the Tab navigation bar. However, when the screen size of the mobile terminal is large, such as when using the software on a car computer, a large-sized mobile phone or a tablet computer, the user's palm needs to cross a large distance to move to the Tab navigation bar to switch the home page; the page switching method in the related art is inefficient; and in the scenario where the user needs to switch the home page frequently, the home page switching method in the related art may bring a bad user experience.

[0004] Therefore, how to improve the efficiency of page switching in mobile software is an urgent problem to be solved. Summary of the invention

[0005] Based on this, it is necessary to provide a page switching method, device, terminal and storage medium that can improve the efficiency of page switching in mobile software in response to the above technical problems.

[0006] In a first aspect, the present application provides a page switching method, wherein a Tab container and a plurality of page containers are configured in a terminal, the page container is used to render and display bound pages, the method is applied to the Tab container in the terminal, and the method includes:

[0007] When receiving a sliding parameter sent by a display container, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on the monitored sliding event, the sliding parameter includes a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound to a current page, and the current page is a page being displayed by the terminal;

[0008] When it is determined that the sliding event is valid, determining a target page based on at least one parameter of the sliding parameters;

[0009] The display container is switched from the page container bound to the current page to the page container bound to the target page, so that the target page is rendered and displayed through the page container bound to the target page.

[0010] In one of the embodiments, determining whether the sliding event is valid based on the sliding parameter includes:

[0011] determining whether the sliding event is valid based on the relationship between the sliding distance and the distance threshold; and / or,

[0012] Whether the sliding event is valid is determined based on the switching order corresponding to the sliding direction and the order relationship between the pages at the level where the current page is located.

[0013] In one of the embodiments, determining the target page based on at least one parameter of the sliding parameters includes:

[0014] Determine a switching order corresponding to the sliding direction;

[0015] Based on the switching sequence, a target page is determined from the sequence relationship between pages in the level where the current page is located.

[0016] In one of the embodiments, determining the target page based on at least one parameter of the sliding parameters includes:

[0017] Receive a label preview table sent by the display container; wherein the label preview table is rendered and generated by the display container when a sliding event is detected, and the label preview table is displayed in the triggering area of ​​the sliding event; the label preview table includes page labels of each to-be-selected page, and each to-be-selected page is determined based on the sliding direction and the order relationship between each page at the level where the current page is located;

[0018] Based on the correspondence between the preset distance and each page label, the target page corresponding to the sliding distance is determined from the label preview table.

[0019] In one embodiment, the method further comprises:

[0020] Determining at least one of the sliding direction, the current page, and the target page as a target switching condition;

[0021] Based on the corresponding relationship between the switching condition and the switching animation, determining the switching animation corresponding to the target switching condition;

[0022] The switching animation is called and displayed during the switching process of the display container.

[0023] In one embodiment, the tab container stores tags corresponding to each page, and the method further includes:

[0024] When receiving a cut-out notification sent by a container bound to the current page, based on the cut-out notification, changing a label corresponding to the current page to a first state, wherein the first state represents non-display;

[0025] When receiving a cut-in notification sent by the container bound to the target page, based on the cut-in notification, the tag corresponding to the target page is updated to a second state, where the second state represents to be displayed or being displayed.

[0026] In one embodiment, the method further comprises:

[0027] Each of the pages is provided with a corresponding candidate area, and a switching mark is displayed in the candidate area. The switching mark is used to prompt the user to perform a sliding operation in the candidate area to achieve page switching. The sliding event includes the display container monitoring the sliding operation generated in the candidate area of ​​the current page.

[0028] In a second aspect, the present application further provides a page switching device, the device comprising a validity judgment module, a target page determination module and a switching module, wherein:

[0029] a validity judgment module, configured to determine whether a corresponding sliding event is valid based on the sliding parameters when receiving the sliding parameters sent by the display container; the sliding parameters are sent by the display container based on the monitored sliding event, and the sliding parameters include the sliding direction and sliding distance corresponding to the sliding event, the display container is a page container bound to the current page, and the current page is the page currently displayed by the terminal;

[0030] a target page determination module, configured to determine a target page based on at least one parameter of the sliding parameters when determining that the sliding event is valid;

[0031] The switching module is used to switch the display container from the page container bound to the current page to the page container bound to the target page, so as to render and display the target page through the page container bound to the target page.

[0032] In a third aspect, the present application further provides a terminal, including a memory and a processor, wherein the memory stores a computer program, a Tab container and a plurality of page containers are configured in the terminal, and the page container is used to render the content in the page, and the processor implements the following steps when executing the computer program:

[0033] When receiving a sliding parameter sent by a display container, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on the monitored sliding event, the sliding parameter includes a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound to a current page, and the current page is a page being displayed by the terminal;

[0034] When it is determined that the sliding event is valid, determining a target page based on at least one parameter of the sliding parameters;

[0035] The display container is switched from the page container bound to the current page to the page container bound to the target page, so that the target page is rendered and displayed through the page container bound to the target page.

[0036] In a fourth aspect, the present application further provides a computer-readable storage medium having a computer program stored thereon, wherein when the computer program is executed by a processor, the following steps are implemented:

[0037] When receiving a sliding parameter sent by a display container, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on the monitored sliding event, the sliding parameter includes a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound to a current page, and the current page is a page being displayed by the terminal;

[0038] When it is determined that the sliding event is valid, determining a target page based on at least one parameter of the sliding parameters;

[0039] The display container is switched from the page container bound to the current page to the page container bound to the target page, so that the target page is rendered and displayed through the page container bound to the target page.

[0040] In a fifth aspect, the present application further provides a computer program product, including a computer program, which implements the following steps when executed by a processor:

[0041] When receiving a sliding parameter sent by a display container, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on the monitored sliding event, the sliding parameter includes a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound to a current page, and the current page is a page being displayed by the terminal;

[0042] When it is determined that the sliding event is valid, determining a target page based on at least one parameter of the sliding parameters;

[0043] The display container is switched from the page container bound to the current page to the page container bound to the target page, so that the target page is rendered and displayed through the page container bound to the target page.

[0044] The above-mentioned page switching method, device, terminal and storage medium include at least one of the following beneficial technical effects:

[0045] 1. The sliding operation of the user on the screen of the terminal can trigger a sliding event and be detected by the current page container, and the current page container can send the sliding parameters corresponding to the sliding operation to the Tab container, so that the Tab container can further judge the validity of the sliding event. The Tab container determines the sliding event triggered by the user, and the Tab container determines the target page that the user wants to switch to according to the sliding direction and / or sliding distance, and the Tab container switches the display container from the current page container to the container of the target page to display the target page; compared with the method in the related art that can only switch pages by clicking on the label in the Tab navigation bar, in the method of the present application, the user can switch to the target page by sliding in the current page; that is, through the method of this embodiment, when the user uses a terminal of a larger size, the user's palm does not need to move a large distance to the Tab navigation bar to switch pages, but can control the switching of pages by sliding in the current screen, thereby improving the efficiency of the user when switching pages and improving the user's experience;

[0046] 2. After determining the sliding direction, the page switching order that the user wants to achieve can be determined, and then one of the pages before and after the current page is determined as the target page that the user wants to switch to according to the switching order and the order relationship of the current page in the hierarchy; that is, the sliding distance is only used as the basis for judging the validity of the sliding event, and the sliding direction determines that the target page is one of the pages adjacent to the current page, which can effectively reduce the user's misoperation when switching pages through sliding operations, thereby reducing the probability of the user's sliding operation causing switching of multiple pages;

[0047] 3. The preview table is displayed in the area of ​​the current page triggered by the user's sliding operation to prompt the user how many pages can be switched in the current sliding direction; in the sliding preview table, the page label corresponding to the user's sliding distance will be set to a marked state, so that the user can view the target page that can be switched to by the current sliding distance, providing a reference for the user to switch between multiple pages, thereby improving the convenience and accuracy of the user's switching between multiple pages and reducing the chance of erroneous switching. BRIEF DESCRIPTION OF THE DRAWINGS

[0048] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the related technologies, the drawings required for use in the embodiments or the related technical descriptions are briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0049] Figure 1 A diagram of an application environment of a page switching method in an embodiment;

[0050] Figure 2 A schematic diagram of a page switching method in an embodiment;

[0051] Figure 3 A schematic diagram of candidate areas and special areas in a page in one embodiment;

[0052] Figure 4 A flowchart of steps for obtaining sliding parameters in one embodiment;

[0053] Figure 5 A schematic diagram of marking dimension lines in one embodiment;

[0054] Figure 6 A flowchart of steps for determining a target page in one embodiment;

[0055] Figure 7 A schematic diagram of a flow chart of steps for determining a switching animation in one embodiment;

[0056] Figure 8 A schematic diagram of a process for updating a label in one embodiment;

[0057] Fig. 9 A logical schematic diagram of the implementation principle of a page switching method in another embodiment;

[0058] Fig.10 is a structural block diagram of a page switching device in an embodiment;

[0059] Fig.11 FIG. 4 is a diagram showing the internal structure of a terminal in an embodiment. DETAILED DESCRIPTION

[0060] In order to make the purpose, technical solution and advantages of the present application more clearly understood, the present application is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0061] The page switching method provided in the embodiment of the present application can be applied to Figure 1In the application environment of the terminal shown, a Tab container and multiple page containers are configured in the terminal. The Tab container is used to control the switching between page containers. The Tab container controls which page container is switched to the display container, and which page is the page for display. The page container starts to render the content in the page for display. The terminal can be, but is not limited to, various personal computers, laptops, smart phones, tablets, IoT devices and portable wearable devices. IoT devices can be smart speakers, smart TVs, smart air conditioners, smart car-mounted devices, etc. Portable wearable devices can be smart watches, smart bracelets, head-mounted devices, etc.

[0062] In an exemplary embodiment, Figure 2 As shown, a page switching method is provided, which is applied to Figure 1 The following is an example of using the Tab container of a terminal in the middle terminal, including the following steps 01-03:

[0063] Step 10: When receiving the sliding parameters sent by the display container, determine whether the corresponding sliding event is valid based on the sliding parameters; the sliding parameters are sent by the display container based on the monitored sliding events, and the sliding parameters include the sliding direction and sliding distance corresponding to the sliding event. The display container is the page container bound to the current page, and the current page is the page being displayed on the terminal.

[0064] For the embodiment of the present application, a Tab container and multiple page containers are configured in the terminal, and the page container is used to render and display the bound pages. In addition, a Pan event is added to the Tab container and set as a strong reference; wherein the Pan event is a gesture operation event, and Pan is the abbreviation of the sliding gesture object; the Pan event represents the user using a finger to slide / drag in a specified area; the strong reference is to store the Pan object in the system memory to ensure that the Pan event is unique and to achieve unified processing. When the user slides the display area of ​​the terminal, the current page container being used for display can monitor the occurrence of the Pan event (sliding event); a notification of the Pan event of the Tab container is added in advance to each page container, so that the Tab container can receive the notification of the Pan time sent by the current page container. The notification of the Pan event of the Tab container by the current page container includes the sliding parameters corresponding to the sliding event, that is, the sliding parameters at least include the sliding direction and sliding distance corresponding to the user's sliding operation.

[0065] For the embodiment of the present application, since the user's sliding operation is represented by sliding parameters, in order to reduce erroneous operations caused by the user's accidental touching of the terminal screen, the embodiment of the present application determines whether the sliding event triggered by the user's sliding operation is valid through set verification rules; when the sliding parameters meet the verification rules, the sliding event is determined to be valid; when the sliding parameters do not meet the verification rules, the sliding event is determined to be invalid.

[0066] Wherein, in the case where the sliding parameters include the sliding direction and the sliding distance, the verification rule may include the verification condition for the sliding direction and / or the verification condition for the sliding distance. In the case where the sliding parameters also include other parameters, the verification rule may also include the verification condition for the other parameters. For example, if the sliding parameters also include the sliding area (area on the screen) corresponding to the sliding operation triggered by the user, the verification rule may also include the verification condition for the sliding area.

[0067] Step 20: When it is determined that the sliding event is valid, determine the target page based on at least one parameter in the sliding parameters.

[0068] For the embodiments of the present application, in one possible implementation, the user's sliding operation can only switch between single pages, that is, the user can only switch to one of the pages adjacent to the current page; that is, the relationship between the sliding direction and the switching order can be preset, and then the switching order is determined based on the sliding direction, and then the target page is determined based on the sliding order from the sequential relationship between the pages of the level where the current page is located. For example, in one example, the Tab bar is set to the bottom of the display area of ​​the terminal screen, the switching method between pages is left and right switching, and the user is set to swipe right to switch to the page on the left, and the user is set to swipe left to switch to the page on the left; the sequence number of the current page is set to 3, and the user swipes right, which indicates that the page with sequence number 2 is the target page.

[0069] In another possible implementation, the user's operation can also achieve cross-page switching, that is, the user can switch to any page in the hierarchy of the current page; that is, the sliding direction is used as a condition for filtering the pages to be selected, and then the labels of the pages to be selected are displayed to the user, and a corresponding sliding distance is set for each page to be selected, and the corresponding target page is determined according to the user's sliding distance. In one example, the label of the current page is 2, and the labels of the pages to be selected based on the user's sliding direction are 3, 4, and 5 respectively; the sliding distance 10 is set to correspond to the page with label 3, the sliding distance 30 corresponds to the page with label 4, and the sliding distance 40 corresponds to the page with label 5; when the sliding parameter corresponding to the user's sliding operation is 40, the page with label 5 is determined to be the target page.

[0070] Step 30: Switch the display container from the page container bound to the current page to the page container bound to the target page, so as to render and display the target page through the page container bound to the target page.

[0071] For the embodiment of the present application, the Tab container controls which page container is switched to the display container, and which page is the page for display. The Tab container is also used to display the label corresponding to the page, that is, the Tab container stores the label corresponding to each page. When the Tab container switches a page container to a display container, it will also switch to the label corresponding to the page or update the status of the label corresponding to the page, so that the label of the page matches the status of the page for display. How the Tab container implements the process of switching the label of the target page or updating the status of the label of the target page will be introduced in more detail in the subsequent embodiments, and will not be elaborated on here.

[0072] In the above-mentioned page switching method, the sliding operation of the user on the screen of the terminal can trigger a sliding event and be monitored by the current page container, and the current page container can send the sliding parameters corresponding to the sliding operation to the Tab container, so as to further enable the Tab container to judge the validity of the sliding event. The Tab container determines the sliding event triggered by the user, and the Tab container determines the target page that the user wants to switch to according to the sliding direction and / or sliding distance, and the Tab container switches the display container from the current page container to the container of the target page to display the target page; compared with the method in the related art that can only switch pages by clicking on the label in the Tab navigation bar, in the method of the present application, the user can switch to the target page by sliding in the current page; that is, through the method of this embodiment, when the user uses a terminal of a larger size, the user's palm does not need to move a large distance to the Tab navigation bar to switch pages, but can control the switching of pages by sliding operations in the current screen, thereby improving the efficiency of the user when switching pages and improving the user's usage experience.

[0073] Furthermore, in the embodiment of the present application, a detailed explanation is given of the process in which the current page container monitors and obtains the sliding parameters of the sliding event, and the process in which the current page container sends the sliding parameters to the Tab container. The sliding parameters are sent to the Tab container when the current page container monitors the first type of sliding event triggered by the user. The first type of sliding event is a sliding event triggered by a sliding operation in a candidate area of ​​the current page; each page corresponds to at least one candidate area, and the candidate area is used to indicate that the user can switch pages by sliding.

[0074] Specifically, the sliding direction is usually divided into forward and backward sliding and left and right sliding. In the embodiment of the present application, it is necessary to set the effective sliding direction, and the effective sliding direction is determined based on the display position of the Tab navigation bar in the terminal screen. When the display position of the Tab navigation bar is at the top or bottom of the terminal screen, the effective sliding direction is left and right sliding (at this time, the page switches left and right); when the display position of the Tab navigation bar is at the left or right side of the terminal screen, the effective sliding direction is up and down sliding (at this time, the page switches up and down). Furthermore, the effective sliding direction can also be customized by the user, and the specific direction of the effective sliding direction is not specifically limited in the embodiment of the present application.

[0075] Specifically, a corresponding candidate area is set in each page, and a switching mark is displayed in the candidate area. The switching mark is used to prompt the user to perform a sliding operation in the candidate area to achieve page switching. The sliding event includes the display container listening to the sliding operation in the candidate area of ​​the current page. That is to say, there is a candidate area in the page corresponding to each tag, and the positions of the candidate areas in the pages corresponding to different tags may be the same or different. This is because a special area that allows content switching by sliding is also built into a page. The special area can be a sub-area or an embedded area in the current page, but not all pages have special areas. Among them, the current page container can monitor the sliding event triggered by the user's sliding operation on the terminal screen, and the sliding event triggered by the user can be divided into at least the first type of sliding event and the second type of sliding event. When the current page container monitors the user's sliding operation in the candidate area, it is determined that the first type of sliding event is triggered, and the sliding parameters of the first type of sliding event are notified to the Tab container. When the current page container monitors the user's sliding operation in the special area, it is determined that the second type of sliding event is triggered. For the sliding parameters of the second type of sliding event, the current page container can notify the Tab container or not notify the Tab container.

[0076] In an example, in the current page, the distribution of candidate areas and special areas is as follows: Figure 3 Shown: In Figure 3 In the current page displayed, the special area A can display three thumbnail contents, A2, A3, and A4, at the same time. The user can swipe left and right in A to switch between thumbnail contents such as A1, A5, A6, etc. (In this process, the current page will not switch, only the thumbnail contents displayed in the special area A will switch). The sliding operation triggered by the user in area A is the second type of sliding event. Candidate area B is used to prompt the user that the page can be switched by sliding in this area, that is, the sliding operation triggered by the user in area B is the first type of sliding event.

[0077] It should be noted that since the current mainstream mid-end operation method is to implement the operation logic of returning to the previous level page through side sliding, in order to avoid the user switching pages caused by side sliding, in the embodiment of the present application, the candidate area is set to not overlap with any side of the display area of ​​the terminal screen; that is, in the scheme of this embodiment, the user cannot switch between the pages of the level where the current page is located by sliding on the side (edge ​​of the screen).

[0078] Further, refer to Figure 4 When obtaining the sliding parameters of the sliding event, the display container may specifically include steps 01 and 02, wherein:

[0079] Step 01: When the current page container obtains the sliding initial point of the sliding event, a marking dimension line is constructed along a preset direction with the sliding initial point as the origin;

[0080] Step 02: Monitor the change of the sliding position in the sliding event to obtain the sliding end point of the sliding event, determine the distance between the sliding end point and the sliding starting point on the identification scale line as the sliding distance, and determine the direction from the sliding starting point to the sliding end point as the sliding direction.

[0081] In the embodiment of the present application, the effective sliding direction is divided into an effective positive direction and an effective negative direction, and it is set that in a sliding process, the distance slid along the effective positive direction is a positive value, and the distance slid along the effective negative direction is a negative value. Through the design of this solution, even if the user first slides along the effective positive direction and then slides along the effective negative direction during the sliding process, the actual distance slid by the user can be determined more accurately, thereby better identifying the user's true intention.

[0082] In one example of an embodiment of the present application, a Gesture Recognizer processes a Pan event or a similar mechanism to detect and respond to a user's sliding / dragging operation; when the gesture of the sliding operation triggered by the user changes, the gesture recognizer in the current page container monitors the direction of the gesture sliding, and sets the TranslationX of the left slide to negative and the right slide to positive to prevent the problem of sliding left and then sliding right.

[0083] like Figure 5 As shown, when the sliding operation starts, the sliding initial point is obtained, and then the identification dimension line is established along the effective sliding direction with the sliding initial point as the origin; wherein the division of the identification dimension line is determined based on the screen size of the terminal, or based on the pixels of the display area corresponding to the terminal. The sliding end point is further obtained, and the sliding direction and sliding distance are determined based on the positive projection point of the sliding end point on the identification dimension line and the origin.

[0084] The above content is a process in which the current page container monitors and obtains the sliding parameters of the sliding event, and a process in which the current page container sends the sliding parameters to the Tab container.

[0085] In one embodiment, in step 10, the Tab container may specifically use at least one of method 1 and method 2 to determine whether the sliding event is valid.

[0086] Method 1: Determine whether a sliding event is valid based on the relationship between the sliding distance and the distance threshold.

[0087] Method 2: Determine whether the sliding event is valid based on the switching order corresponding to the sliding direction and the order relationship between the pages in the level where the current page is located.

[0088] In method 1, the distance threshold may be pre-set or determined based on the size of the display screen of the current terminal device. For example, the distance threshold may be set to a distance of 300 pixels, and the sliding distance may be set to 20% of the current screen width; the specific value of the distance threshold is not specifically limited in this application, as long as it can reduce the probability of page switching due to the user's accidental touch operation (short-distance sliding).

[0089] In one possible implementation, the validity of the sliding event is judged only by comparing the sliding distance and the distance threshold in method one, that is, when the sliding distance is greater than or equal to the distance threshold, the sliding event is determined to be valid, and when the sliding distance is less than the distance threshold, the sliding event is determined to be invalid.

[0090] In another possible implementation method, the validity of the sliding event is judged by both method one and method two; that is, when the sliding distance is greater than or equal to the distance threshold, and there are switchable pages along the switching order of the current page, the sliding event is determined to be valid; when the sliding distance is less than the distance threshold, and / or there are no switchable pages along the switching order of the current page, the sliding event is determined to be invalid.

[0091] Furthermore, in one of the embodiments, in step 20, the target page is determined based on at least one parameter in the sliding parameters, including two achievable methods, and the method for determining the target page actually executed by the terminal can be pre-selected by the user; the following content analyzes the two achievable methods for determining the target page respectively.

[0092] In one embodiment, referring to Figure 6 , a first achievable manner of determining a target page may specifically include the first achievable manner including step 2A1 and step 2A2, wherein:

[0093] Step 2A1, determining the switching order corresponding to the sliding direction;

[0094] Step 2A2: Based on the switching order, determine the target page from the order relationship between the pages in the level where the current page is located.

[0095] Specifically, the switching number corresponding to the switching sequence is fixed to 1, that is, the switching sequence only represents the order in which a page is switched; the mapping relationship between the sliding direction and the switching sequence is pre-set, and after determining the sliding direction, the switching sequence of the pages that the user wants to achieve can be determined, and then according to the switching sequence and the order relationship of the current page in the hierarchy, one of the previous and next pages of the current page is determined as the target page that the user wants to switch to. In other words, in the first achievable method, the sliding distance is only used as the basis for judging the validity of the sliding event, and the sliding direction determines that the target page is one of the pages adjacent to the current page, which can effectively reduce the user's misoperation when switching pages, thereby reducing the probability of the user's sliding operation causing the switching of multiple pages.

[0096] In one embodiment, referring to Figure 6 , a second achievable method for determining a target page may specifically include the first achievable method including step 2B1 and step 2B2, wherein:

[0097] Step 2B1, receiving a label preview table sent by a display container;

[0098] Step 2B2: Based on the correspondence between the preset distance and each page label, determine the target page corresponding to the sliding distance from the label preview table.

[0099] The label preview table is rendered and generated by the display container when a sliding event is detected, and the label preview table is displayed in the trigger area of ​​the sliding event; the label preview table includes page labels of each page to be selected, and each page to be selected is determined based on the sliding direction and the sequential relationship between the pages at the level where the current page is located. Further, since the label preview is generated based on the sliding direction and the sequential relationship between the pages at the level where the current page is located, the label preview table can be generated by the display container and sent to the Tab container, or it can be generated by the Tab container; and the label preview table has an effective period, and the effective period of the label preview table is the life cycle of the sliding event, that is, the label preview table is generated in response to the establishment of the sliding event, and the label preview table is deleted in response to the end of the sliding event, thereby reducing the cache occupancy in the Tab container, making the Tab container respond more quickly to user operations.

[0100] The preview table is displayed in the area triggered by the user's sliding operation on the current page to prompt the user that there are several pages that can be switched in the current sliding direction; in the sliding preview table, the page label corresponding to the user's sliding distance will be set to a marked state, so that the user can view the target page that can be switched to by the current sliding distance, providing a reference for the user to switch between multiple pages, thereby improving the convenience and accuracy of the user's switching between multiple pages and reducing the chance of incorrect switching.

[0101] Specifically, the relationship between the distance and the number of switches is preset, and the mapping relationship between the sliding direction and the switching order is preset; wherein the number of switches is positively correlated with the sliding distance in the sliding parameter. Based on the preset correspondence between the distance and the number, the number of switches corresponding to the sliding distance is determined, and the switching order corresponding to the sliding direction is determined. Then, based on the switching order and the number of switches, the target page is determined in the order relationship between the pages at the level where the current page is located. In other words, this method can achieve leapfrogging switching with multiple pages in between, thereby further improving the efficiency of user page switching.

[0102] Furthermore, in one embodiment, referring to Figure 7 In step 30, the method may specifically include: calling the switching animation and displaying the switching animation during the switching process of the display container. The method of calling the switching animation may specifically include steps 31 and 32, wherein:

[0103] Step 31: determining at least one of the sliding direction, the current page, and the target page as a target switching condition;

[0104] Step 32: Based on the corresponding relationship between the switching condition and the switching animation, determine the switching animation corresponding to the target switching condition.

[0105] Specifically, the switching animation is a visual element object when switching from one page to another page for display. In one possible implementation, a fixed switching animation may be set, and the fixed switching animation is directly called each time the page is switched.

[0106] In another possible implementation, a corresponding cut-in animation may be set for each page, and when switching to a target page, the cut-in animation corresponding to the target page is called as the switching animation for switching.

[0107] In another possible implementation, a corresponding cut-out animation may be set for each page, and when switching to a target page, the cut-out animation corresponding to the current page is called as the cut-in animation for switching.

[0108] In another possible implementation method, a switching animation can be set for each switching direction. For example, switching to the left is the first switching animation, and switching to the right is the second switching animation. When the switching direction is determined based on the sliding direction, the corresponding switching animation (first switching animation / second switching animation) is called based on the switching direction for switching.

[0109] In another possible implementation, a corresponding switching animation may be set for each content type; for example, a first switching animation may be set for text content, and a second switching animation may be set for video content. When switching to a target page, the type of content to be displayed in the target page is obtained, and the corresponding switching animation is called based on the type of content to be displayed for switching. The specific method for determining the switching animation is not specifically limited in the embodiments of the present application.

[0110] Further, in step 03, referring to Figure 8 When the Tab container switches a page container to a display container, the updating process of the page label may specifically include steps 033 and 034, wherein:

[0111] Step 033: upon receiving a cut-out notification sent by a container bound to the current page, based on the cut-out notification, changing the label corresponding to the current page to a first state, wherein the first state representation is not displayed;

[0112] Step 034: upon receiving a cut-in notification sent by a container bound to the target page, based on the cut-in notification, updating a tag corresponding to the target page to a second state, where the second state indicates that the tag is to be displayed or is being displayed.

[0113] Specifically, in an embodiment of the present application, each page container is configured with a ViewWillAppear function and a ViewWillDisappear function; wherein, the ViewWillAppear function is called when the view is about to be cut in, and the ViewWillDisappear function is called when the view is about to be cut out. wherein, when the current page is about to be cut out, the current page container calls the ViewWillDisappear function to send a cut-out notification to the Tab container; when the target page is about to be cut in, the target page container calls the ViewWillAppear function to send a cut-in notification to the Tab container; the Tab container receives the cut-out notification and the cut-in notification, and when the current page container switches to the target page container, the Tab container updates the state of the current page from the second state to the first state, and updates the state of the target page to the second state.

[0114] In a more specific embodiment, the present application provides a page switching method, such as Fig. 9 As shown:

[0115] First, prepare a custom sliding animation and customize the proxy (the correspondence between sliding gestures / operations and sliding events), override the Interaction Controller For Animation Controller (interaction controller for animation controller) and Animation Controller For Transition From View Controller (animation controller for transition from view controller) proxy methods to handle switching animations and sliding events.

[0116] Add scroll notification to the Tab container (pass sliding parameters through Type), and make a strong reference to the Pan event (store the Pan object in the system memory to ensure that the Pan event is unique and processed uniformly). The Pan event usually includes the Panstart state, Panmove state, and Panend state, where:

[0117] Panstart state (drag starts): This event is triggered when the user's finger touches the screen and starts to move. Panmove state (drag process): This event is triggered continuously while the user's finger continues to move. This allows developers to track the user's drag trajectory and update the position or state of UI elements accordingly. Panend state (drag ends): This event is triggered when the user's finger leaves the screen. This marks the completion of the drag operation.

[0118] The notification sent by the native container (current page container) to the Tab container carries the Type (slide parameter). The Tab container receives the Type in the notification and distinguishes whether it is to add a gesture event (valid slide event) or to cancel a gesture event (invalid slide event). In the Pan event, the sliding point of the slide is processed, and the sliding point and proxy event (determine the target page to switch to) are processed according to the State enumeration of the gesture object created by the UI Pan Gesture Recognizer.

[0119] When switching containers (switching pages), ViewWillAppear in the native container sends a notification with Type=AddPan, which is an add gesture event; and ViewWillDisAppear in the native container sends a notification with Type=RemovePan, which is a remove gesture event, to handle the problem of sliding from the controller.

[0120] In the related art, in the Tabbar (navigation component) in the Tab container, the system (operating system of the terminal) has a sliding gesture by default, which conflicts with the Pan gesture newly added to the Tab container in this application, which causes the Tabbar to not match the page container when sliding, thereby causing a white screen phenomenon. In the embodiment of the present application, in order to solve the white screen problem during page switching, the Tabbar in the Tab container is customized, that is, the sliding gesture implemented by the system is rewritten to distinguish the sliding of the system from the sliding of the newly added Pan event, so that the sliding logic of the Pan gesture can be implemented, solving the white screen problem during page switching.

[0121] The various professional terms used in the above embodiments are further explained:

[0122] Pan: Short name for the sliding gesture object.

[0123] UI Pan Gesture Recognizer: Slide gesture class, used to create slide gesture objects.

[0124] Tab: represents the container of the bottom navigation, also called Tab container for short.

[0125] Tabbar: represents the navigation component.

[0126] Interaction Controller For Animation Controller: Interaction controller function for animation controller.

[0127] Animation Controller For Transition From View Controller: Animation controller function used for transitioning from view controller.

[0128] Type: The defined transmission parameter name.

[0129] AddPan / RemovePan: The value defined by the transmission parameter (characterizing the validity of the sliding event).

[0130] UI Gesture Recognizer State Began: The gesture starts sliding and gets the sliding point (sliding starting point).

[0131] UI GestureRecognizer State Changed: When the sliding gesture changes, monitor the sliding direction, where the TranslationX of the left sliding is set to negative and the right sliding is set to positive to prevent the problem of sliding left and then right.

[0132] By adopting the page switching method provided in the embodiment of the present application, when the user switches pages (tabs) on the home page, he can not only click the tab / button of the corresponding page in the Tab navigation bar, but also switch pages by sliding in the current page. In the page switching method of the embodiment of the present application, the native container (current page container) is used to bind the side sliding event, and the switching of the tabs of the pages in the Tab container is associated. The Tab container and the native container (current page container) monitor the switching events with each other to realize the switching of pages by sliding operations, thereby improving the user experience in the process of using the APP home page, and switching pages at will.

[0133] Furthermore, in a terminal that applies the page switching method provided in the embodiment of the present application, or in a terminal that has installed a program product corresponding to the page switching method provided in the embodiment of the present application, the function corresponding to the page switching method can be set to be always on, or can be set to be executed after the user triggers and the instruction is executed.

[0134] In another possible implementation method, the terminal may also obtain the frequency of the user switching pages in the system page (the operating system page of the terminal, or the program product page corresponding to the page switching method provided in the embodiment of the present application) within a historical period, where the frequency is the number of pages switched in a unit period; then, when the frequency is greater than a set threshold, the function corresponding to the page switching method provided in the embodiment of the present application is automatically enabled.

[0135] In another possible implementation, when the terminal runs the program product corresponding to the page switching method provided in the embodiment of the present application, the terminal obtains the size parameter of the terminal screen, and when the size parameter of the terminal screen is greater than the preset specification, the function corresponding to the page switching method provided in the embodiment of the present application is automatically enabled. The specific method for enabling the function corresponding to the page switching method provided in the embodiment of the present application is not specifically limited in the embodiment of the present application.

[0136] It should be understood that, although the steps in the flowcharts involved in the above embodiments are displayed in sequence according to the indication of the arrows, these steps are not necessarily executed in sequence according to the order indicated by the arrows. Unless there is a clear explanation in this article, the execution of these steps is not strictly limited in order, and these steps can be executed in other orders. Moreover, at least a part of the steps in the flowcharts involved in the above embodiments may include multiple steps or multiple stages, and these steps or stages are not necessarily executed at the same time, but can be executed at different times, and the execution order of these steps or stages is not necessarily carried out in sequence, but can be executed in turn or alternately with other steps or at least a part of the steps or stages in other steps.

[0137] Based on the same inventive concept, the embodiment of the present application also provides a page switching device for implementing the page switching method involved above. The implementation scheme for solving the problem provided by the device is similar to the implementation scheme recorded in the above method, so the specific limitations in one or more page switching device embodiments provided below can refer to the limitations of the page switching method above, and will not be repeated here.

[0138] In an exemplary embodiment, Fig.10 As shown, a page switching device is provided, the device includes a validity judgment module 1001, a target page determination module 1002 and a switching module 1003, wherein:

[0139] The validity judgment module 1001 is used to determine whether the corresponding sliding event is valid based on the sliding parameters when receiving the sliding parameters sent by the display container; the sliding parameters are sent by the display container based on the monitored sliding event, and the sliding parameters include the sliding direction and sliding distance corresponding to the sliding event. The display container is the page container bound to the current page, and the current page is the page being displayed by the terminal;

[0140] A target page determination module 1002, configured to determine a target page based on at least one parameter of the sliding parameters when determining that the sliding event is valid;

[0141] The switching module 1003 is used to switch the display container from the page container bound to the current page to the page container bound to the target page, so as to render and display the target page through the page container bound to the target page.

[0142] In the above-mentioned page switching device, the sliding operation of the user on the screen of the terminal can trigger a sliding event and be monitored by the current page container, and the current page container can send the sliding parameters corresponding to the sliding operation to the Tab container, so as to further enable the Tab container to judge the validity of the sliding event. The Tab container determines the sliding event triggered by the user, and the Tab container determines the target page that the user wants to switch to according to the sliding direction and / or sliding distance, and the Tab container switches the display container from the current page container to the container of the target page to display the target page; compared with the method in the related art that can only switch pages by clicking on the label in the Tab navigation bar, in the method of the present application, the user can switch to the target page by sliding in the current page; that is, through the method of this embodiment, when the user uses a terminal of a larger size, the user's palm does not need to move a large distance to the Tab navigation bar to switch pages, but can control the switching of pages by sliding operations in the current screen, thereby improving the efficiency of the user when switching pages and improving the user's usage experience.

[0143] In an exemplary embodiment, the validity determination module 1001 is specifically configured to:

[0144] Determining whether the sliding event is valid based on the relationship between the sliding distance and the distance threshold; and / or,

[0145] Based on the switching order corresponding to the sliding direction and the order relationship between the pages in the level where the current page is located, it is determined whether the sliding event is valid.

[0146] In one embodiment, the target page determination module 1002 is specifically configured to:

[0147] Determine the switching order corresponding to the sliding direction;

[0148] Based on the switching order, the target page is determined from the order relationship between the pages in the level where the current page is located.

[0149] In one embodiment, the target page determination module 1002 is specifically configured to:

[0150] Receive a label preview table sent by the display container; wherein the label preview table is rendered and generated by the display container when a sliding event is detected, and the label preview table is displayed in the triggering area of ​​the sliding event; the label preview table includes page labels of each to-be-selected page, and each to-be-selected page is determined based on the sliding direction and the order relationship between each page at the level where the current page is located;

[0151] Based on the correspondence between the preset distance and each page label, the target page corresponding to the sliding distance is determined from the label preview table.

[0152] In one embodiment, the device further comprises a display module, and the display module is further used for:

[0153] Determine at least one of the sliding direction, the current page, and the target page as a target switching condition;

[0154] Based on the corresponding relationship between the switching condition and the switching animation, determining the switching animation corresponding to the target switching condition;

[0155] Call the switching animation and display the switching animation during the switching process of the display container.

[0156] In one embodiment, the tab container stores the tabs corresponding to the pages, and the switching module 1003 is further used to:

[0157] When receiving a cut-out notification sent by a container bound to the current page, based on the cut-out notification, changing the label corresponding to the current page to a first state, where the first state representation is not displayed;

[0158] When receiving a cut-in notification sent by a container bound to a target page, based on the cut-in notification, a tag corresponding to the target page is updated to a second state, where the second state represents to be displayed or being displayed.

[0159] In one of the embodiments, each page is provided with a corresponding candidate area, and a switching mark is displayed in the candidate area. The switching mark is used to prompt the user to perform a sliding operation in the candidate area to achieve page switching. The sliding event includes the display container listening to the sliding operation generated in the candidate area of ​​the current page.

[0160] Each module in the above-mentioned page switching device can be implemented in whole or in part by software, hardware or a combination thereof. Each module can be embedded in or independent of the processor in the terminal in the form of hardware, or can be stored in the memory in the terminal in the form of software, so that the processor can call and execute the operations corresponding to each module above.

[0161] In an exemplary embodiment, a terminal is provided, and the internal structure diagram of the terminal can be as follows: Fig.11 As shown. The terminal includes a processor, a memory, an input / output interface, a communication interface, a display unit and an input device. Among them, the processor, the memory and the input / output interface are connected through a system bus, and the communication interface, the display unit and the input device are connected to the system bus through the input / output interface. Among them, the processor of the terminal is used to provide computing and control capabilities. The memory of the terminal includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The input / output interface of the terminal is used to exchange information between the processor and the external device. The communication interface of the terminal is used to communicate with an external terminal in a wired or wireless manner, and the wireless manner can be implemented through WIFI, a mobile cellular network, NFC (near field communication) or other technologies. When the computer program is executed by the processor, a page switching method as in the above method embodiment is implemented. The display unit of the terminal is used to form a visually visible picture, which can be a display screen, a projection device or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen, and the input device of the terminal can be a touch layer covering the display screen, or a key, trackball or touchpad provided on the terminal housing, or an external keyboard, touchpad or mouse.

[0162] Those skilled in the art will understand that Fig.11 The structure shown in the figure is only a block diagram of a partial structure related to the scheme of the present application, and does not constitute a limitation on the terminal to which the scheme of the present application is applied. The specific terminal may include more or fewer components than shown in the figure, or combine certain components, or have a different arrangement of components.

[0163] In an exemplary embodiment, a terminal is provided, including a memory and a processor, wherein a computer program is stored in the memory, and when the processor executes the computer program, a page switching method in the above method embodiment is implemented.

[0164] In one embodiment, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by a processor, a page switching method in the above method embodiment is implemented.

[0165] In one embodiment, a computer program product is provided, including a computer program. When the computer program is executed by a processor, a page switching method in the above method embodiment is implemented.

[0166] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with relevant regulations.

[0167] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiments can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to the memory, database or other medium used in the embodiments provided in this application can include at least one of non-volatile and volatile memory. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical memory, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetoresistive random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. As an illustration and not limitation, RAM can be in various forms, such as static random access memory (SRAM) or dynamic random access memory (DRAM). The database involved in each embodiment provided in this application may include at least one of a relational database and a non-relational database. Non-relational databases may include distributed databases based on blockchains, etc., but are not limited to this. The processor involved in each embodiment provided in this application may be a general-purpose processor, a central processing unit, a graphics processor, a digital signal processor, a programmable logic device, a data processing logic device based on quantum computing, etc., but are not limited to this.

[0168] The technical features of the above embodiments may be combined arbitrarily. To make the description concise, not all possible combinations of the technical features in the above embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0169] The above embodiments only express several implementation methods of the present application, and the descriptions thereof are relatively specific and detailed, but they cannot be understood as limiting the scope of the present application. It should be pointed out that, for a person of ordinary skill in the art, several variations and improvements can be made without departing from the concept of the present application, and these all belong to the protection scope of the present application. Therefore, the protection scope of the present application shall be subject to the attached claims.

Claims

1. A page switching method, characterized in that: A Tab container and a plurality of page containers are configured in the terminal, and the page container is used to render and display bound pages. The method is applied to the Tab container in the terminal, and the method includes: When receiving a sliding parameter sent by a display container, determining whether a corresponding sliding event is valid based on the sliding parameter; the sliding parameter is sent by the display container based on the monitored sliding event, the sliding parameter includes a sliding direction and a sliding distance corresponding to the sliding event, the display container is a page container bound to a current page, and the current page is a page being displayed by the terminal; When it is determined that the sliding event is valid, determining a target page based on at least one parameter of the sliding parameters; The display container is switched from the page container bound to the current page to the page container bound to the target page, so that the target page is rendered and displayed through the page container bound to the target page.

2. The method according to claim 1, characterized in that The determining whether the sliding event is valid based on the sliding parameter includes: determining whether the sliding event is valid based on the relationship between the sliding distance and the distance threshold; and / or, Whether the sliding event is valid is determined based on the switching order corresponding to the sliding direction and the order relationship between the pages at the level where the current page is located.

3. The method according to claim 1, characterized in that The determining the target page based on at least one parameter of the sliding parameters includes: Determine a switching order corresponding to the sliding direction; Based on the switching sequence, a target page is determined from the sequence relationship between pages in the level where the current page is located.

4. The method according to claim 1, characterized in that The determining the target page based on at least one parameter of the sliding parameters includes: Receive a label preview table sent by the display container; wherein the label preview table is rendered and generated by the display container when a sliding event is detected, and the label preview table is displayed in the triggering area of ​​the sliding event; the label preview table includes page labels of each to-be-selected page, and each to-be-selected page is determined based on the sliding direction and the order relationship between each page at the level where the current page is located; Based on the correspondence between the preset distance and each page label, the target page corresponding to the sliding distance is determined from the label preview table.

5. The method according to any one of claims 1 to 4, characterized in that The method further comprises: Determining at least one of the sliding direction, the current page, and the target page as a target switching condition; Based on the corresponding relationship between the switching condition and the switching animation, determining the switching animation corresponding to the target switching condition; The switching animation is called and displayed during the switching process of the display container.

6. The method according to any one of claims 1 to 4, characterized in that The tab container stores tags corresponding to each page, and the method further includes: When receiving a cut-out notification sent by a container bound to the current page, based on the cut-out notification, changing a label corresponding to the current page to a first state, wherein the first state represents non-display; When receiving a cut-in notification sent by the container bound to the target page, based on the cut-in notification, the tag corresponding to the target page is updated to a second state, where the second state represents to be displayed or being displayed.

7. The method according to any one of claims 1 to 4, characterized in that Each of the pages is provided with a corresponding candidate area, and a switching mark is displayed in the candidate area. The switching mark is used to prompt the user to perform a sliding operation in the candidate area to achieve page switching. The sliding event includes the display container monitoring the sliding operation generated in the candidate area of ​​the current page.

8. A page switching device, characterized in that: The device includes a validity judgment module, a target page determination module and a switching module, wherein: a validity judgment module, configured to determine whether a corresponding sliding event is valid based on the sliding parameters when receiving the sliding parameters sent by the display container; the sliding parameters are sent by the display container based on the monitored sliding event, and the sliding parameters include the sliding direction and sliding distance corresponding to the sliding event; the display container is a page container bound to the current page, and the current page is a page currently displayed by the terminal; A target page determination module, for determining a target page based on the sliding direction and the sequential relationship between pages at the level where the current page is located when determining that the sliding event is valid; The switching module is used to switch the display container from the page container bound to the current page to the page container bound to the target page, so as to render and display the target page through the page container bound to the target page.

9. A terminal comprising a memory and a processor, wherein the memory stores a computer program, characterized in that: When the processor executes the computer program, the steps of the method according to any one of claims 1 to 7 are implemented.

10. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method according to any one of claims 1 to 7 are implemented.

Images