Method and device for displaying graphical user interface based on custom data module

By obtaining and parsing the data module from the server when the application starts, and using the singleton module manager to display the graphical user interface, the problems of code reuse difficulties and low development efficiency caused by different implementation methods are solved, and efficient and flexible graphical user interface development is achieved.

CN119759461BActive Publication Date: 2025-09-30CHONGQING JINKANG NEW ENERGY VEHICLE CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202311258937.4
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2023-09-27
Publication Date
2025-09-30
Estimated Expiration
2043-09-27

AI Technical Summary

Technical Problem

In the prior art, graphical user interface developers face difficulties in code reuse, low development efficiency, poor readability, and functional redundancy due to different implementation methods.

Method used

By sending a data acquisition request to the server when the application starts, receiving and parsing the configured data module, using the singleton module manager to temporarily store and call display data, and displaying the graphical user interface on the application based on the attribute information and layout information of the elements to be displayed.

Benefits of technology

It reduces development time and code redundancy, improves development efficiency and flexibility, and achieves unified display of different graphical user interfaces.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119759461B_ABST
    Figure CN119759461B_ABST
Patent Text Reader

Abstract

The present application provides a method and device for displaying a graphical user interface based on a custom data module, the method comprising: sending a data acquisition request to a server when an application is started; receiving at least one data module returned by the server according to the data acquisition request, wherein the data module is configured according to at least one graphical user interface in the application; parsing and processing each data module through a singleton module manager in the application, temporarily storing the display data corresponding to each data module in the singleton module manager, and when the application displays the graphical user interface, calling the attribute information and layout information of the corresponding element to be displayed from the singleton module manager according to the identifier of the graphical user interface, and displaying the corresponding graphical user interface on the application, thereby reducing development time and code redundancy, and improving development efficiency and flexibility.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of resource expansion technology, and in particular to a method and device for displaying a graphical user interface based on a custom data module. Background Art

[0002] Currently, with the emergence of a wide variety of graphical user interface (GUI) applications on the market, developers are facing a lot of headaches when designing various exquisite interfaces. Among them, the most common graphic and text layout method is the most common. However, for different applications, R&D personnel need to write a large amount of code for each different application to achieve the same display effect. Due to different projects and developers, the implementation methods vary, which leads to difficulties in code reuse, low development efficiency, poor readability, redundant functions, and other problems. Summary of the Invention

[0003] In view of this, an embodiment of the present application provides a method and device for displaying a graphical user interface based on a custom data module to solve the technical problems in the prior art that different implementation methods are caused by different developers of graphical user interfaces, which leads to difficulty in code reuse, low development efficiency, poor readability, and redundant functions.

[0004] In a first aspect of an embodiment of the present application, a method for displaying a graphical user interface based on a custom data module is provided, comprising: sending a data acquisition request to a server when an application is started; receiving at least one data module returned by the server according to the data acquisition request, wherein the data module is configured according to at least one graphical user interface in the application; parsing and processing each data module through a singleton module manager in the application to obtain display data corresponding to each data module, and temporarily storing the display data corresponding to each data module in the singleton module manager, wherein the display data includes an identifier of the graphical user interface to be displayed, attribute information of the elements to be displayed, and layout information of the elements to be displayed; when the application displays the graphical user interface, calling the attribute information of the elements to be displayed and the layout information of the elements to be displayed corresponding to the graphical user interface from the singleton module manager according to the identifier of the graphical user interface, and displaying the graphical user interface on the application based on the attribute information of the elements to be displayed and the layout information of the elements to be displayed.

[0005] According to a second aspect of an embodiment of the present application, a device for displaying a graphical user interface based on a custom data module is provided, comprising: a sending module for sending a data acquisition request to a server when an application is started; a receiving module for receiving at least one data module returned by the server according to the data acquisition request, wherein the data module is configured according to at least one graphical user interface in the application; a parsing module for parsing each data module through a singleton module manager in the application to obtain display data corresponding to each data module, and temporarily storing the display data corresponding to each data module in the singleton module manager, wherein the display data includes an identifier of the graphical user interface to be displayed, attribute information of the element to be displayed, and layout information of the element to be displayed; and a display module for calling the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface from the singleton module manager according to the identifier of the graphical user interface when the application displays the graphical user interface, and displaying the graphical user interface on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed.

[0006] According to a third aspect of an embodiment of the present application, an electronic device is provided, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the computer program, the steps of the method provided in the first aspect are implemented.

[0007] According to a fourth aspect of an embodiment of the present application, a computer-readable storage medium is provided, which stores a computer program. When the computer program is executed by a processor, the steps of the method provided in the first aspect are implemented.

