List item rendering method and device, electronic equipment and storage medium

Abstract

The embodiment of the invention discloses a list item rendering method and device, electronic equipment and a storage medium. The method comprises the steps that a universal layout is loaded; wherein an occupying component is preset in the general layout; loading the element component of the target list item; and replacing at least part of the placeholder components by utilizing the element components so as to render the target list item. By splitting the list item into the element components with finer granularity, each element component can converge the user interface element and the business logic in the element component, decentralization of the list item can be realized, and the performance of the list in the aspects of performance, expansibility, iteration and the like can be improved.

Description

Technical Field

[0001] This disclosure relates to the field of computer technology, and more particularly to a method, apparatus, electronic device, and storage medium for rendering list items. Background Technology

[0002] Currently, list items in list components can be rendered as cards. This rendering method requires stacking user interface (UI) elements and their processing logic within cards. As business logic iterates, the number of UI elements in list items increases, leading to severe card centralization. This causes significant problems for the list in terms of performance, scalability, and iteration. Summary of the Invention

[0003] This disclosure provides a method, apparatus, electronic device, and storage medium for rendering list items, which can achieve decentralization of list items and improve the performance, scalability, and iteration of the list.

[0004] In a first aspect, embodiments of this disclosure provide a method for rendering list items, including:

[0005] Load a general layout; wherein, the general layout has a pre-set placeholder component;

[0006] Load the element components of the target list item;

[0007] The element component is used to replace at least a portion of the placeholder component in order to render the target list item.

[0008] Secondly, embodiments of this disclosure also provide a rendering apparatus for list items, including:

[0009] The first loading module is used to load a general layout; wherein, the general layout has a pre-set placeholder component;

[0010] The second loading module is used to load the element components of the target list item;

[0011] A rendering module is used to replace at least a portion of the placeholder components with the element components in order to render the target list items.

[0012] Thirdly, embodiments of this disclosure also provide an electronic device, the electronic device comprising:

[0013] One or more processors;

[0014] Storage device for storing one or more programs.

[0015] When the one or more programs are executed by the one or more processors, the one or more processors implement the list item rendering method as described in any embodiment of this disclosure.

[0016] Fourthly, embodiments of this disclosure also provide a storage medium containing computer-executable instructions, which, when executed by a computer processor, are used to perform a method for rendering list items as described in any of the embodiments of this disclosure.

[0017] The technical solution of this disclosure embodiment loads a general layout; wherein, the general layout has a pre-set placeholder component; loads the element component of the target list item; and uses the element component to replace at least some of the placeholder components in order to render the target list item.

[0018] By breaking down list items into finer-grained element components, each component can consolidate its internal user interface elements and business logic, achieving decentralization of list items. This significantly improves list fluency and iteration efficiency. Furthermore, by pre-setting a generic layout with multiple placeholder components, list item rendering can be achieved by replacing at least some placeholder components with element components for different list items. Since placeholder components are extensible, the scalability of list items is enhanced. This improves the list's performance, scalability, and iteration capabilities. Attached Figure Description

[0019] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. Throughout the drawings, the same or similar reference numerals denote the same or similar elements. It should be understood that the drawings are schematic, and the originals and elements are not necessarily drawn to scale.

[0020] Figure 1 A flowchart illustrating a method for rendering list items provided in an embodiment of this disclosure;

[0021] Figure 2 A schematic block diagram of a general layout, element components, and target list item for rendering a list item provided in an embodiment of this disclosure;

[0022] Figure 3 A flowchart illustrating a method for rendering list items provided in an embodiment of this disclosure;

[0023] Figure 4 A schematic block diagram illustrating list updating in a list item rendering method provided in an embodiment of this disclosure;

[0024] Figure 5 A schematic diagram illustrating the process of loading element components in a list item rendering method provided in this embodiment of the disclosure;

[0025] Figure 6 A schematic diagram illustrating the loading of components in the rendering method for list items;

[0026] Figure 7 A schematic diagram of the structure of a list item rendering apparatus provided in an embodiment of this disclosure;

[0027] Figure 8 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this disclosure. Detailed Implementation

[0028] Embodiments of this disclosure will now be described in more detail with reference to the accompanying drawings. While some embodiments of this disclosure are shown in the drawings, it should be understood that this disclosure can be implemented in various forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided to provide a more thorough and complete understanding of this disclosure. It should be understood that the accompanying drawings and embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of protection of this disclosure.

