CN113778573A - Method and system for realizing page in user interface - Google Patents

Method and system for realizing page in user interface Download PDF

Info

Publication number
CN113778573A
CN113778573A CN202010472120.7A CN202010472120A CN113778573A CN 113778573 A CN113778573 A CN 113778573A CN 202010472120 A CN202010472120 A CN 202010472120A CN 113778573 A CN113778573 A CN 113778573A
Authority
CN
China
Prior art keywords
page
view controller
flutter
pages
terminal
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202010472120.7A
Other languages
Chinese (zh)
Inventor
周少争
卢旭
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information Technology Co Ltd
Original Assignee
Beijing Jingdong Century Trading Co Ltd
Beijing Wodong Tianjun Information Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Beijing Jingdong Century Trading Co Ltd, Beijing Wodong Tianjun Information Technology Co Ltd filed Critical Beijing Jingdong Century Trading Co Ltd
Priority to CN202010472120.7A priority Critical patent/CN113778573A/en
Publication of CN113778573A publication Critical patent/CN113778573A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/46Multiprogramming arrangements
    • G06F9/54Interprogram communication
    • G06F9/544Buffers; Shared memory; Pipes
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T1/00General purpose image data processing
    • G06T1/20Processor architectures; Processor configuration, e.g. pipelining
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T1/00General purpose image data processing
    • G06T1/60Memory management

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

The invention discloses a method and a system for realizing pages in a UI interface, wherein a UI view controller is established in a terminal in the embodiment of the invention, namely the OS-based FLUTTER view controller or the android system-based FLUTTER view controller, and the IOS-based FLUTTER view controller or the android system-based FLUTTER view controller is used as a container to control and manage a plurality of pages loaded by the terminal, and the plurality of pages are operated by a set UI engine. Therefore, even if a plurality of pages are loaded on a platform of the terminal at the same time, the pages are controlled and operated by one ios-based Flutter view controller or android-based Flutter view controller which is set as a container and one corresponding UI engine, communication among the pages is also realized in the ios-based Flutter view controller or the android-based Flutter view controller, and the pages are realized across the terminal platform on the premise of reducing memory consumption and opening time.

Description