[0008] The beneficial effects of the embodiments of the present application compared with the prior art include at least the following: when the application is started, the embodiments of the present application sends a data acquisition request to the server, receives at least one data module returned by the server according to the data acquisition request, parses and processes each data module through the singleton module manager in the application, and temporarily stores the display data corresponding to each data module in the singleton module manager. Then, when the application displays the graphical user interface, the attribute information of the corresponding element to be displayed and the layout information of the element to be displayed are called from the singleton module manager according to the identifier of the graphical user interface, and the graphical user interface is displayed on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed. In this way, the graphical user interface corresponding to the application can be displayed based on the data module pre-configured on the server, without the need for developers to develop a large amount of code for different graphical user interfaces, thereby reducing development time and code redundancy, and improving development efficiency and flexibility. BRIEF DESCRIPTION OF THE DRAWINGS

[0009] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the following briefly introduces the drawings required for use in the embodiments or descriptions of the prior art. 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 any creative work.

[0010] Figure 1 A schematic diagram showing an exemplary system architecture to which the technical solutions of the embodiments of the present invention can be applied;

[0011] Figure 2 is a flow chart of a method for displaying a graphical user interface based on a custom data module according to an embodiment of the present application;

[0012] Figure 3 is a schematic diagram of a graphical user interface with a conventional layout displayed according to a method for displaying a graphical user interface based on a custom data module according to an embodiment of the present application;

[0013] Figure 4 is a schematic diagram of a method for displaying a graphical user interface based on a custom data module according to an embodiment of the present application showing a conventional layout and an unconventional graphical user interface;

[0014] Figure 5 is a block diagram of a device for displaying a graphical user interface based on a custom data module according to an embodiment of the present application;

[0015] Figure 6 It is a structural diagram of an electronic device according to an embodiment of the present application. DETAILED DESCRIPTION

[0016] In the following description, specific details such as specific system structures and techniques are provided for purposes of illustration rather than limitation to facilitate a thorough understanding of the embodiments of the present application. However, it will be apparent to those skilled in the art that the present application may be implemented in other embodiments without these specific details. In other cases, detailed descriptions of well-known systems, devices, circuits, and methods are omitted to avoid obscuring the description of the present application with unnecessary detail.

[0017] Figure 1 A schematic diagram showing an exemplary system architecture to which the technical solutions of the embodiments of the present invention can be applied is shown.

[0018] like Figure 1As shown, the system architecture 100 may include one or more of a first terminal device 101, a second terminal device 102, and a third terminal device 103, a network 104, and a server 105. The network 104 is a medium for providing a communication link between the first terminal device 101, the second terminal device 102, the third terminal device 103, and the server 105. The network 104 may include various connection types, such as wired or wireless communication links or fiber optic cables.

[0019] It should be understood that Figure 1 The number of terminal devices, networks and servers in the embodiment is merely illustrative. Any number of terminal devices, networks and servers may be provided as needed. For example, the server 105 may be a server cluster consisting of multiple servers.

[0020] A user may use a first terminal device 101, a second terminal device 102, and a third terminal device 103 to interact with a server 105 via a network 104 to receive or send data, etc. The first terminal device 101, the second terminal device 102, and the third terminal device 103 may be various electronic devices with display screens, including but not limited to smartphones, tablet computers, laptop computers, and desktop computers.

[0021] Server 105 can be a server that provides various services. For example, server 105 can receive a data acquisition request from first terminal device 101 (or second terminal device 102 or third terminal device 103) and return at least one data module based on the data acquisition request. In this embodiment, developers can pre-configure different data modules for different graphical user interfaces based on the business needs of the application, so that subsequent applications can call them after startup, eliminating the need for developers to develop a large amount of code for different graphical user interfaces.

[0022] When the application of the first terminal device 101 (which can also be the second terminal device 102 or the third terminal device 103) is started, it sends a data acquisition request to the server 105, receives at least one data module returned by the server 105 according to the data acquisition request, parses and processes each data module through the singleton module manager in the application, and temporarily stores the display data corresponding to each data module in the singleton module manager. Then, when the application displays the graphical user interface, the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface are called from the singleton module manager according to the identifier of the graphical user interface, and the graphical user interface is displayed on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed. In this way, the graphical user interface corresponding to the application can be displayed based on the data module pre-configured on the server 105, without the need for developers to develop a large amount of code for different graphical user interfaces, thereby reducing development time and code redundancy, and improving development efficiency and flexibility.