[0029] It should be understood that the steps described in the method embodiments of this disclosure may be performed in different orders and / or in parallel. Furthermore, the method embodiments may include additional steps and / or omit the steps shown. The scope of this disclosure is not limited in this respect.

[0030] The term "comprising" and its variations as used herein are open-ended inclusions, meaning "including but not limited to". The term "based on" means "at least partially based on". The term "one embodiment" means "at least one embodiment"; the term "another embodiment" means "at least one additional embodiment"; the term "some embodiments" means "at least some embodiments". Definitions of other terms will be given in the description below.

[0031] It should be noted that the concepts of "first" and "second" mentioned in this disclosure are used only to distinguish different devices, modules or units, and are not used to limit the order of functions performed by these devices, modules or units or their interdependencies.

[0032] It should be noted that the terms "a" and "a plurality of" used in this disclosure are illustrative rather than restrictive, and those skilled in the art should understand that, unless otherwise expressly indicated in the context, they should be understood as "one or more".

[0033] The names of messages or information exchanged between multiple devices in the embodiments of this disclosure are for illustrative purposes only and are not intended to limit the scope of such messages or information.

[0034] In related technologies, the native Android Recycler View component can contain at least one list item, and the list item is rendered as a card. This rendering method requires stacking user interface (UI) elements and their processing logic within cards, resulting in card centralization. As business needs evolve, a list item can contain more and more UI elements, and different list items may contain different UI elements, which exacerbates card centralization and leads to a series of problems. For example, due to insufficient card scalability, large-scale business projects require significant expansion of card types, leading to increased consumption of computing and storage resources and a decrease in list performance. Furthermore, to complete list item iteration, each UI element in the list item needs to be reloaded, resulting in low iteration efficiency.

[0035] Figure 1 This is a flowchart illustrating a method for rendering list items according to an embodiment of the present disclosure. The embodiments of this disclosure are applicable to situations involving the rendering of list items, such as rendering list items in an Android list component. This method can be executed by a list item rendering device, which can be implemented in software and / or hardware and can be configured in an electronic device, such as an electronic device running the Android operating system.

[0036] like Figure 1 As shown, the list item rendering method provided in this embodiment may include:

[0037] S110. Load the general layout; the general layout contains pre-set placeholder components.

[0038] In this embodiment, the general layout can be understood as a common element layout for different list items. The general layout can be predefined, and multiple placeholder components can be set within it. These placeholder components can be understood as empty components without bound data, serving to provide available space. The number, size, and position of the placeholder components in the general layout can be set according to specific business scenarios to cover different deployment methods of element components in the list items under the corresponding business scenario. Furthermore, the placeholder components are scalable; element components can be inserted into placeholder components, and other placeholder components can also be inserted, thereby improving the scalability of the list items.

[0039] For example, Figure 2 This is a schematic block diagram illustrating the general layout, element components, and target list item for rendering a list item according to an embodiment of this disclosure. See also... Figure 2 The general layout can include placeholder components 1 to 9, and different placeholder components can have different sizes and can be deployed in different positions in the list items.

[0040] When a list component needs to be displayed / updated in the interface, at least one list item corresponding to be displayed / updated in the list component can be rendered. In this embodiment, the list item that needs to be rendered can be referred to as the target list item. Rendering at least one target list item can first be achieved by loading a predefined general layout using an existing loading statement.

[0041] S120. Load the element components of the target list item.

[0042] In this embodiment, the elements included in the target list item may include at least one of the following types: text elements, graphic elements, emoticon elements, image elements, and video elements, etc. The view bound to element data can be called an element component. In this embodiment, a corresponding element view holder (which can be represented by a Cell Holder) can be created for each element in the target list item; wherein, the Cell Holder can be considered a view holder at the element granularity. The element view holder can reference the view of the corresponding element to facilitate processing of the element's view. The element's data can be bound to the corresponding element view holder to complete the loading of the element component. See again. Figure 2 The target list item can contain element component 1 through element component 3.

[0043] By breaking down the native cards of list items into finer-grained element components, each element component can consolidate its internal user interface elements and business logic, achieving decentralization of list items. Each element in a list item can perform asynchronous loading and iteration operations, which can significantly improve the smoothness of the list and increase its iteration efficiency.

[0044] S130. Replace at least part of the placeholder component using element components to render the target list item.