Method and system for realizing page in user interface
Technical Field
The present invention relates to a User Interface (UI) processing technology, and in particular, to a method and a system for implementing a page in a UI.
Background
With the popularization of mobile networks, the requirements of users on the UI design of the used terminals are higher and higher, especially the design of UI views. In order to enable terminals with different platforms to load the same created UI view, various tools can be used for creating the UI view, wherein the UI view is created by using Fluter, which is a tool kit of Google (Google) open source and helps developers to efficiently build a cross-platform Application (APP) view through a set of code library, and the UI view created by the Fluter can be directly implemented on terminal platforms of different operating systems such as android or ios. The UI view created by Flutter is referred to as Flutter page, and the process of implementing the page in the UI is specifically described below by taking the implementation of the Flutter page as an example.
When the Flutter page is implemented in the terminal, if the terminal adopts ios, a UI view controller based on ios, namely a uiview controller tool, is adopted, and if the terminal adopts an android system, a UI view controller based on the android system, namely an Activity tool, is adopted. The UIViewController or Activity is used to control the loading, display and unloading of Flutter pages, as well as communication and coordination with the uiviewcontrollers or activities of other Flutter pages. And respectively creating a UIViewController or Activity for each Flutter page opened at the terminal to control and maintain the Flutter page which is subjected to data processing in a stack mode in the memory.
For each UIViewController or Activity, an Engine (Engine) is correspondingly created, the Engine is actually a thread running in the terminal, if a plurality of Flutter pages are opened in the terminal, a plurality of UIViewController or Activity corresponding to the Engine are provided for maintenance control, and a plurality of engines are created.
The implementation of the Flutter page has the following disadvantages: firstly, the memory consumption of the terminal is large, the execution of the engines consumes more memory, each engine has one Flutter page and is maintained, and the memory resource of each Flutter page is not shared, so that the memory multiple level is increased, the memory leakage and the possible flash back risk of the Flutter page are easily caused, and the user experience is influenced; secondly, the time for opening a certain Flutter page is longer, because a corresponding engine is created by opening one Flutter page, and the initialization process of the engine at the terminal is a time-consuming process, the time for opening the Flutter page is increased; thirdly, communication management is disordered, the jump between the Flutter pages needs to realize communication, the communication is realized by UIViewController or Activity of the Flutter pages, if communication is carried out among a plurality of Flutter pages, the sending and receiving of messages are realized among different UIViewController or Activity, and the management is disordered.
Disclosure of Invention
In view of this, embodiments of the present invention provide a method for implementing a page in a UI, where the method can implement a page across terminal platforms on the premise of reducing memory consumption and open time.
The embodiment of the invention also provides a system for realizing the page in the UI, which can realize the page across terminal platforms on the premise of reducing the memory consumption and the opening time of the UI view.
The embodiment of the invention is realized as follows:
a method of implementing a page in a user interface, comprising:
setting a user interface UI view controller which is used as a container and managing a plurality of pages loaded by a terminal on a UI;
setting a UI engine corresponding to a UI view controller, the UI engine running a plurality of UI pages managed by the UI view controller.
The UI is set in a Flutter mode;
when the system platform of the terminal is ios, the UI view controller is a flute view controller based on ios; when the system platform of the terminal is an android system, the UI view controller is a FLUTTER view controller based on the android system;
the Flutter view control controller declares a singleton, and the Flutter engine declares a singleton.
Further comprising:
when one page of the multiple pages jumps to other pages, the UI view controller releases the one page and loads and manages the other pages.
The UI view controller manages the plurality of pages in a memory in a stack form, and an internal push stack or pop stack function of each page of the plurality of pages is disabled;
the UI view controller and the view controller of the current system platform of the terminal are communicated by adopting a set UI method channel;
each page in the multiple pages is associated with a native page by adopting a unique identifier;
when the UI view controller loads the other pages, the view controller of the current system platform of the terminal informs the UI view controller to execute through a UI method channel, and the view controller of the current system platform of the terminal is added to a native stack by the associated native page in a sub-page mode;
and when the UI view controller releases one page, the view controller of the current system platform of the terminal informs the UI view controller to execute through a UI method channel, and the view controller of the current system platform of the terminal deletes the associated native page from the native stack in a sub-page mode.
When the UI view controller of the current system platform of the terminal is an ios-based Flutter view controller, adding the associated native page to the native stack in a sub-page manner includes:
creating an add-sub-view controller for the associated native page, sub-page loading the associated native page into a native stack by the add-sub-view controller;
the deleting the associated native page from the native stack in a sub-page manner comprises:
a delete from parent view controller is created for the associated native page, and the associated native page is deleted by the delete from parent view controller.
When the UI view controller of the current system platform of the terminal is a Flutter view controller based on the android system, adding the associated native page to the native stack in a sub-page mode includes:
creating an add-view controller for the associated native page, the add-view controller sub-pagewise loading the associated native page into a native stack;
the deleting the associated native page from the native stack in a sub-page manner comprises:
creating a deletion controller for the associated native page, and deleting the associated native page by the deletion controller.
Further, still include:
and in the dynamic process of executing jumping to another page by one page in the multiple pages, when a page jumping event is triggered, screenshot is carried out on the current display page of the terminal and the screenshot is displayed.
A system for implementing a page in a UI, comprising: a setup view controller unit and a setup engine unit, wherein,
the view controller setting unit is used for setting a UI view controller which serves as a container and manages a plurality of pages loaded by the terminal;
and a setting engine unit for setting a UI engine corresponding to the UI view controller, the UI engine running a plurality of pages managed by the UI view controller.
An apparatus for implementing a page in a UI, comprising:
a memory; and a processor coupled to the memory, the processor configured to execute any one of the above-mentioned implementation methods for implementing a page in a UI based on instructions stored in the memory.
A computer-readable storage medium, on which a computer program is stored, which, when executed by a processor, implements the method for implementing a page in a UI according to any of the above.
As can be seen from the above, the embodiment of the present invention creates a UI view controller, that is, an ios-based Flutter view controller or an android-based Flutter view controller, where the ios-based Flutter view controller or the android-based Flutter view controller serves as a container to control a plurality of pages loaded by a management terminal, and the plurality of pages are run by a set UI engine. Therefore, even if a plurality of pages are loaded on a platform of the terminal at the same time, the pages are controlled and operated by one ios-based Flutter view controller or android-based Flutter view controller which is set as a container and one corresponding UI engine, communication among the pages is also realized in the ios-based Flutter view controller or the android-based Flutter view controller, and the pages are realized across the terminal platform on the premise of reducing memory consumption and opening time.
Drawings
FIG. 1 is a flowchart of a method for implementing a page in a UI according to an embodiment of the present invention;
FIG. 2-1 is a diagram showing a method for implementing multiple Flutter pages in the background art;
fig. 2-2 is a diagram showing a method for implementing multiple Flutter pages according to an embodiment of the present invention;
fig. 3 is a schematic diagram of an implementation framework of a Flutter page according to an embodiment of the present invention;
fig. 4 is a schematic structural diagram of a system for implementing a page in a UI according to an embodiment of the present invention.
Detailed Description
The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application, and it is obvious that the described embodiments are only a part of the embodiments of the present application, and not all of the embodiments. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present application.
The terms "first," "second," "third," "fourth," and the like in the description and in the claims, as well as in the drawings, if any, are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It is to be understood that the data so used is interchangeable under appropriate circumstances such that the embodiments of the invention described herein are, for example, capable of operation in sequences other than those illustrated or otherwise described herein. Furthermore, the terms "comprising" and "having," as well as any variations thereof, are intended to cover non-exclusive inclusions. For example, a process, method, system, article, or apparatus that comprises a list of steps or elements is not necessarily limited to those steps or elements explicitly listed, but may include other steps or elements not explicitly listed or inherent to such process, method, article, or apparatus.
The technical solution of the present invention will be described in detail with specific examples. Several of the following embodiments may be combined with each other and some details of the same or similar concepts or processes may not be repeated in some embodiments.
It can be seen from the background art that the main reasons for the large memory consumption of the terminal and the long time for opening the page when the page is implemented across the terminal platform are to establish a uiview controller or Activity for each page to perform control and maintenance, and to establish a corresponding engine for each page to run. Further, this also results in cumbersome and confusing communication procedures between Flutter pages.
Therefore, in the embodiments of the present invention, on the premise of reducing memory consumption and page open time, a UI view controller is created, that is, an ios-based Flutter view controller or an android-based Flutter view controller, and the ios-based Flutter view controller or the android-based Flutter view controller is used as a container to control a plurality of pages loaded by a management terminal, where the plurality of pages are run by a set UI engine.
Therefore, even if a plurality of pages are loaded on a platform of the terminal at the same time, the pages are controlled and operated by one ios-based Flutter view controller or android-based Flutter view controller which is set as a container and one corresponding UI engine, communication among the pages is also realized in the ios-based Flutter view controller or the android-based Flutter view controller, and the pages are realized across the terminal platform on the premise of reducing memory consumption and opening time.
In the embodiment of the invention, the UI can be realized by using a Flutter mode, the provided UI view controller is a Flutter view controller, and the UI engine is a Flutter engine. The following specifically describes a process of implementing a page in the UI by taking an implementation of a Flutter page as an example.
Fig. 1 is a flowchart of a method for implementing a page in a UI according to an embodiment of the present invention, which includes the following specific steps:
step 101, setting a Flutter view controller, wherein the Flutter view controller is used as a container and manages a plurality of Flutter pages loaded by a terminal;
and 102, setting a Flutter engine corresponding to the Flutter view controller, wherein the Flutter engine runs a plurality of Flutter pages managed by the Flutter view controller.
Here, the Flutter view controller may be a UI view controller, and the Flutter engine may be a UI engine. For example only, when the UI is implemented in Flutter, a Flutter view controller and a Flutter engine are used.
In the invention, when the system platform of the terminal adopts ios, the Flutter view controller is based on ios, namely Flutter view controller, and when the system platform of the terminal adopts android system, the Flutter view controller is based on android system, namely fluttetnatirview.
Therefore, the embodiment of the invention adopts a mode of sharing the engine, solves the problem of realizing non-sharing of resources and memories among a plurality of Flutter pages on a cross-terminal platform, solves the problem of large memory consumption of the terminal, and solves the problems of long time for opening the Flutter pages and disordered communication management. Because a plurality of Flutter pages reuse the memory under the operation of one Flutter engine, the memory consumption of the terminal is reduced, and the experience degree of the terminal user is improved.
Fig. 2-1 is a method display diagram for implementing multiple Flutter pages in the background art, and fig. 2-2 is a method display diagram for implementing multiple Flutter pages according to an embodiment of the present invention. As shown in the figure, n engines are required to be set for opening n Flutter pages, wherein n is a natural number; by adopting the scheme provided by the embodiment of the invention, one engine is arranged when the n Flutter pages are opened, and the engine is shared by the n Flutter pages. That is to say, the created fluttviewcontroller or fluttenantiveview is taken as a canvas, then UIViewController or Activity is taken as logical page control, and when a flutteer page is opened, the flutteer view controller or fluttenantiveview is informed in a communication mode to draw the current flutteer page, and the flutteer page is loaded into the fluttviewcontroller or fluttenantiveview.
In the embodiment of the present invention, a plurality of Flutter pages share one fluttviewcontroller or fluttnerativeview and one engine, so that the fluttveviewcontroller or fluttnerativeview and the engine need to be set to a singleton mode, and the fluttveviewcontroller or fluttnerativeview and the engine are declared to be singleton in the setting. The singleton mode is a common software setting mode, only contains a special class called singleton in the core structure, and can ensure that only one instance exists in a class applying the mode in a platform of a terminal through the singleton mode, namely, only one object instance exists in one class, namely, only one flutteviewcontrollerr or fluttermativeview and one engine.
By adopting the embodiment of the invention, a plurality of Flutter pages share one Flutter View controller or Flutter NativeView engine, which also causes problems, such as increasing the complexity of stack processing of the Flutter pages during the data processing of the internal memory. Jumping between the Flutter pages requires operating on the in-memory stack of the Flutter pages. In order to solve the problem, the embodiment of the invention associates the native page with a unique Identifier (ID) for each Flutter page, a PUSH stack (PUSH) and a pop stack (pop) inside the Flutter page are prohibited, and the associated native page is added to or removed from the native stack in the form of a sub-page, and the native stack is controlled by using a set sub-view controller.
In the method of fig. 1, further comprising:
when one of the multiple Flutter pages jumps to other Flutter pages, the Flutter view controller releases the one Flutter page and loads and manages the other Flutter pages. Therefore, the experience effect of the Flutter page in the jumping process can be ensured.
The original experience effect needs to be maintained when the jump of the Flutter page is performed, and the method specifically includes:
the Flutter view controller manages the plurality of Flutter pages in the memory in a stack form, and an internal push-to-stack or pop-up stack function of each of the plurality of Flutter pages is disabled;
the Flutter view controller and the view controller of the current system platform of the terminal are communicated by adopting a set Flutter method channel (Flutter method channel);
each Flutter page in the multiple Flutter pages is associated with a native page by adopting a unique identifier;
when the Flutter view controller loads the other Flutter pages, the view controller of the current system platform of the terminal informs the Flutter view controller to execute through a Flutter methodchannel, and the view controller of the current system platform of the terminal is added to a native stack by the associated native pages in a sub-page manner;
when the Flutter view controller releases one of the Flutter pages, the view controller of the current system platform of the terminal informs the Flutter view controller to execute through a Flutter methodchannel, and the view controller of the current system platform of the terminal deletes the associated native page from the native stack in a sub-page mode.
When the view controller of the current system platform of the terminal is an ios-based Flutter view controller, adding the associated native page to the native stack in a sub-page manner includes:
creating a Flutter view controller (adddevidviewcontroller) that adds ios for the associated native page, the adddevidviewcontroller loading the associated native page into the native stack in a sub-page manner;
the deleting the associated native page from the native stack in a sub-page manner comprises:
a delete view controller (removefromponentviewcontroller) is created from the parent view for the associated native page, which deletes the associated native page.
When the view controller of the current system platform of the terminal is a Flutter view controller based on the android system, adding the associated native page to the native stack in a sub-page manner includes:
creating an add view controller (addView) for the associated native page, the addView sub-pagewise loading the associated native page into a native stack;
the deleting the associated native page from the native stack in a sub-page manner comprises:
a delete controller (removecontroller) is created for the associated native page, by which the associated native page is deleted.
The following is a detailed description.
The invention sets an engine statement as a single case, UIViewController or statement as a single case, aiming at the single case that a Flutter page and an associated native page register data communication respectively, and adopts Flutter MethodChannel to carry out communication, the embodiment of the invention defines a page jump (scheme) protocol as a communication protocol, and the invention comprises the following steps:
protocol description: scheme:// host/path …? params ═ … }
scheme:
ntv, native pages
https \ http, H5 Page
flutter, flutter page
host:xstore.sevenfresh.inner
path: representing a particular page or function, must be guaranteed to be unique
The parameters are …, and the specific data used is in JSON format
As an example, such as (internal jump) skip commodity business page protocol
Ntv://xstore.sevenfresh.inner/product/detailparams={“skuId”:123123,“StoreId”:999}。
As shown in fig. 3, fig. 3 is a schematic diagram of an implementation framework of a Flutter page according to an embodiment of the present invention. Each Flutter page needs an associated native page controlled by a UI view controller to carry the basic operation and life cycle of the Flutter page, and the jump of the Flutter page is managed by the push (pop) of the associated native page. When one Flutter page skips, the addition of the target Flutter page and the deletion of the source Flutter page need to be performed.
The specific process comprises the following steps:
when adding the target Flutter page, the UIViewController or the Activity executes the adding operation of the native page associated with the target Flutter page, the Flutter MethodChannel is adopted to inform the Flutter ViewController or the Flutter NativeView to execute stack adding of the target Flutter page, the internal push of the target Flutter page needs to be prohibited, and the set first child view controller (addViewController or addView) is adopted to take the native page associated with the target Flutter page as a child page and add the child page to the UIViewController or the Activity;
when deleting a source Flutter page, when deleting the source Flutter page by UIViewController or Activity, adopting a Flutter MethodChannel to notify the Flutter ViewController or Flutter NativeView to remove the source Flutter page from a stack, adopting a set second sub-view controller (removeParentViewController or removeView), and adopting a sub-page mode to delete a native page associated with the source Flutter page from UIViewController or Activity management;
here, the Flutter page and the native page are associated with each other by using the set unique identifier.
Therefore, the complete jump process of the Flutter page is realized, and the experience of the user is not influenced.
When the jumping event of the Flutter page is triggered, in the jumping process, the page displayed by the terminal probably includes a part of the source Flutter page and a part of the target Flutter page, that is, the two Flutter pages are multiplexed, because of multiplexing, the terminal firstly displays the source Flutter page and then displays the target Flutter page, which is a dynamic process. In this case, if the embodiment of the present invention is used to jump the Flutter page, the dynamic process of the jump cannot be shown. Therefore, the embodiment of the invention adopts a screenshot mode, the screenshot of the Flutter page in the skipping dynamic process is captured and cached in the memory, when the skipping event of the Flutter page is triggered, the Flutter page with the screenshot is displayed until the target Flutter page is completely displayed, and the problem is solved, so that the user can reach an unconscious state in the using process.
Fig. 4 is a schematic structural diagram of a system for implementing a page in a UI according to an embodiment of the present invention, where the system includes: a setup view controller unit and a setup engine unit, wherein,
the view controller setting unit is used for setting a UI view controller which serves as a container and manages a plurality of pages loaded by the terminal;
and a setting engine unit for setting a UI engine corresponding to the UI view controller, the UI engine running a plurality of pages managed by the UI view controller.
Embodiments of the present application also provide a computer-readable storage medium storing instructions that, when executed by a processor, may perform the steps in the method of implementing a page in a UI as described above. In practical applications, the computer readable medium may be included in the apparatus/device/system described in the above embodiments, or may exist alone without being assembled into the apparatus/device/system. The computer-readable storage medium carries one or more programs, and when the one or more programs are executed, the method for implementing the Flutter page described in the foregoing embodiments may be implemented. According to embodiments disclosed herein, the computer-readable storage medium may be a non-volatile computer-readable storage medium, which may include, for example and without limitation: a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing, without limiting the scope of the present disclosure. In the embodiments disclosed herein, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device.
The embodiment of the invention also provides electronic equipment, wherein the device for realizing the method in the embodiment of the application can be integrated.
Specifically, the method comprises the following steps:
the electronic device may include a processor of one or more processing cores, memory of one or more computer-readable storage media, and a computer program stored on the memory and executable on the processor. The above-described method of implementing a page in a UI may be implemented when executing the program of the memory.
Specifically, in practical applications, the electronic device may further include a power supply, an input unit, an output unit, and other components. Those skilled in the art will appreciate that the configuration of the electronic device in the embodiments of the present invention is not intended to be limiting, and may include more or fewer components than those shown, or some components in combination, or a different arrangement of components. Wherein:
the processor is a control center of the electronic device, connects various parts of the whole electronic device by various interfaces and lines, and performs various functions of the server and processes data by running or executing software programs and/or modules stored in the memory and calling data stored in the memory, thereby performing overall monitoring of the electronic device.
The memory may be used to store software programs and modules, i.e., the computer-readable storage media described above. The processor executes various functional applications and data processing by executing software programs and modules stored in the memory. The memory may mainly include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application program required for at least one function, and the like; the storage data area may store data created according to the use of the server, and the like. Further, the memory may include high speed random access memory, and may also include non-volatile memory, such as at least one magnetic disk storage device, flash memory device, or other volatile solid state storage device. Accordingly, the memory may also include a memory controller to provide the processor access to the memory.
The electronic equipment also comprises a power supply for supplying power to each component, and the power supply can be logically connected with the processor through the power management system, so that the functions of charging, discharging, power consumption management and the like can be managed through the power management system. The power supply may also include any component of one or more dc or ac power sources, recharging systems, power failure detection circuitry, power converters or inverters, power status indicators, and the like.
The electronic device may further include an input unit operable to receive input numeric or character information and generate keyboard, mouse, joystick, optical or trackball signal inputs related to user settings and function control.
The electronic device may further include an output unit that may be used to display information input by or provided to a user as well as various graphical user interfaces that may be made up of graphics, text, icons, video, and any combination thereof.
The flowchart and block diagrams in the figures of the present application illustrate the architecture, functionality, and operation of possible implementations of systems, methods and computer program products according to various embodiments disclosed herein. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams or flowchart illustration, and combinations of blocks in the block diagrams or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.
Those skilled in the art will appreciate that various combinations and/or combinations of features recited in the various embodiments and/or claims of the present disclosure can be made, even if such combinations or combinations are not explicitly recited in the present application. In particular, the features recited in the various embodiments and/or claims of the present application may be combined and/or coupled in various ways, all of which fall within the scope of the present disclosure, without departing from the spirit and teachings of the present application.
The principles and embodiments of the present invention are explained herein using specific examples, which are provided only to help understanding the method and the core idea of the present invention, and are not intended to limit the present application. It will be appreciated by those skilled in the art that changes may be made in this embodiment and its broader aspects and without departing from the principles, spirit and scope of the invention, and that all such modifications, equivalents, improvements and equivalents as may be included within the scope of the invention are intended to be protected by the claims.