[0023] Figure 2 This is a flow chart of a method for displaying a graphical user interface based on a custom data module according to an embodiment of the present application. The method provided by the embodiment of the present application can be executed by any electronic device with computer processing capabilities, such as Figure 1 The terminal device is shown.

[0024] like Figure 2 As shown, the method for displaying a graphical user interface based on a custom data module includes steps S210 to S240.

[0025] In step S210 , when the application is started, a data acquisition request is sent to the server.

[0026] In step S220, at least one data module returned by the server according to the data acquisition request is received, where the data module is configured according to at least one graphical user interface in the application.

[0027] In step S230, each data module is parsed and processed by the singleton module manager in the application to obtain the display data corresponding to each data module, and the display data corresponding to each data module is temporarily stored in the singleton module manager. The display data includes the identifier of the graphical user interface to be displayed, the attribute information of the elements to be displayed, and the layout information of the elements to be displayed.

[0028] In step S240, when the application displays the graphical user interface, the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface are called from the singleton module manager according to the identifier of the graphical user interface, and the graphical user interface is displayed on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed.

[0029] The method can send a data acquisition request to the server when the application is started, receive at least one data module returned by the server according to the data acquisition request, parse and process each data module through the singleton module manager in the application, temporarily store the display data corresponding to each data module in the singleton module manager, and then when the application displays the graphical user interface, call the attribute information of the element to be displayed and the layout information of the element to be displayed from the singleton module manager according to the identifier of the graphical user interface, and display the graphical user interface on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed. In this way, the graphical user interface corresponding to the application can be displayed based on the data module pre-configured on the server, without the need for developers to develop a large amount of code for different graphical user interfaces, thereby reducing development time and code redundancy and improving development efficiency and flexibility.

[0030] In some embodiments, the data module can be pre-configured by the developer based on the business needs of the application. The data format can be set according to specific needs, for example, it can be in JSON format. The data module can contain the attribute information and layout information of one or more elements to be displayed. The attribute information and layout information of a to-be-displayed element can be stored as an array, and multiple arrays can be stored in a nested dictionary format. The data structure of a data module is as follows:

[0031]

[0032] Among them, cacheKey represents the identifier of the data module corresponding to the graphical user interface, isCache represents whether the data module can be cached, the first preset identifier (for example, true) indicates that it can be cached, and the second preset identifier (false) indicates that it cannot be cached. The content from title to iconSize represents an array of elements to be displayed. Title and icon can represent the attribute information of the elements to be displayed, that is, the display form of the elements to be displayed can be text, pictures, etc. The content from padding to iconSize represents the layout information of the elements to be displayed, that is, the spacing, position, number of rows, number of columns, font size and color, image and text alignment and other layout information of the elements to be displayed.

[0033] Based on the aforementioned embodiment, developers can modify the content in the data module according to the business needs of the application. For example, add fields, delete fields, or modify fields. So that the data module can support various layout forms. For example, support the conventional layout of elements to be displayed in the graphical user interface, the unconventional layout of elements to be displayed in the graphical user interface, and the combination of the conventional layout and unconventional layout of elements to be displayed in the graphical user interface. For example, the conventional layout can refer to the regular display of each element to be displayed, such as up and down display, left and right display, or centered display, etc. The unconventional layout can refer to the irregular display of each element to be displayed, for example, left-aligned display and right-aligned display with different sizes of elements to be displayed, etc.

[0034] In some embodiments, when a user clicks to launch an application through a terminal device, i.e., the application is activated, the application sends a data acquisition request to a server to obtain at least one data module pre-configured for the application from the server. For example, the application sends a data acquisition request, and after receiving the data acquisition request, the server searches the database to see if a data module matching the application is stored. If a data module matching the application is found, the server returns the matching data module. Conversely, if no data module matching the application is found, the server returns a null value, indicating that the server does not have a data module matching the application.

[0035] In some embodiments, before parsing the display data corresponding to each data module from each data module, the method further includes: parsing cache information corresponding to each data module from each data module using a singleton module manager; and determining whether to cache the display data corresponding to each data module in the memory of the terminal device based on the cache information corresponding to each data module. Determining whether to cache the display data corresponding to each data module in the memory of the terminal device based on the cache information corresponding to each data module includes: caching the display data corresponding to the data module in the memory of the terminal device when the cache information corresponding to the data module is a first preset identifier; and not caching the display data corresponding to the data module in the memory of the terminal device when the cache information corresponding to the data module is a second preset identifier.