[0045] In this embodiment of the disclosure, placeholder components and element components in the general layout can have a corresponding relationship. Based on this relationship, the corresponding placeholder component can be replaced using the element component. This allows the element corresponding to the element component to be rendered in the target list item. Furthermore, placeholder components that do not have a corresponding relationship with element components can be retained. Since the data in the retained placeholder components is empty, their existence is not noticeable in the rendered target list item.

[0046] By pre-setting a generic layout with multiple placeholder components, at least some placeholder components can be replaced with element components for different list items. This enables dynamic insertion and removal of element components based on placeholders, allowing for quick processing of the target list items, such as display and iteration.

[0047] In some alternative implementations, replacing at least some placeholder components with element components may include: determining a target placeholder component corresponding to the target category from the placeholder components based on the target category of the element component and the correspondence between placeholder components and component categories; removing the target placeholder component; and adding the element component corresponding to the target placeholder component.

[0048] Component categories can be understood as pre-defined classifications of components based on their business functions. Components of the same element type can belong to different component categories, and components of different element types can belong to the same component category. For example, in a communication scenario, text element components can be categorized into nickname components and message content components, etc., based on their business functions; while text element components and video element components can both belong to message content components, based on their business functions.

[0049] In this embodiment, the target category may include the component category corresponding to the element component in the target list item. For example, see again... Figure 2 In a communication scenario, element component 1 can be an image element component, and in terms of business function, the image element component can belong to the avatar component; element component 2 can be a text element component, and in terms of business function, the text element component can belong to the content component; element component 3 can be an emoticon element component, and in terms of business function, the emoticon component can belong to the emoticon component that interacts with the content in the content component.

[0050] This involves pre-setting the correspondence between placeholder components and component categories. Correspondingly, based on this correspondence and the target category, a placeholder component corresponding to the target category can be determined from the placeholder components; this can be called the target placeholder component. In essence, the target placeholder component pre-places space for element components in the target list item, allowing the element components in the target list item to be rendered at the appropriate position.

[0051] After identifying the target placeholder component for each element component, the target placeholder component can be removed using existing remove statements, thus enabling the removal of the target placeholder component. Conversely, the element component corresponding to the target placeholder component can be added using existing add statements, thus enabling the insertion of element components. This allows for the dynamic insertion and removal of components within a list item.

[0052] See you again Figure 2Placeholder component 1 can be removed and element component 1 (such as an avatar component) can be added; placeholder component 9 can be removed and element component 2 (such as a content component) can be added; placeholder component 6 can be removed and element component 3 (such as an emoji component) can be added. This allows for the rendering of target list items in the communication message list.

[0053] Among these alternative implementations, a placeholder pattern can be used to assemble the element components in the target list item.

[0054] In some further implementations, the target category may include a content category; adding the element component corresponding to the target placeholder component may include: setting the size and layout parameters of the first element component belonging to the content category; and adding the first element component according to the set size and layout parameters.

[0055] The content category can include component categories that belong to the content component category in terms of business functionality. The element components belonging to the content category can be referred to as the first element component. Typically, the elements in the first element component can include various types, such as text elements, image elements, and video elements. When adding a first element component, its size (e.g., width and height parameters) and layout parameters can be reset according to the types of elements within it, and the first element component can be added based on the reset size and layout parameters.

[0056] In addition, the target category can also include business categories; adding element components corresponding to the target placeholder component can include: adding a second element component belonging to the business category based on the size and layout parameters of the target placeholder component.

[0057] The business category can include component categories other than content components in terms of business functionality, such as emoticon components, avatar components, and nickname components. Element components belonging to the business category can be referred to as second element components. Second element components typically have fixed size and layout parameters; therefore, when pre-setting placeholder components corresponding to second element components, their size and layout parameters can be set simultaneously. Correspondingly, when adding second element components, they can be added based on the size and layout parameters of the target placeholder component to be removed.

[0058] In these further implementations, for content-type element components, the size and layout parameters can be reset when adding them; for business-type element components, the preset size and layout parameters of the corresponding target placeholder component can be used when adding them.