Claims (10)

1. A method for implementing a page in a user interface, comprising:
setting a user interface UI view controller which is used as a container and managing a plurality of pages loaded by a terminal on a UI;
setting a UI engine corresponding to a UI view controller, the UI engine running a plurality of UI pages managed by the UI view controller.
2. The method of claim 1, wherein the UI is set in Flutter mode;
when the system platform of the terminal is ios, the UI view controller is a flute view controller based on ios; when the system platform of the terminal is an android system, the UI view controller is a FLUTTER view controller based on the android system;
the Flutter view control controller declares a singleton, and the Flutter engine declares a singleton.
3. The method of claim 1, further comprising:
when one page of the multiple pages jumps to other pages, the UI view controller releases the one page and loads and manages the other pages.
4. The method of claim 3, wherein the UI view controller manages the plurality of pages in memory in a stack, internal push or pop stack functionality of each of the plurality of pages being disabled;
the UI view controller and the view controller of the current system platform of the terminal are communicated by adopting a set UI method channel;
each page in the multiple pages is associated with a native page by adopting a unique identifier;
when the UI view controller loads the other pages, the view controller of the current system platform of the terminal informs the UI view controller to execute through a Flutter method channel, and the view controller of the current system platform of the terminal is added to a native stack by the associated native page in a sub-page mode;
when the UI view controller releases one of the pages, the view controller of the current system platform of the terminal informs the UI view controller to execute through a Flutter method channel, and the view controller of the current system platform of the terminal deletes the associated native page from the native stack in a sub-page mode.
5. The method according to claim 4, wherein when the UI view controller of the current system platform of the terminal is an ios-based Flutter view controller, the adding of the associated native page to the native stack in a sub-page manner comprises:
creating an add-sub-view controller for the associated native page, sub-page loading the associated native page into a native stack by the add-sub-view controller;
the deleting the associated native page from the native stack in a sub-page manner comprises:
a delete from parent view controller is created for the associated native page, and the associated native page is deleted by the delete from parent view controller.
6. The method of claim 4, wherein when the UI view controller of the current system platform of the terminal is a Flutter view controller based on the android system, adding the associated native page to the native stack in a sub-page manner comprises:
creating an add-view controller for the associated native page, the add-view controller sub-pagewise loading the associated native page into a native stack;
the deleting the associated native page from the native stack in a sub-page manner comprises:
creating a deletion controller for the associated native page, and deleting the associated native page by the deletion controller.
7. The method of claim 1 or 3, further comprising:
and in the dynamic process of executing jumping to another page by one page in the multiple pages, when a page jumping event is triggered, screenshot is carried out on the current display page of the terminal and the screenshot is displayed.
8. A system for implementing a page in a UI, comprising: a setup view controller unit and a setup engine unit, wherein,
the view controller setting unit is used for setting a UI view controller which serves as a container and manages a plurality of pages loaded by the terminal;
and a setting engine unit for setting a UI engine corresponding to the UI view controller, the UI engine running a plurality of pages managed by the UI view controller.
9. An apparatus for implementing a page in a UI, comprising:
a memory; and a processor coupled to the memory, the processor configured to execute, based on instructions stored in the memory, an implementation method of implementing a page in a UI according to any of claims 1-7.
10. A computer-readable storage medium, on which a computer program is stored, which, when executed by a processor, implements the method for implementing a page in a UI according to any one of claims 1-7.
CN202010472120.7A 2020-05-29 2020-05-29 Method and system for realizing page in user interface Pending CN113778573A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010472120.7A CN113778573A (en) 2020-05-29 2020-05-29 Method and system for realizing page in user interface

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010472120.7A CN113778573A (en) 2020-05-29 2020-05-29 Method and system for realizing page in user interface

