Interface rendering method, computer equipment, computer readable storage medium and computer program product
By constructing a view dataset and target view information, the self-rendering elements in the interface are directly rendered, solving the problem of low interface rendering efficiency and achieving more efficient interface rendering and lower memory usage.
Patent Information
- Application Number
- CN202510830260.X
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-06-20
- Publication Date
- 2025-10-17
AI Technical Summary
In existing technologies, the interface rendering efficiency is low, mainly because the measurement and layout process caused by traversing the view tree takes too long.
By constructing a view dataset and target view information, rendering is performed directly based on the self-rendering elements corresponding to the view, avoiding traversal of the parent-child relationship between views, and using the main thread and child threads to allocate tasks to improve efficiency.
Improved interface rendering efficiency, reduced main thread overhead, improved interface smoothness and reduced memory usage.
Smart Images

Figure CN120803579A_ABST
Abstract
Description
TECHNICAL FIELD
[0001] The present application relates to the technical field of interface rendering, in particular to an interface rendering method and device, a computer device, a computer readable storage medium and a computer program product. BACKGROUND
[0002] A view is a basic element of an interface, and the rendering of the interface depends on the drawing of the view.
[0003] In the related art, an interface usually includes multiple views, and there is a parent-child relationship between the views. Therefore, the views and the parent-child relationship between the views are usually represented in the form of a view tree, and then the views are measured and laid out based on the view tree, so that for a certain view, the position obtained after measurement and layout is the position of the view in its parent view, and thus when the view needs to be drawn, the view tree often needs to be traversed, resulting in low rendering efficiency of the interface. SUMMARY
[0004] Therefore, it is necessary to provide an interface rendering method, a computer device, a computer readable storage medium and a computer program product capable of improving the rendering efficiency of the interface to solve the technical problem of low rendering efficiency of the interface.
[0005] In a first aspect, an interface rendering method is provided, comprising:
[0006] obtaining view data set and target view information of an interface; the view data set includes view data of multiple views in the interface, and the view data of each view at least includes position information of the view in all views; the target view information is used to represent self-rendering elements corresponding to each view;
[0007] rendering the interface based on the view data set and the target view information;
[0008] The view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the multiple views and the parent-child relationship between the views; and the target view information is constructed based on the view data set.
[0009] In one of the embodiments, the rendering of the interface based on the view data set and the target view information comprises:
[0010] In the case that the interface needs to be updated, determining a to-be-updated self-rendering element in each self-rendering element;
[0011] According to the target view information, determining the view data corresponding to the to-be-updated self-rendering element from the view data set;
[0012] based on the view data corresponding to the self-rendering element to be updated, drawing the self-rendering element to be updated in the interface.
[0013] In one of the embodiments, the rendering of the interface based on the view data set and the target view information comprises:
[0014] According to the target view information, determining the view data corresponding to each self-rendering element from the view data set;
[0015] Based on the view data of each self-rendering element, drawing each self-rendering element in the interface.
[0016] In one of the embodiments, the view data set is obtained by:
[0017] Searching the view data set in a cache pool;
[0018] In the case that the view data set exists in the cache pool, obtaining the view data set from the cache pool;
[0019] In the case that the view data set does not exist in the cache pool, constructing the view data set according to the initial view information and caching it to the cache pool.
[0020] In one of the embodiments, the constructing of the view data set according to the initial view information comprises:
[0021] Adding the initial view information to a blank first custom view;
[0022] Measuring and laying out the first custom view to obtain the position information of each view in the first custom view;
[0023] According to the position information of each view in the first custom view, constructing the view data set.
[0024] In one of the embodiments, the target view information is constructed by:
[0025] Creating self-rendering elements corresponding to each view according to the view data set;
[0026] Adding each self-rendering element to a blank second custom view to obtain the target view information.
[0027] In one of the embodiments, after creating the self-rendering elements corresponding to each view according to the view data set, it further comprises:
[0028] In a case where the view dataset is obtained by current creation, the respective rendering element is added to the first custom view, and the initial view information in the first custom view is removed to obtain the target view information.
[0029] In one of the embodiments, the target view information is a custom view including the respective rendering element corresponding to the view.
[0030] The method further includes:
[0031] The size information of the custom view is determined by the main thread, and the range of the custom view in the interface is determined based on the size information of the custom view.
[0032] The respective rendering element is measured and laid out by the sub-thread.
[0033] The respective rendering element is drawn in the range of the custom view by the main thread.
[0034] In one of the embodiments, the initial view information is obtained by:
[0035] The layout file of the interface is obtained.
[0036] The layout file is parsed to determine the plurality of views in the interface and the parent-child relationship between the respective views.
[0037] The view tree of the interface is constructed by taking each view as a node and the parent-child relationship between the respective views as an edge, as the initial view information.
[0038] In a second aspect, the application further provides a computer device including a memory and a processor, the memory stores a computer program, and the processor implements the following steps when executing the computer program:
[0039] The view dataset of the interface and the target view information are obtained; the view dataset includes the view data of the plurality of views in the interface, and the view data of each view at least includes the position information of the view in all views; the target view information is used to represent the respective rendering element corresponding to the view.
[0040] The interface is rendered based on the view dataset and the target view information.
[0041] The view dataset is obtained based on the initial view information of the interface, the initial view information is used to represent the plurality of views and the parent-child relationship between the respective views; and the target view information is obtained based on the view dataset.
[0042] In a third aspect, the present application provides a computer readable storage medium, having stored thereon a computer program, which, when executed by a processor, implements the following steps:
[0043] obtaining a view data set and target view information of an interface; the view data set comprises view data of a plurality of views in the interface, and the view data of each view comprises at least position information of the view in all views; the target view information is used to represent a self-rendering element corresponding to each view;
[0044] rendering the interface based on the view data set and the target view information;
[0045] The view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the plurality of views and parent-child relationships between the views; and the target view information is constructed based on the view data set.
[0046] In a fourth aspect, the present application provides a computer program product, comprising a computer program, which, when executed by a processor, implements the following steps:
[0047] obtaining a view data set and target view information of an interface; the view data set comprises view data of a plurality of views in the interface, and the view data of each view comprises at least position information of the view in all views; the target view information is used to represent a self-rendering element corresponding to each view;
[0048] rendering the interface based on the view data set and the target view information;
[0049] The view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the plurality of views and parent-child relationships between the views; and the target view information is constructed based on the view data set.
[0050] The interface rendering method, the computer device, the computer readable storage medium and the computer program product, first, view dataset of the interface and target view information are acquired; the view dataset includes view data of multiple views in the interface, and the view data of each view at least includes position information of the view in all views; the target view information is used for representing self-rendering elements corresponding to each view; then, the interface is rendered based on the view dataset and the target view information; wherein the view dataset is constructed based on initial view information of the interface, and the initial view information is used for representing multiple views and parent-child relationship between the views; and the target view information is constructed based on the view dataset. In this way, by representing the initial view information of each view in the interface and the parent-child relationship between the views, the view dataset representing the position information of each view in all views can be constructed, and based on the view dataset, the target view information representing the self-rendering elements corresponding to each view can be constructed. Since the target view information and the view dataset do not involve the parent-child relationship between the views, the rendering can be directly realized according to the self-rendering elements corresponding to the views based on the target view information and the view dataset, and the views do not need to be traversed based on the parent-child relationship between the views, thereby improving the rendering efficiency of the interface. BRIEF DESCRIPTION OF DRAWINGS
[0051] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the related art, the following will briefly introduce the drawings needed to be used in the description of the embodiments of the present application or the related art. Obviously, the drawings in the following description only some embodiments of the present application, and for those skilled in the art, other related drawings can also be obtained without creative labor on the basis of these drawings.
[0052] Figure 1 Flowchart for the interface rendering method in one embodiment;
[0053] Figure 2 Flowchart for the step of rendering the interface based on the view dataset and the target view information in one embodiment;
[0054] Figure 3 Flowchart for the step of rendering the interface based on the view dataset and the target view information in another embodiment;
[0055] Figure 4 Flowchart for the step of acquiring the view dataset in one embodiment;
[0056] Figure 5 Flowchart for the step of constructing the view dataset according to the initial view information in one embodiment;
[0057] Figure 6A flowchart of steps for constructing target view information in an embodiment;
[0058] Figure 7 A flowchart of steps for implementing interface rendering by a main thread and a sub-thread in an embodiment;
[0059] Figure 8 A flowchart of steps for implementing interface rendering by a main thread and a sub-thread in another embodiment;
[0060] Figure 9 A flowchart of an interface rendering method in another embodiment;
[0061] Figure 10 A flowchart of an Android self-rendering method for a TV end (television end application) in an embodiment;
[0062] Figure 11 A structural block diagram of an interface rendering device in an embodiment;
[0063] Figure 12 An internal structural diagram of a computer device in an embodiment. DETAILED DESCRIPTION
[0064] In order to make the purposes, technical solutions and advantages of the present application clearer, further detailed description will be given to the present application in combination with the drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and do not limit the present application.
[0065] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data for analysis, stored data, displayed data, etc.) involved in the present application are all information and data authorized by the user or authorized by all parties, and the collection, use and processing of related data need to comply with relevant regulations.
[0066] In an embodiment, as shown in Figure 1 An interface rendering method is provided, and the present embodiment takes the method applied to a server as an example for illustration. It should be understood that the method can also be applied to a terminal, and can also be applied to a system including a server and a terminal, and is implemented through the interaction of the server and the terminal. The server can be a stand-alone physical server, a server cluster or a distributed system composed of multiple physical servers, or a cloud server providing cloud computing services. The terminal can be, but is not limited to, various personal computers, notebook computers, smart phones, tablet computers, Internet of Things devices, and portable wearable devices, etc. In the present embodiment, the method includes the following steps S102 to S104:
[0067] In step S102, view data set and target view information of the interface are acquired.
[0068] The interface includes a plurality of views, and a view is a basic element of the interface. In a specific application, the plurality of views in the interface can include a native view provided by a development framework and / or a custom view provided by the development framework.
[0069] The view data set includes view data of each view.
[0070] The view data of each view at least includes position information of the view in all views, that is, if all views are regarded as an integral view, the view data of each view at least includes position information of the view in the integral view. In a specific application, the position information is a coordinate; further, the view data can also include rendering information (such as color, content, etc.) and size information (width, height) of the view, etc.
[0071] The view data set is constructed based on initial view information.
[0072] The initial view information is used to represent the plurality of views in the interface and the parent-child relationship between the views. In a specific application, the initial view information is a tree with each view as a node and the parent-child relationship between the views as an edge, that is, a view tree of the interface.
[0073] The target view information is used to represent the corresponding self-rendering element of each view; further, the target view information only represents the corresponding self-rendering element of each view, but does not represent the relationship between the views or the self-rendering elements.
[0074] The target view information is constructed based on the view data set.
[0075] It should be noted that in the field of interface rendering, the view tree usually only stores the views and the parent-child relationship between the views, but does not store the related data of the views, and the related data of the views is usually stored in a VDdom tree (virtual Document Object Model) constructed based on the view tree; the VDdom tree has each view data of the view as a node and the parent-child relationship between the views as an edge, that is, the structure of the VDdom tree is the same as that of the view tree.
[0076] Specifically, the rendering in the present application includes complete rendering of the interface, that is, rendering of all contents of the interface when the interface is opened, and partial rendering of the interface, that is, rendering of part of the contents in the interface when the interface needs to be updated.
[0077] When the whole content in the interface needs to be rendered, the server searches for the view dataset of the interface, acquires the view dataset if found, and constructs the view dataset based on the initial view information of the interface if not found, and then constructs the target view information based on the view dataset.
[0078] When part of the content in the interface needs to be rendered, the server directly acquires the constructed view dataset and target view information since the view dataset and target view information have been acquired when the interface is completely rendered.
[0079] Step S104, render the interface based on the view dataset and the target view information.
[0080] Specifically, the server determines the view that needs to be rendered, and determines the self-rendering element corresponding to the view that needs to be rendered as the self-rendering element that needs to be rendered; then, the server calls the target view information, determines the view data of the view corresponding to the self-rendering element that needs to be rendered from the view dataset, and obtains the view data corresponding to the self-rendering element that needs to be rendered; and then, the server renders the interface based on the view data corresponding to the self-rendering element that needs to be rendered.
[0081] In specific applications, the identifier of each view data in the view dataset is the identifier of the corresponding view, and the identifier of each self-rendering element in the target view information is the identifier of the corresponding view, so that the server calls the target view information, searches for the view data with the same identifier as the identifier of the self-rendering element that needs to be rendered in the view dataset based on the identifier of the self-rendering element that needs to be rendered, and takes the view data as the view data corresponding to the self-rendering element that needs to be rendered.
[0082] In the interface rendering method, first, the server obtains a view data set and target view information of the interface; the view data set includes view data of multiple views in the interface, and the view data of each view at least includes position information of the view in all views; the target view information is used to represent self-rendering elements corresponding to the views; then, the server renders the interface based on the view data set and the target view information; wherein the view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the multiple views and parent-child relationships between the views; and the target view information is constructed based on the view data set. In this way, by representing the initial view information of the views in the interface and the parent-child relationships between the views, the server can construct the view data set representing the position information of each view in all views, and based on the view data set, the server can construct the target view information representing the self-rendering elements corresponding to the views. Since the target view information and the view data set do not involve the parent-child relationships between the views, based on the target view information and the view data set, the server can directly render according to the self-rendering elements corresponding to the views, without traversing the views based on the parent-child relationships between the views, thereby improving the rendering efficiency of the interface.
[0083] In one exemplary embodiment, as shown in Figure 2 The step S104 of rendering the interface based on the view data set and the target view information specifically includes the following steps:
[0084] Step S202, in the case that the interface needs to be updated, determining to-be-updated self-rendering elements in the self-rendering elements.
[0085] Step S204, according to the target view information, determining, from the view data set, view data corresponding to the to-be-updated self-rendering elements.
[0086] Step S206, based on the view data corresponding to the to-be-updated self-rendering elements, drawing the to-be-updated self-rendering elements in the interface.
[0087] Wherein, the interface needs to be updated refers to updating part of the content in the interface, that is, rendering part of the content in the interface.
[0088] Wherein, the view data corresponding to the to-be-updated self-rendering elements refers to the view data of the view corresponding to the to-be-updated self-rendering elements.
[0089] Wherein, the to-be-updated self-rendering elements are at least one.
[0090] Specifically, when it is needed to render part of the content in the interface, the server first determines the to-be-updated view in each view, and determines the self-rendering element corresponding to the to-be-updated view as the to-be-updated self-rendering element; then, the server calls the target view information, and determines the view data corresponding to the to-be-updated self-rendering element from the view data set; and then, the server redraws the to-be-updated self-rendering element in the interface based on the view data corresponding to the to-be-updated self-rendering element.
[0091] For example, when the to-be-updated view is a text view, the server determines the text self-rendering element corresponding to the text view as the to-be-updated self-rendering element, then calls the target view information, finds the view data corresponding to the text self-rendering element in the view data set based on the identifier of the text self-rendering element, and draws the text self-rendering element based on the found view data.
[0092] In this embodiment, since the target view information and the view data set do not involve the parent-child relationship between the views, when rendering one or several views, the server can directly render the one or several views based on the target view information and the view data set according to the self-rendering elements corresponding to the views, without traversing the views based on the parent-child relationship between the views, thereby improving the rendering efficiency of the interface.
[0093] In an exemplary embodiment, as shown in Figure 3 The step S104 of rendering the interface based on the view data set and the target view information specifically includes the following steps:
[0094] The step S302 of determining the view data corresponding to each self-rendering element from the view data set based on the target view information.
[0095] The step S304 of drawing each self-rendering element in the interface based on the view data of each self-rendering element.
[0096] Specifically, when it is needed to render all the content in the interface, the server calls the target view information, determines the view data of each view from the view data set as the view data corresponding to the self-rendering element corresponding to each view, and then redraws the to-be-updated self-rendering element in the interface based on the view data corresponding to each self-rendering element.
[0097] In the embodiment, since the target view information and the view data set do not involve the parent-child relationship between the views, when rendering for all the views, the server can directly render each view according to the self-rendering element corresponding to each view based on the target view information and the view data set, without traversing the views according to the parent-child relationship between the views, thereby improving the rendering efficiency of the interface.
[0098] In one example embodiment, as shown in Figure 4 The interface rendering method provided by the application further includes the following steps for obtaining the view data set:
[0099] In step S402, the view data set is searched in the cache pool.
[0100] In step S404, the view data set is obtained from the cache pool if the view data set exists in the cache pool.
[0101] In step S406, the view data set is constructed according to the initial view information and cached in the cache pool if the view data set does not exist in the cache pool.
[0102] Specifically, when the user first opens the interface, the server needs to render all the contents in the interface, so the server first searches the view data set of the interface in the cache pool, obtains the view data set if found, and constructs the view data set based on the initial view information and caches the view data set in the cache pool if not found, so as to directly reuse the currently constructed view data set when the user opens the interface again.
[0103] In the embodiment, the server can reuse the view data set by caching the constructed view data set in the cache pool, and can construct the view data set based on the initial view information.
[0104] In one example embodiment, as shown in Figure 5 The step of constructing the view data set according to the initial view information in step S406 includes the following steps:
[0105] In step S502, the initial view information is added to the blank first custom view.
[0106] In step S504, the first custom view is measured and laid out to obtain the position information of each view in the first custom view.
[0107] In step S506, the view data set is constructed according to the position information of each view in the first custom view.
[0108] Specifically, the server creates a blank custom view to obtain a first custom view; then, the server adds initial view information, i.e., a view tree, to the first custom view, and then measures and lays out the first custom view to obtain position information of each view in the first custom view; finally, the server constructs a view dataset according to the position information of each view in the first custom view.
[0109] In a specific application, the view data can further include rendering information (such as color, content, etc.) and size information (width, height) of the view; based on the parsing of the layout file of the interface, the server can further obtain the rendering information and the size information of each view, and for each view, the server combines the rendering information, the size information, and the position information of the view to obtain view data of the view; finally, the server combines the view data of each view to obtain the view dataset.
[0110] In this embodiment, the server can regard each view as a whole by adding the view tree to the first custom view, and can obtain the position information of each view in the first custom view by measuring and laying out the first custom view; compared with related technologies, the present application represents the position of each view with reference to the first custom view instead of the parent view of each view, so that the traversal of each view is avoided during rendering, and the rendering efficiency of the interface is improved.
[0111] In one exemplary embodiment, as shown in Figure 6 The present application further provides the following steps for constructing target view information:
[0112] In step S602, self-rendering elements corresponding to each view are created according to the view dataset.
[0113] In step S604, the self-rendering elements are added to a blank second custom view to obtain the target view information.
[0114] Specifically, whether the view dataset is currently constructed or obtained from the cache pool, the server can construct the target view information in the following manner: the server creates self-rendering elements corresponding to each view according to the view data of each view in the view dataset, such as rendering information, size information, and position information; then, the server creates a blank custom view to obtain a second custom view, and then adds the self-rendering elements corresponding to all views to the second custom view; the second custom view including all self-rendering elements is the target view information.
[0115] In the embodiment, by adding the self-rendering elements corresponding to the views to the second custom view, the target view information only representing the self-rendering elements and not representing the relationship between the views or the self-rendering elements can be obtained.
[0116] In an exemplary embodiment, after the self-rendering elements corresponding to the views are created according to the view data set in the step S602, the following is further included: in the case that the view data set is currently created, the self-rendering elements are added to the first custom view, and the initial view information in the first custom view is removed to obtain the target view information.
[0117] Specifically, in the case that the view data set is currently constructed, the process of constructing the target view information by the server can also be as follows: the server adds the self-rendering elements to the first custom view, and removes the initial view information in the first custom view, that is, the first custom view including the self-rendering elements corresponding to all the views is the target view information.
[0118] In the embodiment, by adding the self-rendering elements to the first custom view and removing the initial view information from the first custom view, the target view information only representing the self-rendering elements and not representing the relationship between the views or the self-rendering elements can be obtained.
[0119] It can be understood that the target view information only includes one custom view, and the self-rendering elements in the custom view are in the same level and do not have a parent-child relationship with each other, so that all the self-rendering elements in the target view information are rendered in the same level, that is, all the views in the interface are combined into one custom view by the application, and each view is converted into a self-rendering element in the custom view, so that the original measurement-layout-drawing process is changed from recursion of one view tree to measurement-layout-drawing of one custom view and the self-rendering elements in the custom view, thereby improving the rendering efficiency of the interface.
[0120] In an exemplary embodiment, the target view information is a custom view including the self-rendering elements corresponding to the views.
[0121] As shown in Figure 7 The application further includes the following steps of implementing interface rendering by a main thread and a sub-thread:
[0122] In step S702, the size information of the custom view is determined by the main thread, and the range of the custom view in the interface is determined based on the size information of the custom view.
[0123] In step S704, the self-rendering elements are measured and laid out by the sub-thread.
[0124] In step S706, the self-rendering element is drawn in the range of the custom view by the main thread.
[0125] Specifically, rendering usually includes three steps of measurement, layout and drawing, and the drawing is usually completed by the main thread. In the case of more content to be drawn, the measurement and layout will cause certain pressure to the main thread. Therefore, in the present application, the measurement and layout of the self-rendering element in the rendering process are performed in the sub-thread, the main thread only needs to determine the width and height dimension information of the custom view in the interface, and draw a simple placeholder background in the interface according to the dimension information, so as to determine the range of the custom view in the interface. After the measurement and layout of the self-rendering element are completed by the sub-thread, the main thread calls the target view information to draw.
[0126] As shown in Figure 8 Another schematic diagram of steps of interface rendering by the main thread and the sub-thread is shown.
[0127] In the present embodiment, the server can greatly reduce the overhead of the main thread by reasonable task allocation of the main thread and the sub-thread.
[0128] In an exemplary embodiment, the initial view information is obtained by the following manner: obtaining a layout file of the interface; parsing the layout file to determine a plurality of views in the interface and the parent-child relationship between the views; taking each view as a node and taking the parent-child relationship between the views as an edge to construct a view tree of the interface as the initial view information.
[0129] The layout file defines each view included in the interface, and the attributes and parent-child hierarchical relationship of each view. The attributes of the view include width and height, position dependency relationship, color, etc.
[0130] Specifically, the server obtains and parses the layout file of the interface to determine a plurality of views constituting the interface and the parent-child relationship between the views. The server takes each view as a node and takes the parent-child relationship between the views as an edge to construct a view tree, thereby obtaining the initial view information.
[0131] In the present embodiment, the server can obtain the view tree of the interface and further obtain the initial view information of the interface by parsing the layout file.
[0132] In an exemplary embodiment, the interface rendering method provided by the present application is applied to the rendering of Android on a TV end.
[0133] In an exemplary embodiment, as shown in Figure 9 Another interface rendering method is provided, which is applied to the server as an example and includes the following steps:
[0134] Step S902, when the interface is just opened, find the view dataset in the cache pool.
[0135] After step S902, the following steps S904 to S906, or steps S908 to S914 are included:
[0136] Step S904, in the case that the view dataset exists in the cache pool, acquire the view dataset from the cache pool.
[0137] Step S906, create the self-rendering elements corresponding to each view according to the view dataset, and add the self-rendering elements to the blank custom view to obtain the target view information.
[0138] Step S908, in the case that the view dataset does not exist in the cache pool, add the initial view information to the blank custom view.
[0139] Step S910, measure and layout the first custom view to obtain the position information of each view in the first custom view.
[0140] Step S912, construct the view dataset according to the position information of each view in the first custom view and cache it to the cache pool.
[0141] Step S914, create the self-rendering elements corresponding to each view according to the view dataset, add the self-rendering elements to the first custom view, and remove the initial view information in the first custom view to obtain the target view information.
[0142] After step S906 or step S914, the following steps S916 to S918 are included:
[0143] Step S916, according to the target view information, determine the view data corresponding to each self-rendering element from the view dataset, and draw each self-rendering element in the interface based on the view data of each self-rendering element.
[0144] Step S918, when the interface needs to be refreshed, determine the to-be-updated self-rendering element in each self-rendering element, according to the target view information, determine the view data corresponding to the to-be-updated self-rendering element from the view dataset, and draw the to-be-updated self-rendering element in the interface based on the view data corresponding to the to-be-updated self-rendering element.
[0145] In this embodiment, the target view information only includes one custom view, each self-rendering element in the custom view is flat, and there is no parent-child relationship between each other, so all self-rendering elements in the custom view are rendered in the same level, that is, all views in the interface are merged into one custom view by the application, and each view is converted into a self-rendering element in the custom view, so that the original measurement-layout-drawing process changes from recursion of one view tree to measurement-layout-drawing of one custom view and self-rendering elements in the custom view, so as to improve the rendering efficiency of the interface.
[0146] In order to more clearly illustrate the interface rendering method provided by the embodiments of the application, the interface rendering method is specifically described in one specific embodiment below, but it should be understood that the embodiments of the application are not limited to this. As shown in the following embodiment, in one of the exemplary embodiments, the application also provides an Android self-rendering method for a TV end, which specifically includes the following contents: Figure 10
[0147] The application scenario of the method and related technologies are introduced first in this embodiment.
[0148] In related technologies, View is the basic element of the interface, and the rendering of the interface depends on the drawing of View. The interface usually includes multiple views View, and there is a parent-child relationship between each View. Therefore, each View and the parent-child relationship between each View are usually represented in the form of a View tree, and then the View is measured and laid out based on the View tree. The position of a View obtained after measurement and layout is the position of the View in its parent View. Therefore, when the View needs to be drawn, the View tree often needs to be traversed.
[0149] TV end users mainly use a remote control to operate, for example, by using the remote control to control the focus to move on the interface, and to click to realize interaction. When the focus is switched, the Android system updates the focus state, triggering the relayout and drawing of the interface. When there are more Views in the interface and the parent-child level of the Views is more complex, the layout calculation and drawing time consumed is more, which will cause the interface to lag. The rendering method of related technologies will further aggravate the lag of the interface.
[0150] In this embodiment, all views View in the interface are merged into one custom view View-HiveView, and each view View is converted into a self-rendering element Element in the custom view HiveView, so that the original measurement-layout-drawing process changes from recursion of one view tree to measurement-layout-drawing of one custom view and self-rendering elements in the custom view, so as to improve the rendering efficiency of the interface.
[0151] 1. Parse the xml layout file of the interface by using static compilation technology to obtain the View tree of the interface.
[0152] 2. Preferentially search the view dataset of the interface from the cache pool, if found, create the respective rendering element Element of each view View based on the view dataset, and add the respective rendering element Element to the blank custom view HiveView, and then draw the custom view HiveView in combination with the view dataset.
[0153] If the view dataset of the interface cannot be found in the cache pool, add the View tree to the blank custom view HiveView, and perform the measurement and layout of the first frame of the custom view HiveView to obtain the position of each view View in the custom view HiveView, combine the rendering parameters and size information of each view View to obtain the view data of each view View, and then obtain the view dataset of the interface and cache it to the cache pool to facilitate reuse when the interface is opened next. Then, create the respective rendering element Element of each view View according to the view data of each view View, add the respective rendering element Element to the custom view HiveView and remove the View tree in the custom view HiveView, and then draw the custom view HiveView.
[0154] Each rendering element Element contains a canvas Canvas, which is drawn according to the corresponding view data.
[0155] The above process, all rendering elements Element in the custom view HiveView are drawn in one layer, shielding the internal layout calculation, so that the View tree does not need to be traversed again when the interface is rendered.
[0156] 3. In order to reduce the overhead of the main thread, the measurement and layout of the rendering element Element in the rendering process are performed in the sub-thread, and the main thread only needs to determine the width and height size information of the custom view HiveView in the interface, and draw a simple placeholder background in the interface according to the size information to determine the range of the custom view HiveView in the interface. After the sub-thread completes the measurement and layout of the rendering element Element, the main thread calls the custom view HiveView for drawing.
[0157] In this embodiment, through the above process, the smoothness of the home page of the TV end can be greatly improved, and the memory occupied by rendering can also be reduced. In actual testing, based on the above process, the sliding frame rate on the TV device is increased from 27fps to about 54fps, increased by 100%, and the memory is reduced from 61.86MB to 48.55M, reduced by about 20%.
[0158] It should be understood that, although each step in the flowchart involved in each embodiment as described above is displayed in sequence according to the arrow, these steps are not necessarily executed in sequence according to the arrow. Unless otherwise specified herein, the execution of these steps is not strictly limited in sequence, and these steps can be executed in other sequences. Moreover, at least part of the steps in the flowchart involved in each embodiment as described above can include multiple steps or multiple stages, which are not necessarily executed at the same time, but can be executed at different times, and the execution sequence of these steps or stages is not necessarily sequential, but can be executed alternately or alternately with at least part of other steps or steps or stages in other steps.
[0159] Based on the same inventive concept, the embodiments of the present application also provide an interface rendering device for implementing the above-mentioned interface rendering method. The implementation scheme for solving the problem provided by the device is similar to the implementation scheme described in the above method, so the specific limitations in one or more interface rendering device embodiments provided below can refer to the limitations of the interface rendering method in the above text, which will not be repeated here.
[0160] In one exemplary embodiment, as shown in Figure 11 An interface rendering device is provided, comprising: an acquisition module 1102 and a rendering module 1104, wherein:
[0161] The acquisition module 1102 is configured to acquire view data set and target view information of an interface; the view data set comprises view data of a plurality of views in the interface, and the view data of each view at least comprises position information of the view in all views; the target view information is used to represent self-rendering elements corresponding to each view.
[0162] The rendering module 1104 is configured to render the interface based on the view data set and the target view information.
[0163] The view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the plurality of views and the parent-child relationship between the views; the target view information is constructed based on the view data set.
[0164] In an example embodiment, the rendering module 1104 is further configured to, in the case that the interface needs to be updated, determine a self-rendering element to be updated in each rendering element; determine, according to the target view information, view data corresponding to the self-rendering element to be updated from the view data set; and draw the self-rendering element to be updated in the interface based on the view data corresponding to the self-rendering element to be updated.
[0165] In an example embodiment, the rendering module 1104 is further configured to determine, according to the target view information, view data corresponding to each rendering element from the view data set; and draw each rendering element in the interface based on the view data of each rendering element.
[0166] In an example embodiment, the apparatus further comprises a data set obtaining module configured to search for the view data set in the cache pool; and in the case that the view data set exists in the cache pool, obtain the view data set from the cache pool.
[0167] The apparatus further comprises a data set constructing module configured to, in the case that the view data set does not exist in the cache pool, construct the view data set according to the initial view information and cache the view data set to the cache pool.
[0168] In an example embodiment, the data set constructing module is further configured to add the initial view information to a blank first custom view; measure and layout the first custom view to obtain position information of each view in the first custom view; and construct the view data set according to the position information of each view in the first custom view.
[0169] In an example embodiment, the apparatus further comprises a view information constructing module configured to create a self-rendering element corresponding to each view according to the view data set; and add each self-rendering element to a blank second custom view to obtain the target view information.
[0170] In an example embodiment, the view information constructing module is further configured to, in the case that the view data set is currently constructed, add each self-rendering element to the first custom view and remove the initial view information in the first custom view to obtain the target view information.
[0171] In an example embodiment, the target view information is a custom view comprising the self-rendering elements corresponding to each view.
[0172] The rendering module 1104 is further configured to determine size information of the custom view through a main thread, and determine a range of the custom view in the interface based on the size information of the custom view; measure and layout the self-rendering element through a sub-thread; and draw the self-rendering element in the range of the custom view through the main thread.
[0173] In an example embodiment, the view information construction module is further configured to obtain a layout file of the interface; parse the layout file to determine a plurality of views in the interface and parent-child relationships between the views; and construct a view tree of the interface as initial view information, taking each view as a node and the parent-child relationships between the views as edges.
[0174] Each of the modules in the interface rendering apparatus can be implemented wholly or partially by software, hardware, or a combination thereof. Each of the modules can be embedded in or independent of a processor in a computer device in hardware form, or stored in a memory in the computer device in software form, so as to be invoked and executed by the processor to perform operations corresponding to each of the modules.
[0175] In an example embodiment, a computer device, which can be a server, is provided, and an internal structure diagram of the computer device can be as shown in Figure 12 The computer device includes a processor, a memory, an input / output interface, and a communication interface. The processor, the memory, and the input / output interface are connected through a system bus, and the communication interface is connected to the system bus through the input / output interface. The processor of the computer device is configured to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system, a computer program, and a database. The internal memory provides an environment for running the operating system and the computer program in the non-volatile storage medium. The database of the computer device is configured to store view data sets, initial view information, target view information, layout files, and other data. The input / output interface of the computer device is configured to exchange information between the processor and external devices. The communication interface of the computer device is configured to communicate with terminals outside through a network connection. The computer program is executed by the processor to implement an interface rendering method.
[0176] Those skilled in the art can understand that Figure 12 The structure shown in the above
[0177] In an example embodiment, a computer device is also provided, which includes a memory and a processor. The memory stores a computer program, and the processor executes the computer program to implement the steps in each of the method embodiments.
[0178] In an exemplary embodiment, a computer readable storage medium is provided, having stored thereon a computer program which, when executed by a processor, implements the steps of any of the above method embodiments.
[0179] In an exemplary embodiment, a computer program product is provided, comprising a computer program which, when executed by a processor, implements the steps of any of the above method embodiments.
[0180] A person of ordinary skill in the art can understand that all or part of the processes in the above method embodiments can be completed by a computer program instructing related hardware. The computer program can be stored in a non-volatile computer readable storage medium and can include the processes of the above method embodiments when executed. Any reference to a memory, database or other medium in the embodiments provided by the present application can include at least one of a non-volatile memory and a volatile memory. The non-volatile memory can include a read-only memory (ROM), a magnetic tape, a floppy disk, a flash memory, an optical storage, a high-density embedded non-volatile memory, a resistive random access memory (ReRAM), a magnetoresistive random access memory (MRAM), a ferroelectric random access memory (FRAM), a phase change memory (PCM), a graphene memory, etc. The volatile memory can include a random access memory (RAM) or an external cache memory, etc. As an illustration but not limitation, the RAM can be in various forms such as a static random access memory (SRAM) or a dynamic random access memory (DRAM), etc. The database involved in the embodiments provided by the present application can include at least one of a relational database and a non-relational database. The non-relational database can include a distributed database based on a block chain, etc., without being limited thereto. The processor involved in the embodiments provided by the present application can be a general processor, a central processing unit, a graphics processing unit, a digital signal processor, a programmable logic device, a data processing logic device based on quantum computing, an artificial intelligence (AI) processor, etc., without being limited thereto.
[0181] Any technical features in the above embodiments can be combined, and for the sake of brevity, not all possible combinations are described above, however, any combination of these technical features is deemed to be within the scope of the present application.
[0182] The above embodiments only express several implementation manners of the present application, and the description is relatively specific and detailed, but it should not be understood as a limitation on the patent scope of the present application. It should be pointed out that, for ordinary skilled persons in the art, several modifications and improvements can be made without departing from the concept of the present application, and these all belong to the protection scope of the present application. Therefore, the protection scope of the present application should be subject to the appended claims.
Claims
1. An interface rendering method, characterized in that: The method comprises: Obtaining a view dataset and target view information of an interface; the view dataset includes view data of multiple views in the interface, and the view data of each view includes at least position information of the view among all views; the target view information is used to represent the self-rendering element corresponding to each view; Rendering the interface based on the view dataset and the target view information; The view data set is constructed based on initial view information of the interface, and the initial view information is used to represent the multiple views and the parent-child relationship between the views; the target view information is constructed based on the view data set.
2. The method according to claim 1, characterized in that The rendering of the interface based on the view data set and the target view information includes: In the case where the interface needs to be updated, determining a self-rendering element to be updated in each rendering element; Determining, from the view data set according to the target view information, view data corresponding to the to-be-updated self-rendering element; Based on the view data corresponding to the self-rendering element to be updated, the self-rendering element to be updated is drawn in the interface.
3. The method according to claim 1, characterized in that The rendering of the interface based on the view data set and the target view information includes: Determining, from the view data set according to the target view information, view data corresponding to each rendering element; The respective rendering elements are drawn in the interface based on the view data of the respective rendering elements.
4. The method according to claim 1, wherein The view dataset is obtained in the following way: Searching for the view dataset in the cache pool; If the view data set exists in the cache pool, acquiring the view data set from the cache pool; In the case that the view dataset does not exist in the cache pool, the view dataset is constructed according to the initial view information and cached in the cache pool.
5. The method according to claim 4, characterized in that The constructing the view dataset according to the initial view information includes: Adding the initial view information to the blank first custom view; Measuring and laying out the first custom view to obtain position information of each view in the first custom view; The view dataset is constructed based on the position information of each view in the first custom view.
6. The method according to claim 5, characterized in that The target view information is constructed in the following way: Creating a self-rendering element corresponding to each view according to the view data set; Add the respective rendering elements to the blank second custom view to obtain the target view information.
7. The method according to claim 6, characterized in that After creating the self-rendering elements corresponding to the views according to the view data set, the method further includes: In a case where the view dataset is currently created, the respective rendering elements are added to the first custom view, and the initial view information in the first custom view is removed to obtain the target view information.
8. The method according to any one of claims 1 to 7, characterized in that The target view information is a custom view including the self-rendering elements corresponding to each view; The method further comprises: Determining, through the main thread, size information of the custom view, and determining a range of the custom view in the interface based on the size information of the custom view; Through the child thread, measure and layout the self-rendering element; Drawing the self-rendering element in the scope of the custom view through the main thread.
9. The method according to any one of claims 1 to 7, characterized in that The initial view information is obtained in the following manner: Obtaining the layout file of the interface; Parsing the layout file to determine the multiple views in the interface and the parent-child relationship between the views; A view tree of the interface is constructed with each view as a node and the parent-child relationship between the views as an edge, as the initial view information.
10. A computer program product comprising 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 9 are implemented.