[0059] The technical solution of this disclosure involves loading a general layout, wherein the general layout includes pre-defined placeholder components; loading element components for the target list item; and replacing at least some of the placeholder components with the element components to render the target list item. By splitting list items into finer-grained element components, each element component can converge its internal user interface elements and business logic, achieving decentralization of list items, thereby significantly improving the fluency of the list and increasing its iteration efficiency. Furthermore, by pre-setting a general layout with multiple placeholder components, list item rendering can be achieved by replacing at least some of the placeholder components with element components for different list items. Since the placeholder components are extensible, the scalability of the list items can be improved. This enhances the list's performance, scalability, and iteration capabilities.

[0060] This embodiment can be combined with various optional schemes in the list item rendering methods provided in the above embodiments. The list item rendering method provided in this embodiment, by completing the data calculation of the element components in a sub-thread and rendering in the main thread, can realize asynchronous calculation of element components, save the main thread's computing resources, thereby improving the smoothness of list rendering and reducing lag.

[0061] Figure 3 This is a flowchart illustrating a method for rendering list items provided in an embodiment of this disclosure. Figure 3 As shown, the list item rendering method provided in this embodiment may include:

[0062] S310. Load the general layout; the general layout contains pre-set placeholder components.

[0063] S320. Load the element components of the target list item through a sub-thread.

[0064] In this embodiment, a sub-thread can be created for each element in the target list item; and a Cell Holder can be created through the corresponding sub-thread, and the element's data can be bound to the created Cell Holder to complete the loading of the element component. By loading different element components through different sub-threads, asynchronous calculation of element components is achieved, reducing the data processing pressure on the main thread.

[0065] S330. Using the main thread, replace at least some of the placeholder components with element components to render the target list items.

[0066] After generating each element component, the main thread can be notified to render each element component to the target list item using a dynamic plug-and-play method. By distributing the element component calculation process across various child threads, decentralization of the list items can be achieved. This saves main thread computing resources, improving the smoothness of list rendering and reducing lag.

[0067] In some alternative implementations, the rendering method for list items may also include: in response to an update of the target list item, loading the element component of the target element via a child thread corresponding to the updated target element.

[0068] For example, Figure 4 This is a schematic block diagram illustrating list updating in a list item rendering method provided in an embodiment of this disclosure. See also... Figure 4 The updating of a target list item may include, but is not limited to: adding a new list item to the list, and updating at least some elements in the original list items. In this embodiment, the newly added list item and the list item with updated elements can be referred to as the target list item.

[0069] When adding a new list item, all elements in the target list item can be used as the target element for updating. The element components of the target element are loaded via a child thread corresponding to the target element, and then the target element is added to the corresponding slot via the main thread for rendering the target list item. This allows for the addition of a new list item to the list.

[0070] When updating only some elements in the original list item, the changed elements can be used as the target elements for the update. By using a sub-thread corresponding to the target element, the element components of the target element are reloaded, and the corresponding element components in the target list item are re-rendered via the main thread. This allows for updating only a portion of the elements in the target list item without updating the entire list item, thus improving list update efficiency.

[0071] Among these optional implementations, the calculation of the element components of the target element can be moved to a sub-thread, and the list can be updated after loading / reloading the element components, thereby enabling fast updating and iteration of the list.

[0072] The technical solution of this disclosure embodiment achieves asynchronous calculation of element components by completing data calculation of element components in a sub-thread and rendering in the main thread, thus saving main thread computing resources, improving the smoothness of list rendering and reducing lag. The list item rendering method provided in this disclosure embodiment belongs to the same disclosed concept as the list item rendering method provided in the above embodiments. Technical details not described in detail in this embodiment can be found in the above embodiments, and the same technical features have the same beneficial effects in this embodiment and the above embodiments.

[0073] This embodiment can be combined with various optional schemes in the list item rendering methods provided in the above embodiments. The list item rendering method provided in this embodiment can bind the data model and element view holder corresponding to each element through an adapter, thereby completing the element model loading of each element.

[0074] Figure 5 This is a schematic diagram illustrating the process of loading element components in a list item rendering method provided in an embodiment of this disclosure. Figure 5 As shown, the method for rendering list items provided in this embodiment, loading the element components of the target list item, may include:

[0075] S510. Determine the data model of at least one element based on the data source of at least one element in the target list item.

[0076] In this embodiment, each element can have a corresponding element assembler (which can be represented by Cell Interact), and the element assembler can be used to carry the element's data source and process it into the corresponding data model. Here, the data source can refer to the element's original format data, which usually contains characters other than data; the data model can refer to the data class that extracts pure data from the data source and combines it.

[0077] S520. Create at least one element view holder; wherein the at least one element view holder references a view of at least one element respectively.

[0078] In this embodiment, an element adapter (which can be represented by a Compose Cell Adapter) can be created, and through the element adapter, a corresponding element view holder (which can be represented by a Cell Holder) can be created for each element in each target list item. The element view holder can reference the view of the corresponding element to facilitate the processing of the element's view.

[0079] S530. Bind at least one data model to at least one element view holder to load the element component corresponding to at least one element.

[0080] In this embodiment, the data model of an element (which can be represented by Cell State) can also be bound to the corresponding Cell Holder through an element adapter to complete the loading of the element component.

[0081] In this embodiment, the View Holder corresponding to the card in the native list component can be mapped to the element to obtain a more granular Cell Holder. Furthermore, the Cell Holders bound to the data model can be dynamically plugged and dumped to assemble the target list item. The binding method of view data can be optimized from being determined by the original view to being data-driven, which facilitates flexible rendering of different list items.

[0082] For example, Figure 6A schematic diagram illustrating the loading of components in the rendering method for list items. See also... Figure 6 The block diagram may include two ways of loading components; wherein, method 1 may represent a schematic block diagram of the original loading card component, and method 2 may represent a schematic block diagram of the loading element component in the rendering method provided in this embodiment.

[0083] As shown in Method 1, the process of loading a card component may include: creating a card adapter (which can be represented by an Adapter), and creating a card view holder for the list item through the card adapter. The card view holder can reference the card's view. Each card can have a corresponding card assembler (which can be represented by an Interact), and the card assembler can be used to hold the data source for all elements in the card and process it into a data model. The card adapter can obtain the data model from the card assembler through a first preset interface (which can be represented by I Adapter Data) and bind it to the card view holder to load the card component.

[0084] As shown in Method 2, the process of loading element components may include: creating an element adapter (which can be represented by Compose CellAdapter), and through the element adapter, creating a corresponding element view holder (which can be represented by Cell Holder) for each element in each target list item. The element view holder can reference the view of the corresponding element. Each element can have a corresponding element assembler (which can be represented by Cell Interact), and the element assembler can be used to hold the element's data source and process it into the corresponding data model. Since the element type can include text elements, graphic elements, emoticon elements, image elements, and video elements, the element assembler can also correspondingly create text element assemblers (which can be represented by Text Cell Interact), graphic element assemblers (which can be represented by Graphical Cell Interact), emoticon element assemblers (which can be represented by Emoji Cell Interact), image element assemblers (which can be represented by Image CellInteract), and video element assemblers, etc.

[0085] The card adapter can obtain the data model of each element from each element assembler through the second preset interface (which can be represented by I Cell Adapter Data), and bind it to the corresponding element view holder to realize the loading of each element component.

[0086] The technical solution of this disclosure embodiment can bind the data model and element view holder corresponding to each element through an adapter, thereby completing the loading of the element model of each element. The list item rendering method provided in this disclosure embodiment belongs to the same disclosed concept as the list item rendering method provided in the above embodiments. Technical details not described in detail in this embodiment can be referred to in the above embodiments, and the same technical features have the same beneficial effects in this embodiment and the above embodiments.

[0087] Figure 7 This is a schematic diagram of a list item rendering apparatus provided in an embodiment of the present disclosure. The list item rendering apparatus provided in this embodiment is applicable to situations where list items are rendered, such as when rendering list items in an Android list component.

[0088] like Figure 7 As shown, the list item rendering apparatus provided in this embodiment may include:

[0089] The first loading module 710 is used to load the general layout; wherein, the general layout has a pre-set placeholder component;

[0090] The second loading module 720 is used to load the element components of the target list item;

[0091] Rendering module 730 is used to replace at least part of the placeholder component with element components in order to render the target list item.

[0092] In some alternative implementations, the second loading module can be used for:

[0093] Load the element components of the target list item using a sub-thread;

[0094] The rendering module can be used for:

[0095] Using the main thread, replace at least some of the placeholder components with element components.

[0096] In some alternative implementations, the second loading module can also be used for:

[0097] In response to an update of a target list item, the element components of the target element are loaded via a child thread corresponding to the updated target element.

[0098] In some alternative implementations, the second loading module can be used for:

[0099] Determine the data model for at least one element based on the data source of at least one element in the target list item;

[0100] Create at least one element view holder; wherein the at least one element view holder references a view of at least one element respectively;