Publications (1)

Publication Number Publication Date
CN113778573A true CN113778573A (en) 2021-12-10

Family

ID=78834160

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010472120.7A Pending CN113778573A (en) 2020-05-29 2020-05-29 Method and system for realizing page in user interface

Country Status (1)

Country Link
CN (1) CN113778573A (en)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104216773A (en) * 2013-06-05 2014-12-17 腾讯科技(深圳)有限公司 View switching method and device
CN105138263A (en) * 2015-08-17 2015-12-09 百度在线网络技术(北京)有限公司 Method and device for jumping to specific page in application
WO2017084497A1 (en) * 2015-11-18 2017-05-26 中兴通讯股份有限公司 Terminal, method and system for realizing multi-mode application page
CN108984245A (en) * 2018-06-20 2018-12-11 武汉斑马快跑科技有限公司 A kind of page switching method and system based on single view controller
WO2020019458A1 (en) * 2018-07-27 2020-01-30 平安科技(深圳)有限公司 Page switching method of hybrid application, framework, computer device and storage medium

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104216773A (en) * 2013-06-05 2014-12-17 腾讯科技(深圳)有限公司 View switching method and device
CN105138263A (en) * 2015-08-17 2015-12-09 百度在线网络技术(北京)有限公司 Method and device for jumping to specific page in application
WO2017084497A1 (en) * 2015-11-18 2017-05-26 中兴通讯股份有限公司 Terminal, method and system for realizing multi-mode application page
CN108984245A (en) * 2018-06-20 2018-12-11 武汉斑马快跑科技有限公司 A kind of page switching method and system based on single view controller
WO2020019458A1 (en) * 2018-07-27 2020-01-30 平安科技(深圳)有限公司 Page switching method of hybrid application, framework, computer device and storage medium

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
袁卉欣;叶德建;: "面向智能移动终端的应用引擎系统", 微型电脑应用, no. 09, 20 September 2015 (2015-09-20) *