[0036] Based on the above embodiment, after obtaining the data module from the server, the data module pre-set for the application is parsed by the singleton module manager of the application. For example, the content in isCache is first judged. If it is a first preset identifier (for example, true), the content parsed from the data module is stored in the memory of the terminal device, that is, it is saved locally. If it is a second preset identifier (for example, false), the content parsed from the data module is not stored in the memory of the terminal device, that is, it is not saved locally. In this embodiment, the singleton module manager can be a singleton module management class (for example, VModelManager) created by the application after obtaining the data module, which is used to parse and temporarily store the display data in the data module. For example, data can be parsed from one or more arrays in the data module through methods in the singleton module management class, and the parsed data can be temporarily stored in the singleton module manager in the form of Key and Value through methods in the singleton module management class. When the application is closed, the data temporarily stored in the singleton module manager is deleted. Key is used to store the identifier of the data module of the graphical user interface, and Value is used to store each array.

[0037] Based on the above embodiment, the singleton module manager provides a private attribute of type dictionary, which stores data in the form of Key-Value pairs. The singleton module manager provides a configuration module method that can parse three parameters in the data module: the first parameter is the data module name (hereinafter referred to as cacheKey), which is of type string; the second parameter is the array of data modules (hereinafter referred to as Value), which is of type dictionary and can be empty; and the third parameter is whether to cache (hereinafter referred to as isCache), which is of type Boolean value.

[0038] Based on the above embodiment, the above application can be an application in the iOS system. When the iOS application is started, the application can send a network request (i.e., a data acquisition request) to the server to obtain the corresponding module configuration information (i.e., the data module of the application). When the configuration information is obtained, the iOS application can create a singleton module management class (hereinafter referred to as VModelManager) to store and read the module configuration information read by the server. The server can return the structure of the data module content in Json format, and map the data to the model through mapping. The outermost layer of Json is the data structure of NSDictionary, which is displayed in the form of Key (key)-Value (value) keyboard pairs. Then, all module contents are managed by VModelManager, for example, temporarily storing or deleting an array. The array contains attribute information and layout information of an element to be displayed (e.g., an NSDictionary object), such as but not limited to images, text, spacing, number of rows, number of columns, image and text alignment (e.g., using enumeration values ​​to define image and text alignment), etc. The layout style of different modules is achieved by reading the various attributes in the NSDictionary object. Specifically, when the module configuration information is read from the server, the setting method provided by VModelManager is called to determine whether each data module needs to be cached according to the requirements. The module content is stored through a unique string Key. If caching is required, the corresponding module is stored locally in a persistent manner. The data module that does not need to be cached can be saved in its private properties and can be accessed at will. When it is necessary to obtain the content of the data module, the reading method provided by VModelManager is called to obtain the data module from the server using the unique string Key. If the data module content exists, the server returns the corresponding data module object and updates the graphical user interface of the corresponding data module. If the data module does not exist, the server returns empty. At this time, the graphical user interface is displayed according to the default code logic of the application.

[0039] In some embodiments, the above method also includes: when the cache information corresponding to the data module is a first preset identifier, determining that the singleton module manager does not temporarily store the display data corresponding to the data module; when the application displays the graphical user interface corresponding to the display data, calling the display data corresponding to the data module from the memory of the terminal device, and displaying the graphical user interface on the application based on the display data corresponding to the data module. For example, when isCache in the data module is true, the singleton module manager may not temporarily store the display data corresponding to the data module. In this case, when the application displays the graphical user interface corresponding to the display data, the display data corresponding to the data module can be called locally to render the corresponding graphical user interface based on the locally cached display data and display it on the application. This can improve the response speed and avoid the inability to display the graphical user interface due to poor network signal of the terminal.

[0040] It should be noted that when isCache in the data module is true, the display data corresponding to the data module parsed by the singleton module manager can be temporarily stored in the singleton module manager in the form of Key-Value, or the display data corresponding to the data module may not be temporarily stored. The specific setting can be made according to the actual situation. If the display data corresponding to the data module is not temporarily stored, when the graphical user interface corresponding to the display data is displayed, the display data corresponding to the data module can be called from the memory of the terminal device. If the display data corresponding to the data module is temporarily stored, the display data corresponding to the data module can be called directly from the singleton module manager. This configuration method is more flexible, that is, it can be flexibly set according to the actual situation.

[0041] In some embodiments, the above method further includes: when the network signal status of the terminal device is unstable or disappears, a graphical user interface is displayed on the application based on the display data corresponding to the data module in the memory of the terminal device. For example, when the terminal device is in a specific environment, causing the network signal of the terminal device to be unstable or disappear, if the user starts the application at this time, the graphical user interface can be displayed on the application based on the display data corresponding to the data module in the memory of the terminal device. For example, the corresponding graphical user interface is rendered based on the display data corresponding to the data module stored locally, and is displayed on the application. Displaying the graphical user interface in this way is more user-friendly, increases the adhesion between the user and the application, and thus improves the user experience.

[0042] In some embodiments, the method further includes: deleting the display data corresponding to each data module in the singleton module manager when the application is closed. For example, when the application receives a signal to close the application, the corresponding method in the singleton module manager can be called to delete the display data corresponding to each data module temporarily stored in the singleton module manager. This helps improve the performance and stability of the application and ensures data security.

[0043] In some embodiments, the method further includes: when the application is restarted, determining whether the display data corresponding to each data module parsed by the singleton module manager contains data corresponding to the data module cached in the terminal device's memory; if not, deleting the display data corresponding to the data module from the terminal device's memory. For example, when the application is restarted, the singleton module manager parses at least one data module obtained from the server. Before parsing the display data, a check may be performed to determine whether the display data corresponding to the data module is cached in the terminal device's memory. If the display data corresponding to the data module is cached in the terminal device's memory, the cached data may be compared with the display data parsed by the singleton module manager. For each data module, a check may be performed to determine whether its corresponding display data is cached in the terminal device's memory. If the display data parsed by the singleton module manager does not contain the display data corresponding to a data module in the terminal device's memory, the display data corresponding to the data module may be deleted from the terminal device's memory. Deleting the display data corresponding to the data module in the terminal device's memory may use appropriate methods, such as clearing the cache or setting the data object to null. In this way, the display data corresponding to each data module parsed by the singleton module manager is ensured to be consistent with the cached data in the terminal device's memory. This helps avoid inconsistencies and errors in displayed data and provides users with a good application experience.

[0044] In some embodiments, the above method further includes: if the display data corresponding to each data module includes data corresponding to the data module cached in the memory of the terminal device, determining whether the display data corresponding to the data module currently parsed by the singleton module manager is the same as the data corresponding to the data module cached in the memory of the terminal device; if the display data corresponding to the data module currently parsed by the singleton module manager is not the same as the data corresponding to the data module cached in the memory of the terminal device, replacing the data corresponding to the data module cached in the memory of the terminal device based on the display data corresponding to the data module currently parsed by the singleton module manager. For example, the Key in the singleton module manager is unique, and the display data parsed from the data module is temporarily stored in the singleton module manager in the form of a Key (key)-Value (value) pair. The singleton module manager caches the array in the corresponding data module according to the Key. If the local Key already exists, determine whether the array currently parsed from the data module is the same as the locally stored one. If not, use the latest data to overwrite the old data. This further ensures that the display data corresponding to the data module currently parsed by the singleton module manager is consistent with the cached data in the memory of the terminal device, which helps to maintain data accuracy.

[0045] In some embodiments, the layout information of the elements to be displayed includes conventional layout information of the elements to be displayed and / or unconventional layout information of the elements to be displayed; and displaying the graphical user interface on the application based on the attribute information of the elements to be displayed and the layout information of the elements to be displayed includes displaying the graphical user interface on the application based on the attribute information to be displayed and the conventional layout information of the elements to be displayed and / or the unconventional layout information of the elements to be displayed. For example, the graphical user interface is displayed on the application based on the attribute information of the elements to be displayed and the conventional layout information of the elements to be displayed; the graphical user interface is displayed on the application based on the attribute information of the elements to be displayed and the unconventional layout information of the elements to be displayed; or the graphical user interface is displayed on the application based on the attribute information of the elements to be displayed, the conventional layout information of the elements to be displayed, and the unconventional layout information of the elements to be displayed.

[0046] refer to Figure 3, a graphical user interface is displayed on the application based on the attribute information of the elements to be displayed and the general layout information of the elements to be displayed. The attribute information of the elements to be displayed may be attribute information displayed in the form of text and / or pictures, such as a vehicle icon and vehicle text. The general layout information of the elements to be displayed may be the contents of each array from padding to iconSize in the data module, such as the spacing, position, number of rows, number of columns, font size and color of the elements to be displayed, image and text alignment and other layout information. Among them, the layout method is determined according to the position, for example, a value of 1 represents a top-down layout with the picture on top, 2 represents a top-down layout with the picture at the bottom, 3 represents a left-right layout with the picture on the right, 4 represents a left-right layout with the picture on the left, 5 represents a centered overlay layout with the picture at the bottom and the text at the top, etc., but not limited to this. Other types can be adapted to meet the needs according to the situation. For Figure 3 The conventional graphical user interface shown, the conventional layout information can adopt a top-down layout, the picture is on the top, adopt a top-down layout, the picture is at the bottom, adopt a left-right layout, the picture is on the right, the font is red, adopt a left-right layout, the picture is on the left, the font size is 18, adopt a center layout, and there is no text, adopt a center layout, there is no text, there is a superscript, adopt a center layout, the picture is at the bottom, the text is on the top, or other conventional layouts.

[0047] refer to Figure 4 , a graphical user interface is displayed on the application based on the attribute information of the element to be displayed, the conventional layout information of the element to be displayed, and the unconventional layout information of the element to be displayed. Figure 4 The graphical user interface shown includes a regular layout and an unconventional layout. Regular layout and unconventional layout can be achieved by changing the fields of each array in the data module. For example, regular layout and unconventional layout can be achieved by modifying the position, specifically modifying the enumeration value corresponding to the position to achieve overall left layout, right layout, bottom layout, etc. New fields can also be added to achieve regular layout and unconventional layout, such as adding a new alignment. Figure 4 The conventional graphical user interface shown in FIG, the unconventional layout information can adopt a top-down structure, left-aligned, or a top-down structure left-aligned. The conventional layout information can adopt a combination of text and icons arranged regularly from left to right, or a combination of text and icons arranged regularly from top to bottom. In this embodiment, the graphical user interface is displayed on the application based on the attribute information of the element to be displayed and the unconventional layout information of the element to be displayed, for example, Figure 4 The graphical user interface is displayed on the application in an unconventional layout manner as shown.

[0048] The method for displaying a graphical user interface based on a custom data module provided by the present application can make the layout more flexible by using data modules pre-configured by the server, making most conventional graphical user interface layouts more convenient and faster, and can also increase or reduce the content of the module according to specific scenarios. Developers only need to work with the service to formulate a set of rules, so that a perfect display effect can be achieved by providing a container that adapts to the corresponding solution on the application side. This not only saves development time and development costs, but also allows only one set of data modules for the same scenario to be written and used in all scenarios, which greatly improves compatibility.

[0049] Figure 5 This is a block diagram of a device for displaying a graphical user interface based on a custom data module according to an embodiment of the present application. Figure 5 As shown, the apparatus 500 for displaying a graphical user interface based on a custom data module includes a sending module 510 , a receiving module 520 , a parsing module 530 and a display module 540 .

[0050] Specifically, the sending module 510 is used to send a data acquisition request to the server when the application is started.

[0051] The receiving module 520 is configured to receive at least one data module returned by the server according to the data acquisition request, where the data module is configured according to at least one graphical user interface in the application.

[0052] The parsing module 530 is used to parse and process each data module through the singleton module manager in the application, obtain the display data corresponding to each data module, and temporarily store the display data corresponding to each data module in the singleton module manager. The display data includes the identifier of the graphical user interface to be displayed, the attribute information of the elements to be displayed, and the layout information of the elements to be displayed.

[0053] The display module 540 is used to call the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface from the singleton module manager according to the identifier of the graphical user interface when the application displays the graphical user interface, and display the graphical user interface on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed.

[0054] The device 500 for displaying a graphical user interface based on a custom data module can, when an application is started, send a data acquisition request to a server, receive at least one data module returned by the server according to the data acquisition request, parse and process each data module through a singleton module manager in the application, temporarily store the display data corresponding to each data module in the singleton module manager, and then, when the application displays the graphical user interface, call the attribute information of the element to be displayed and the layout information of the element to be displayed from the singleton module manager according to the identifier of the graphical user interface, and display the graphical user interface on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed. In this way, the graphical user interface corresponding to the application can be displayed based on the data module pre-configured on the server, without the need for developers to develop a large amount of code for different graphical user interfaces, thereby reducing the development time and code redundancy, and improving development efficiency and flexibility.

[0055] In some embodiments, before parsing the display data corresponding to each data module from each data module, the device 500 for displaying a graphical user interface based on a custom data module is also used to: parse the cache information corresponding to each data module from each data module through a singleton module manager; and determine whether to cache the display data corresponding to each data module into the memory of the terminal device based on the cache information corresponding to each data module.

[0056] In some embodiments, determining whether to cache the display data corresponding to each data module into the memory of the terminal device based on the cache information corresponding to each data module includes: when the cache information corresponding to the data module is a first preset identifier, caching the display data corresponding to the data module into the memory of the terminal device; when the cache information corresponding to the data module is a second preset identifier, not caching the display data corresponding to the data module into the memory of the terminal device; the device 500 for displaying a graphical user interface based on a custom data module is also used for: when the network signal status of the terminal device is unstable or disappeared, displaying a graphical user interface on an application based on the display data corresponding to the data module in the memory of the terminal device.