[0101] Bind at least one data model to at least one element view holder to load the element component corresponding to at least one element.

[0102] In some alternative implementations, the rendering module can be used for:

[0103] Based on the target category of the element component and the correspondence between the placeholder component and the component category, determine the target placeholder component that corresponds to the target category from the placeholder components;

[0104] Remove the target placeholder component and add the element component corresponding to the target placeholder component.

[0105] In some alternative implementations, the target category includes a content class; the rendering module can be used for:

[0106] Set the size and layout parameters for the first element component that belongs to the content category;

[0107] Add the first element component based on the set size and layout parameters.

[0108] In some alternative implementations, the target category includes business classes; the rendering module can be used for:

[0109] Based on the size and layout parameters of the target placeholder component, add the second element component belonging to the business category.

[0110] The list item rendering apparatus provided in this disclosure can execute the list item rendering method provided in any embodiment of this disclosure, and has the corresponding functional modules and beneficial effects of the execution method.

[0111] It is worth noting that the various units and modules included in the above-mentioned device are only divided according to functional logic, but are not limited to the above division, as long as the corresponding functions can be realized; in addition, the specific names of each functional unit are only for easy differentiation and are not used to limit the protection scope of the embodiments of this disclosure.

[0112] The following is for reference. Figure 8 It illustrates an electronic device suitable for implementing embodiments of the present disclosure (e.g., Figure 8The diagram below shows the structure of the terminal device or server 800. The terminal device in this embodiment may include, but is not limited to, mobile terminals such as mobile phones, laptops, digital broadcast receivers, PDAs (personal digital assistants), PADs (tablet computers), PMPs (portable multimedia players), and vehicle terminals (e.g., vehicle navigation terminals), as well as fixed terminals such as digital TVs and desktop computers. Figure 8 The electronic device shown is merely an example and should not be construed as limiting the functionality and scope of the embodiments disclosed herein.

[0113] like Figure 8 As shown, the electronic device 800 may include a processing unit (e.g., a central processing unit, a graphics processor, etc.) 801, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 802 or a program loaded from a storage device 808 into a random access memory (RAM) 803. The RAM 803 also stores various programs and data required for the operation of the electronic device 800. The processing unit 801, ROM 802, and RAM 803 are interconnected via a bus 804. An input / output (I / O) interface 805 is also connected to the bus 804.

[0114] Typically, the following devices can be connected to I / O interface 805: input devices 806 including, for example, touchscreens, touchpads, keyboards, mice, cameras, microphones, accelerometers, gyroscopes, etc.; output devices 807 including, for example, liquid crystal displays (LCDs), speakers, vibrators, etc.; storage devices 808 including, for example, magnetic tapes, hard disks, etc.; and communication devices 809. Communication device 809 allows electronic device 800 to communicate wirelessly or wiredly with other devices to exchange data. Although Figure 8 An electronic device 800 with various devices is shown; however, it should be understood that it is not required to implement or possess all of the devices shown. More or fewer devices may be implemented or possessed alternatively.

[0115] In particular, according to embodiments of this disclosure, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, embodiments of this disclosure include a computer program product comprising a computer program carried on a non-transitory computer-readable medium, the computer program containing program code for performing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network via a communication device 809, or installed from a storage device 808, or installed from a ROM 802. When the computer program is executed by the processing device 801, it performs the functions defined in the rendering method of the list items of embodiments of this disclosure.

[0116] The electronic device provided in this embodiment and the rendering method of list items provided in the above embodiments belong to the same disclosed concept. Technical details not described in detail in this embodiment can be found in the above embodiments, and this embodiment has the same beneficial effects as the above embodiments.

[0117] This disclosure provides a storage medium for computer-executable instructions, which, when executed by a computer processor, can be used to perform the list item rendering method provided in the above embodiments.

[0118] It should be noted that the storage medium described in this disclosure can be a computer-readable signal medium or a computer-readable storage medium, or any combination thereof. A computer-readable storage medium can be, for example,—but not limited to—an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of a computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM) or flash memory (FLASH), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination thereof. In this disclosure, a computer-readable storage medium can be any tangible medium that contains or stores executable instructions that can be used by or in conjunction with an instruction execution system, apparatus, or device. In this disclosure, a computer-readable signal medium can include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable executable instructions. Such transmitted data signals can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. The computer-readable signal medium can also be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit executable instructions for use by or in connection with an instruction execution system, apparatus, or device. Executable instructions contained on the storage medium can be transmitted using any suitable medium, including but not limited to: wires, optical fibers, RF (radio frequency), etc., or any suitable combination thereof.

[0119] In some implementations, clients and servers can communicate using any currently known or future-developed network protocol such as HTTP (Hypertext Transfer Protocol) and can interconnect with digital data communication (e.g., communication networks) of any form or medium. Examples of communication networks include local area networks (“LANs”), wide area networks (“WANs”), the Internet (e.g., the Internet of Things), and end-to-end networks (e.g., ad hoc end-to-end networks), as well as any currently known or future-developed networks.

[0120] The aforementioned storage medium may be included in the aforementioned electronic device; or it may exist independently and not be assembled into the electronic device.

[0121] The aforementioned storage medium carries one or more executable instructions, which, when executed by the electronic device, cause the electronic device to:

[0122] Load the general layout, which contains pre-defined placeholder components; load the element components of the target list item; and replace at least some of the placeholder components with the element components to render the target list item.

[0123] Executable instructions for performing the operations of this disclosure can be written in one or more programming languages ​​or a combination thereof, including but not limited to object-oriented programming languages ​​such as Java, Smalltalk, and C++, as well as conventional procedural programming languages ​​such as the "C" language or similar programming languages. The executable instructions can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0124] This disclosure also provides a computer program product, including a computer program that, when executed by a processor, can implement the list item rendering method provided in any embodiment of this disclosure.

[0125] In implementing a computer program product, computer program code for performing the operations of this disclosure can be written in one or more programming languages ​​or a combination thereof. Programming languages ​​include object-oriented programming languages ​​such as Java, Smalltalk, and C++, as well as conventional procedural programming languages ​​such as C or similar languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0126] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this disclosure. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions indicated in the blocks may occur in a different order than those indicated in the drawings. For example, two consecutively indicated blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or operation, or using a combination of dedicated hardware and computer instructions.

[0127] The units described in the embodiments of this disclosure can be implemented in software or hardware. The names of the units and modules do not, in certain circumstances, constitute a limitation on the unit or module itself.

[0128] The functions described above in this document can be performed, at least in part, by one or more hardware logic components. For example, exemplary types of hardware logic components that can be used, without limitation, include: Field Programmable Gate Array (FPGA), Application Specific Integrated Circuit (ASIC), Application Specific Standard Parts (ASSP), System on Chip (SOC), Complex Programmable Logic Device (CPLD), and so on.

[0129] In the context of this disclosure, a machine-readable medium can be a tangible medium that may contain or store a program for use by or in conjunction with an instruction execution system, apparatus, or device. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can be, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. More specific examples of machine-readable storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.

[0130] According to one or more embodiments of this disclosure, a method for rendering list items is provided, the method comprising:

[0131] Load a general layout; wherein, the general layout has a pre-set placeholder component;

[0132] Load the element components of the target list item;

[0133] The element component is used to replace at least a portion of the placeholder component in order to render the target list item.

[0134] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0135] In some alternative implementations, loading the element components of the target list item includes:

[0136] The element components of the target list item are loaded via a sub-thread;

[0137] The replacement of at least a portion of the placeholder components using the element components includes:

[0138] The main thread uses the element components to replace at least some of the placeholder components.

[0139] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0140] In some alternative implementations, in response to an update of the target list item, the element components of the target element are loaded via a sub-thread corresponding to the updated target element.

[0141] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0142] In some alternative implementations, loading the element components of the target list item includes:

[0143] Determine the data model of the at least one element based on the data source of the at least one element in the target list item;

[0144] Create at least one element view holder; wherein the at least one element view holder references a view of each of the at least one element;

[0145] Bind at least one of the data models to the at least one element view holder to load the element components corresponding to the at least one element.

[0146] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0147] In some alternative implementations, replacing at least a portion of the placeholder components using the element components includes:

[0148] Based on the target category of the element component and the correspondence between the placeholder component and the component category, determine the target placeholder component that corresponds to the target category from the placeholder components;

[0149] Remove the target placeholder component and add the element component corresponding to the target placeholder component.

[0150] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0151] In some optional implementations, the target category includes a content category; adding the element component corresponding to the target placeholder component includes:

[0152] Set the size and layout parameters for the first element component belonging to the content class;

[0153] Add the first element component according to the set size and layout parameters.