Similar Documents

Publication Publication Date Title
WO2022001900A1 (en) Information sending method and apparatus, and electronic device
CN112583700A (en) Group creation method, device, equipment and storage medium
CN103970563B (en) The method of dynamic load Android class
CN111694564A (en) Compiling method, device, equipment and medium for Flutter mixed mode
MX2014009068A (en) Electronic book file processing method, terminal, and electronic device.
WO2022156668A1 (en) Information processing method and electronic device
CN111061981A (en) Page management method and device, storage medium and electronic equipment
CN104978180A (en) Unhandled event reminding method, unhandled event reminding device and mobile terminal
CN104731622A (en) Application program loading method and device and mobile terminal
CN113285866A (en) Information sending method and device and electronic equipment
CN114647519A (en) Data transmission method and device between native platform and Flutter platform and storage medium
CN109885781B (en) Mixed page unified browsing method, device, equipment and storage medium
CN110908837A (en) Application program exception handling method and device, electronic equipment and storage medium
CN110018866B (en) User interface theme updating method, device and system, vehicle machine and vehicle
CN113778573A (en) Method and system for realizing page in user interface
CN106055367A (en) Script file loading method and device
JP5425605B2 (en) Method for simplifying interfaces with dynamic libraries
CN113835748B (en) Packaging method, system and readable medium for application program based on HTML5
CN109891445B (en) Relocating embedded network content via cross-iframe signaling
WO2022171058A1 (en) Application program processing method and apparatus, and electronic device
CN115809126A (en) Job scheduling method and device in mixed deployment scene and electronic equipment
CN112650490B (en) Page switching method, electronic device and storage medium
CN106874782B (en) Traceless use method of mobile terminal and mobile terminal
CN109348303B (en) Bullet screen message distribution method, bullet screen message distribution device, terminal and storage medium
CN104133669A (en) Control method of desktop APP and terminal equipment

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination