Page navigation method and computer storage medium
By registering a handler and caching data during page initialization, and listening for the handler to unregister when the page is closed, the problem of Flutter's inability to customize page navigation is solved, thus improving the user experience of custom page navigation.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- SHANGHAI PATEO ELECTRONIC EQUIPMENT MANUFACTURING CO LTD
- Filing Date
- 2021-06-15
- Publication Date
- 2026-06-23
AI Technical Summary
Existing Flutter technology cannot provide custom page navigation, resulting in a poor user experience.
Register a handler and cache data in the navigation management list when the page is initialized. Listen for data deletion and check the list when the page is closed. Display or exit the page as needed and unregister the handler.
A custom page navigation was implemented to meet the need to read all messages in sequence before exiting the page, thus improving the user experience.
Smart Images

Figure CN115481341B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of page management technology, and in particular to a page navigation method and a computer storage medium. Background Technology
[0002] Flutter, Google's open-source next-generation cross-platform UI framework, was released at the 2018 GMTC conference. It features its own Skia rendering engine. Once a UI is written using Flutter, Flutter uses its own Skia engine for rendering, eliminating the need for rendering on mobile devices. This "built-in rendering engine" enables true cross-platform compatibility. A single codebase can be used to build Android, iOS, and web applications, offering a user experience consistent with native applications. The component-based development model based on the UI library efficiently helps update pages while reducing code complexity and improving maintainability.
[0003] However, as a relatively new product, Flutter still has many incomplete features. For example, Flutter cannot provide custom page navigation for all pages. In some scenarios where custom page navigation is required, the existing Flutter implementation cannot handle these situations, resulting in a poor user experience.
[0004] Therefore, there is an urgent need for a page navigation method and computer storage medium to solve the above problems. Summary of the Invention
[0005] The technical problem solved by this invention is to provide a page navigation method and a computer storage medium, thereby solving the problem that the prior art cannot provide a custom page navigation method.
[0006] The technical problem solved by this invention is achieved by the following technical solution:
[0007] A page navigation method includes the following steps: during page initialization, registering a corresponding processor and caching the acquired data in a navigation management list; when the page is closed, deleting the data of the corresponding page in the navigation management list and checking whether there is other page data in the navigation management list; if there is, displaying the page corresponding to the other page data; if there is no other page, exiting the page and unregistering the corresponding processor.
[0008] A computer storage medium storing computer program instructions, which, when executed by a processor, implement the page navigation method as described above.
[0009] The technical effect achieved by the above technical solution of the present invention is as follows: the execution flow of the processor registered during the initialization of the corresponding page is to cache messages in a list. When the page is closed, the corresponding data in the list is deleted, and it is checked whether there is still data in the list. If there is, the page corresponding to the data is displayed. If not, the page is truly exited, and the corresponding processor is deregistered. This satisfies the requirement of reading all messages in the order of arrival before exiting the object page.
[0010] The above description is merely an overview of the technical solution of the present invention. In order to better understand the technical means of the present invention and to implement it in accordance with the contents of the specification, and to make the above and other objects, features and advantages of the present invention more apparent and understandable, preferred embodiments are described below in detail with reference to the accompanying drawings. Attached Figure Description
[0011] Figure 1 This is a flowchart illustrating a page navigation method according to an embodiment of the present invention.
[0012] Figure 2 This is a flowchart illustrating a page display method according to an embodiment of the present invention.
[0013] Figure 3 This is a structural block diagram of a computer storage medium shown in an embodiment of the present invention. Detailed Implementation
[0014] To further illustrate the technical means and effects adopted by the present invention to achieve its intended purpose, embodiments of the present invention are described in detail below. Examples of these embodiments are shown in the accompanying drawings, wherein the same or similar reference numerals denote the same or similar elements or elements having the same or similar functions throughout. The embodiments described below are merely some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the embodiments of the present invention. Through the description of the specific embodiments, a more in-depth and specific understanding of the technical means and effects adopted by the present invention to achieve its intended purpose can be obtained. Moreover, the accompanying drawings are only provided for reference and illustration and are not intended to limit the present invention.
[0015] The page navigation method of the present invention is mainly applied to clients that provide Flutter interface functions. These clients can be installed on any electronic device such as smartwatches, smartphones, televisions, computers, PDAs, game consoles, in-vehicle electronic devices, and commercial electronic devices.
[0016] Figure 1 This is a flowchart illustrating a page navigation method according to an embodiment of the present invention; Figure 2 This is a flowchart illustrating a page display method according to an embodiment of the present invention.
[0017] This invention is used for navigation management on Flutter pages. Building upon Flutter's existing navigation management system, it provides the BaseRouter class, offering the ability to customize page navigation for all pages.
[0018] Please see Figure 1 and Figure 2 ,like Figure 1 As shown, the page navigation method of this embodiment includes the following steps:
[0019] Step S11: During page initialization, register the corresponding processor and cache the acquired data in the navigation management list.
[0020] Specifically, messages for the same object page are cached in a navigation management list.
[0021] The BaseRouter class provides the registerNavigator, unregisterNavigator, and onGenerateRoute methods. BaseRouter is the route management class; each page can implement custom navigation by registering a handler interface.
[0022] Pages that require customized navigation methods can register a page handler during initialization by calling the registerNavigator method in the BaseRouter class, with parameters being (page name, navigation handler callback).
[0023] Specifically, the execution flow of the handlers registered during page initialization is to cache messages in a list. For example, all information is stored in the navigation management list according to the arrival order of messages in the object page. An object page can include multiple message pages.
[0024] In one embodiment, step S11 includes: upon receiving a page open instruction, opening the page corresponding to the highest priority page data in the navigation management list.
[0025] Specifically, the "open page" command is the instruction sent by the user when they open a page. When the terminal receives the "open page" command, it creates the Flutter page navigation. Mainstream frameworks typically manage page navigation in a stack-like manner. For example, if the current page is A0 and page A1 needs to be displayed, page A1 will be on top of page A0, and going back will return to the topmost page. Some projects may have special requirements, where the display of certain pages (usually pages with the same name) needs to be customized in terms of page navigation, such as changing from a stack-like method to a queue or other methods.
[0026] In one embodiment, step S11 includes: registering the object page's processor by calling the registerNavigator method of the BaseRouter class during page initialization.
[0027] Pages requiring customized navigation methods register their navigator handlers during initialization by calling the `registerNavigator` method of the `BaseRouter` class, with the parameters being (page name, navigation handler callback). For example, QingPay's cashier page registers the handler named ` / pay` and uses `PayHandler` as its callback.
[0028] In one implementation, after MaterialApp is successfully created, a NavigatorState object is created; the NavigatorState object includes pushName and pop page navigation interfaces; the MaterialApp includes the onGenerateRoute method of the BaseRouter class.
[0029] By passing the `onGenerateRoute` method of the `BaseRouter` class to the Flutter entry component `MaterialApp`, the default `onGenerate` method of the Flutter framework is replaced. The `pushName` and `pop` page navigation interfaces are used for page navigation.
[0030] Specifically, Flutter's entry component MaterialApp provides the onGenerateRoute method, which creates a NavigatorState object after MaterialApp is successfully created. The NavigatorState object provides interfaces for page navigation, such as pushName and pop methods.
[0031] In one implementation, when the `pushName` method of the `NavigatorState` object is called, the `onGenerateRoute` method is called, which returns a `Route` object. The `Route` object includes a page name, page parameters, and a page object. The Flutter framework displays the page based on the `Route` object.
[0032] Specifically, when a page is opened using the pushName method, a Route object is obtained using the onGenerateRoute method, and the Flutter framework displays the page based on this Route object.
[0033] In one implementation, when the pop method of the NavigatorState object is called, the current page is destroyed and the previous page is displayed.
[0034] Specifically, by unregistering the handler for the current object page, you return to the previous object page.
[0035] When the page is closed, delete the page data from the navigation management list one by one until all the page data in the navigation management list is completely deleted, and then unregister the handler for the target page.
[0036] Please see Figure 2 In one embodiment, the onGenerateRoute method of the BaseRouter class includes the following steps: Step S21: Detect whether the page name to be displayed has been registered with a processor; Step S22: If it has been registered, call the processor; Step S23: If it has not been registered, return a new Route object to display the page.
[0037] Specifically, if a page name has a registered handler, it means the page to be displayed is a subpage of an existing object page. If a page name has no registered handler, it means the page to be displayed is a new object page.
[0038] Flutter is a cross-platform UI development framework released by Google. MaterialApp is the entry point component for every Flutter application. The onGenerateRoute method dynamically generates a Route object. The Route object contains the page name, page parameters, page object constructor, etc., and the Flutter framework uses this object to display the page. The NavigatorState object is the object that provides the navigation interface in the Flutter framework.
[0039] Step S12: When the page is closed, delete the data of the corresponding page in the navigation management list.
[0040] Specifically, after viewing one message on an object page, the user closes that message page. Then, the system checks if there are any other messages on the object page. If so, it displays the remaining message pages.
[0041] Step S13: Check if there is any other page data in the navigation management list.
[0042] Specifically, if other page data exists in the navigation management list, it means that not all the messages on the object page have been viewed yet.
[0043] Taking the smart community project as an example, this project receives push messages sent from the server. The messages are stored in a queue. The page corresponding to the message needs to be read before exiting. The interface is displayed in a queue. That is, if the current page is A0, when page A1 needs to be displayed, page A1 is after page A0 and cannot be displayed immediately. You need to exit page A0 to display page A1.
[0044] Taking the QingPay project as an example, when you are currently on the cashier page (A0), you receive a new cashier page (A1). You need to close A0 and then display A1.
[0045] Step S14: If it exists, display the page corresponding to the other page data.
[0046] In one embodiment, step S14 includes: displaying the page corresponding to the other page data after the deleted page data in the navigation management list.
[0047] Specifically, the navigation management list can include data from multiple pages of an object page. For example, if the currently open message page A is closed, its data is removed from the navigation management list. If message page B still exists in the navigation management list, message page B is displayed.
[0048] Step S15: If it does not exist, exit the page and log out the corresponding processor.
[0049] In one implementation, step S15 includes: unregistering the processor of the corresponding page using the unregisterNavigator method of the BaseRouter class.
[0050] Specifically, after all messages on the object page have been read, exit the page and unregister the object page's handler using the unregisterNavigator method in the BaseRouter class.
[0051] The page navigation method of this invention provides the BaseRouter class on top of Flutter's existing navigation management, enabling all pages to customize their navigation. The execution flow of the handlers registered during page initialization is as follows: messages are cached in a list; when the page is closed, the corresponding data is deleted from the list; if the list still contains data, the corresponding page is displayed; otherwise, the page is truly exited, and the corresponding handler is unregistered. This satisfies the requirement of reading all messages in the order they arrive before exiting the page.
[0052] Please see Figure 3 , Figure 3 This is a structural block diagram of a computer storage medium shown in an embodiment of the present invention.
[0053] like Figure 3 As shown, the computer storage medium includes: a memory 10, a processor 20, and a vehicle information ranking program stored in the memory and executable on the processor. When a token management program triggered by response data is executed by the processor, it implements the steps of the page navigation method as described in any of the above embodiments.
[0054] Through the above description of the embodiments, those skilled in the art can clearly understand that the embodiments of the present invention can be implemented in hardware or by means of software plus necessary general-purpose hardware platforms. Based on this understanding, the technical solutions of the embodiments of the present invention can be embodied in the form of a software product. This software product can be stored in a non-volatile storage medium (such as a CD-ROM, USB flash drive, mobile hard drive, etc.) and includes several instructions to cause a computer device (such as a personal computer, server, or network device, etc.) to execute the methods described in the various implementation scenarios of the embodiments of the present invention.
[0055] It should be understood that, although Figure 1 , Figure 2 The steps in the flowchart are shown sequentially as indicated by the arrows, but these steps are not necessarily executed in the order indicated by the arrows. Unless otherwise explicitly stated herein, there is no strict order in which these steps are executed; they can be performed in other orders. Furthermore, Figure 1 , Figure 2 At least some of the steps in the process may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily completed at the same time, but can be executed at different times. Their execution order is not necessarily sequential, but can be executed in turn or alternately with other steps or at least some of the sub-steps or stages of other steps.
[0056] The preferred embodiments of the present invention have been described in detail above with reference to the accompanying drawings. However, the present invention is not limited to the specific details of the above embodiments. The above embodiments and accompanying drawings are exemplary. The modules or processes in the accompanying drawings are not necessarily necessary for implementing the embodiments of the present invention and should not be construed as limiting the present invention. Within the scope of the technical concept of the present invention, various simple modifications and combinations can be made to the technical solutions of the present invention, and these simple modifications and combinations all fall within the protection scope of the present invention.
Claims
1. A page navigation method, characterized in that, The page navigation method includes the following steps: During page initialization, the corresponding handler is registered and the acquired data is cached in the navigation management list. Specifically, this includes registering the handler for the object page by calling the registerNavigator method of the BaseRouter class during page initialization. When the page is closed, delete the data for the corresponding page from the navigation management list and check if there is any other page data in the navigation management list. If it exists, then display the page corresponding to the other page data; If it does not exist, exit the page and log out the corresponding processor.
2. The page navigation method as described in claim 1, wherein the steps of registering the corresponding processor and caching the acquired data in a first-in-first-out queue-style navigation management list during page initialization include: Upon receiving a page open instruction, open the page corresponding to the highest priority page data in the navigation management list.
3. The page navigation method as described in claim 1, wherein if such a page exists, the step of displaying the page corresponding to the data includes: Displays the pages corresponding to the other page data after the deleted page data in the navigation management list.
4. The page navigation method as described in claim 1, wherein a NavigatorState object is created after MaterialApp is successfully created; The NavigatorState object includes pushName and pop page navigation interfaces; The MaterialApp class includes the onGenerateRoute method.
5. The page navigation method as described in claim 4, wherein when the pushName method of the NavigatorState object is called, the onGenerateRoute method is called to return a Route object, the Route object including the page name, page parameters, and page object; The Flutter framework displays the page based on the Route object.
6. In the page navigation method as described in claim 4, when the pop method of the NavigatorState object is called, the current page is destroyed and the previous page is displayed.
7. The page navigation method as described in claim 4, wherein the onGenerateRoute method of the BaseRouter class includes the following steps: Check if the page name to be displayed has a registered processor; If already registered, then invoke the processor; If not registered, a new Route object display page will be returned.
8. The page navigation method as described in claim 1, wherein if the page does not exist, the steps of exiting the page and deregistering the corresponding processor include: Unregister the handler for the corresponding page using the unregisterNavigator method of the BaseRouter class.
9. A computer storage medium, characterized in that, The computer storage medium stores computer program instructions, which, when executed by a processor, implement the page navigation method as described in any one of claims 1 to 8.