[0154] According to one or more embodiments of this disclosure, a method for rendering list items is provided, further comprising:

[0155] In some optional implementations, the target category includes business categories; adding the element component corresponding to the target placeholder component includes:

[0156] Based on the size and layout parameters of the target placeholder component, the second element component belonging to the business category is added.

[0157] According to one or more embodiments of the present disclosure, a list item rendering apparatus is provided, the apparatus comprising:

[0158] The first loading module is used to load a general layout; wherein, the general layout has a pre-set placeholder component;

[0159] The second loading module is used to load the element components of the target list item;

[0160] A rendering module is used to replace at least a portion of the placeholder components with the element components in order to render the target list items.

[0161] The above description is merely a preferred embodiment of this disclosure and an explanation of the technical principles employed. Those skilled in the art should understand that the scope of this disclosure is not limited to technical solutions formed by specific combinations of the above-described technical features, but should also cover other technical solutions formed by arbitrary combinations of the above-described technical features or their equivalents without departing from the above-described concept. For example, technical solutions formed by substituting the above features with (but not limited to) technical features disclosed in this disclosure that have similar functions.

[0162] Furthermore, while the operations are described in a specific order, this should not be construed as requiring these operations to be performed in the specific order shown or in a sequential order. In certain environments, multitasking and parallel processing may be advantageous. Similarly, while several specific implementation details are included in the above discussion, these should not be construed as limiting the scope of this disclosure. Certain features described in the context of individual embodiments may also be implemented in combination in a single embodiment. Conversely, various features described in the context of a single embodiment may also be implemented individually or in any suitable sub-combination in multiple embodiments.

[0163] Although the subject matter has been described using language specific to structural features and / or methodological logic, it should be understood that the subject matter defined in the appended claims is not necessarily limited to the specific features or actions described above. Rather, the specific features and actions described above are merely illustrative examples of implementing the claims.

Claims

1. A method for rendering list items, characterized in that, include: Load a general layout; wherein, the general layout has a pre-set placeholder component; Load the element components of the target list item; The element component is used to replace at least a portion of the placeholder component in order to render the target list item.

2. The method according to claim 1, characterized in that, The loading of element components for the target list item includes: The element components of the target list item are loaded via a sub-thread; The replacement of at least a portion of the placeholder components using the element components includes: The main thread uses the element components to replace at least some of the placeholder components.

3. The method according to claim 2, characterized in that, Also includes: In response to an update of the target list item, the element components of the target element are loaded via a sub-thread corresponding to the updated target element.

4. The method according to claim 1, characterized in that, The loading of element components for the target list item includes: Determine the data model of the at least one element based on the data source of the at least one element in the target list item; Create at least one element view holder; wherein the at least one element view holder references a view of each of the at least one element; Bind at least one of the data models to the at least one element view holder to load the element components corresponding to the at least one element.

5. The method according to claim 1, characterized in that, The replacement of at least a portion of the placeholder components using the element components includes: Based on the target category of the element component and the correspondence between the placeholder component and the component category, determine the target placeholder component that corresponds to the target category from the placeholder components; Remove the target placeholder component and add the element component corresponding to the target placeholder component.

6. The method according to claim 5, characterized in that, The target category includes content categories; adding the element component corresponding to the target placeholder component includes: Set the size and layout parameters for the first element component belonging to the content class; Add the first element component according to the set size and layout parameters.

7. The method according to claim 5, characterized in that, The target category includes business categories; adding the element component corresponding to the target placeholder component includes: Based on the size and layout parameters of the target placeholder component, the second element component belonging to the business category is added.

8. A rendering apparatus for list items, characterized in that, include: The first loading module is used to load a general layout; wherein, the general layout has a pre-set placeholder component; The second loading module is used to load the element components of the target list item; A rendering module is used to replace at least a portion of the placeholder components with the element components in order to render the target list items.

9. An electronic device, characterized in that, The electronic device includes: One or more processors; Storage device for storing one or more programs. When the one or more programs are executed by the one or more processors, the one or more processors implement the method for rendering list items as described in any one of claims 1-7.

10. A storage medium containing computer-executable instructions, which, when executed by a computer processor, are used to perform a method for rendering list items as described in any one of claims 1-7.

11. A computer program product, characterized in that, The computer program product includes a computer program that, when executed by a processor, implements the method for rendering list items as described in any one of claims 1-7.

Images