[0057] In some embodiments, the device 500 for displaying a graphical user interface based on a custom data module is also used to: when the application is closed, delete the display data corresponding to each data module in the singleton module manager; when the application is started again, determine whether the display data corresponding to each data module parsed by the singleton module manager contains the data corresponding to the data module cached in the memory of the terminal device; if not, delete the display data corresponding to the data module from the memory of the terminal device.

[0058] In some embodiments, the device 500 for displaying a graphical user interface based on a custom data module is also used to: if the display data corresponding to each data module includes data corresponding to the data module cached in the memory of the terminal device, determine whether the display data corresponding to the data module currently parsed by the singleton module manager is the same as the data corresponding to the data module cached in the memory of the terminal device; if the display data corresponding to the data module currently parsed by the singleton module manager is different from the data corresponding to the data module cached in the memory of the terminal device, replace the data corresponding to the data module cached in the memory of the terminal device based on the display data corresponding to the data module currently parsed by the singleton module manager.

[0059] In some embodiments, the device 500 for displaying a graphical user interface based on a custom data module is also used to: when the cache information corresponding to the data module is a first preset identifier, determine that the singleton module manager does not temporarily store the display data corresponding to the data module; when the application displays the graphical user interface corresponding to the display data, call the display data corresponding to the data module from the memory of the terminal device, and display the graphical user interface on the application based on the display data corresponding to the data module.

[0060] In some embodiments, the layout information of the elements to be displayed includes conventional layout information of the elements to be displayed and / or unconventional layout information of the elements to be displayed; displaying the graphical user interface on the application based on the attribute information of the elements to be displayed and the layout information of the elements to be displayed includes displaying the graphical user interface on the application based on the attribute information to be displayed and the conventional layout information of the elements to be displayed and / or the unconventional layout information of the elements to be displayed.

[0061] Figure 6 is a schematic diagram of the structure of an electronic device according to an embodiment of the present application. Figure 6 As shown, the electronic device 600 of this embodiment includes: a processor 610, a memory 620, and a computer program 630 stored in the memory 620 and executable on the processor 610. When the processor 610 executes the computer program 630, the steps of the above-described method embodiments are implemented. Alternatively, when the processor 610 executes the computer program 630, the functions of the modules in the above-described device embodiments are implemented.

[0062] The electronic device 600 may be a desktop computer, a notebook, a PDA, a cloud server, or other electronic device. The electronic device 600 may include but is not limited to a processor 610 and a memory 620. Those skilled in the art will appreciate that Figure 6 The electronic device 600 is merely an example and does not limit the electronic device 600 . The electronic device 600 may include more or fewer components than shown in the figure, or different components.

[0063] The processor 610 can be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc.

[0064] The memory 620 can be an internal storage unit of the electronic device 600, such as a hard disk or memory of the electronic device 600. The memory 620 can also be an external storage device of the electronic device 600, such as a plug-in hard disk equipped on the electronic device 600, a smart memory card (SMC), a secure digital (SD) card, a flash memory card, etc. The memory 620 can also include both the internal storage unit of the electronic device 600 and an external storage device. The memory 620 is used to store computer programs and other programs and data required by the electronic device.

[0065] Those skilled in the art will clearly understand that for the sake of convenience and brevity of description, only the division of the above-mentioned functional units and modules is used as an example for illustration. In actual applications, the above-mentioned functions can be distributed and completed by different functional units and modules as needed, that is, the internal structure of the device can be divided into different functional units or modules to complete all or part of the functions described above. The functional units and modules in the embodiments can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The above-mentioned integrated units can be implemented in the form of hardware or in the form of software functional units.

[0066] If the integrated module is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium (for example, a computer-readable storage medium). Based on this understanding, the present application implements all or part of the processes in the above-mentioned embodiment method, and can also be completed by instructing the relevant hardware through a computer program. The computer program can be stored in a computer-readable storage medium, and the computer program, when executed by the processor, can implement the steps of the above-mentioned various method embodiments. The computer program may include computer program code, which may be in source code form, object code form, executable file or some intermediate form, etc. Computer-readable media may include: any entity or device capable of carrying computer program code, recording medium, U disk, mobile hard disk, magnetic disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electric carrier signal, telecommunication signal and software distribution medium, etc.

[0067] The above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit them. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some of the technical features therein. These modifications or replacements do not deviate the essence of the corresponding technical solutions from the spirit and scope of the technical solutions of the various embodiments of the present application, and should all be included in the scope of protection of the present application.

Claims

1. A method for displaying a graphical user interface based on a custom data module, characterized in that: include: When the application is started, a data acquisition request is sent to the server; receiving at least one data module returned by the server according to the data acquisition request, wherein the data module is configured according to at least one graphical user interface in the application; The singleton module manager in the application program parses and processes each data module to obtain display data corresponding to each data module, and temporarily stores the display data corresponding to each data module in the singleton module manager, wherein the display data includes an identifier of a graphical user interface to be displayed, attribute information of elements to be displayed, and layout information of elements to be displayed; When the application displays a graphical user interface, the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface are called from the singleton module manager according to the identifier of the graphical user interface, and the graphical user interface is displayed on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed.

2. The method according to claim 1, characterized in that Before parsing the display data corresponding to each data module from each data module, the method further includes: Parsing cache information corresponding to each data module from each data module through the singleton module manager; According to the cache information corresponding to each data module, it is determined whether to cache the display data corresponding to each data module into the memory of the terminal device.

3. The method according to claim 2, characterized in that Determining whether to cache the display data corresponding to each data module into the memory of the terminal device according to the cache information corresponding to each data module includes: When the cache information corresponding to the data module is a first preset identifier, the display data corresponding to the data module is cached in the memory of the terminal device; when the cache information corresponding to the data module is a second preset identifier, the display data corresponding to the data module is not cached in the memory of the terminal device; The method further includes: when the network signal state of the terminal device is unstable or disappears, displaying the graphical user interface on the application based on the display data corresponding to the data module in the memory of the terminal device.

4. The method according to claim 3, characterized in that The method further comprises: When the application is closed, deleting the display data corresponding to each data module in the singleton module manager; When the application is started again, it is determined whether the display data corresponding to each data module parsed by the singleton module manager contains the data corresponding to the data module cached in the memory of the terminal device. If not, the display data corresponding to the data module is deleted from the memory of the terminal device.

5. The method according to claim 4, characterized in that The method further comprises: If the display data corresponding to each data module includes data corresponding to the data module cached in the memory of the terminal device, determining whether the display data corresponding to the data module currently parsed by the singleton module manager is the same as the data corresponding to the data module cached in the memory of the terminal device; If the display data corresponding to the data module currently parsed by the singleton module manager is different from the data corresponding to the data module cached in the memory of the terminal device, the data corresponding to the data module cached in the memory of the terminal device is replaced based on the display data corresponding to the data module currently parsed by the singleton module manager.

6. The method according to claim 3, characterized in that The method further comprises: When the cache information corresponding to the data module is the first preset identifier, determining that the singleton module manager does not temporarily store the display data corresponding to the data module; When the application displays the graphical user interface corresponding to the display data, the display data corresponding to the data module is called from the memory of the terminal device, and the graphical user interface is displayed on the application based on the display data corresponding to the data module.

7. The method according to claim 1, characterized in that The layout information of the elements to be displayed includes conventional layout information of the elements to be displayed and / or unconventional layout information of the elements to be displayed; Displaying the graphical user interface on the application based on the attribute information of the to-be-displayed element and the layout information of the to-be-displayed element includes: The graphical user interface is displayed on the application based on the attribute information to be displayed and the conventional layout information of the elements to be displayed and / or the unconventional layout information of the elements to be displayed.

8. A device for displaying a graphical user interface based on a custom data module, characterized in that: include: The sending module is used to send a data acquisition request to the server when the application is started; a receiving module, configured to receive at least one data module returned by the server according to the data acquisition request, wherein the data module is configured according to at least one graphical user interface in the application; a parsing module, configured to parse each data module through a singleton module manager in the application program to obtain display data corresponding to each data module, and temporarily store the display data corresponding to each data module in the singleton module manager, wherein the display data includes an identifier of a graphical user interface to be displayed, attribute information of elements to be displayed, and layout information of elements to be displayed; The display module is used to call the attribute information of the element to be displayed and the layout information of the element to be displayed corresponding to the graphical user interface from the singleton module manager according to the identifier of the graphical user interface when the application displays the graphical user interface, and display the graphical user interface on the application based on the attribute information of the element to be displayed and the layout information of the element to be displayed.

9. An electronic device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: 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 readable storage medium storing a computer program, 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.

Citation Information

Patent Citations

  • Dynamic generation apparatus and method for application program interface

    CN101477461A

  • Display processing method of application program, terminal and server

    CN109324850A