A display rendering method, apparatus, electronic device and readable storage medium

Abstract

The present disclosure provides a display rendering method, device, electronic equipment and readable storage medium. The display rendering method is applied to an electronic equipment, and the method comprises the following steps: in the case that canvas data changes, determining a target element located in a visible area; in a redraw thread, generating a redraw canvas and drawing the target element on the redraw canvas; in an interface rendering thread, superimposing and drawing the redraw canvas to an interface rendering canvas, and refreshing a display interface according to the interface rendering canvas.

Description

Technical Field

[0001] This disclosure relates to the field of computers, and more particularly to a display rendering method, apparatus, electronic device, and readable storage medium. Background Technology

[0002] When updating the display interface of an electronic device, it is usually based on redrawing and refreshing the display interface on the canvas. However, the content displayed by the electronic device may include more complex objects, such as complex images or handwriting. Redrawing these complex objects takes a long time. This means that updating the display interface of large-size or high-resolution electronic devices takes a long time, which may cause the display interface to flicker or lag, affecting the display effect. Summary of the Invention

[0003] In some aspects, embodiments of this disclosure provide a display rendering method applied to an electronic device, the method comprising the following steps:

[0004] Identify target elements within the visible area when canvas data changes;

[0005] In the redraw thread, a redraw canvas is generated, and the target element is drawn on the redraw canvas;

[0006] In the interface rendering thread, the redrawn canvas is overlaid onto the interface rendering canvas, and the display interface is refreshed based on the interface rendering canvas.

[0007] In some embodiments, generating a redrawn canvas and drawing the target element on the redrawn canvas includes:

[0008] Multiple redrawing sub-threads are established, and redrawing sub-canvases are generated in the redrawing sub-threads, wherein the redrawing sub-threads and the redrawing sub-canvases correspond one-to-one;

[0009] The target element is divided into the redraw sub-canvas, and the target element corresponding to each redraw sub-canvas is drawn onto the corresponding redraw sub-canvas.

[0010] The multiple redrawn sub-canvases are superimposed onto the redrawn canvas.

[0011] In some embodiments, the plurality of redraw sub-threads are parallel.

[0012] In some embodiments, the number of redrawn sub-canvases is determined based on the computing power of the electronic device.

[0013] In some embodiments, the redraw thread and the interface rendering thread are serial.

[0014] In some embodiments, generating a redrawn canvas and drawing the target element on the redrawn canvas further includes:

[0015] Detect the number of the target elements;

[0016] If the number of target elements is greater than a preset threshold, then the step of creating multiple redrawing sub-threads is executed;

[0017] If the number of target elements is not greater than the preset number threshold, then the target elements are drawn on the redrawing canvas.

[0018] In some embodiments, the visible area is the area corresponding to the canvas and the display interface of the electronic device, and the target element is the element in the canvas data located in the visible area.

[0019] In some embodiments, the target element includes an element corresponding to the handwriting of a writing operation on the electronic device.

[0020] In some embodiments, the electronic device is a smart interactive flat panel.

[0021] In some aspects, embodiments of this disclosure provide a display rendering apparatus for use in an electronic device, comprising:

[0022] The target element acquisition module is used to determine the target element located within the visible area when the canvas data changes;

[0023] A redrawing canvas generation module is used to generate a redrawing canvas and draw the target element on the redrawing canvas;

[0024] The interface refresh module is used to overlay the redrawn canvas onto the interface rendering canvas in the interface rendering thread, and refresh the display interface according to the interface rendering canvas.

[0025] In some aspects, embodiments of this disclosure provide an electronic device, including: a memory, a processor, and a program stored in the memory and executable on the processor;

[0026] The processor is configured to read a program from memory to implement the steps of the display rendering method as described in any one of the first aspects.

[0027] In some aspects, embodiments of this disclosure provide a readable storage medium for storing a program that, when executed by a processor, implements the steps of the display rendering method as described in any of the first aspects. Attached Figure Description

[0028] To more clearly illustrate the technical solutions of the embodiments of this disclosure, the accompanying drawings used in the description of the embodiments of this disclosure will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of this disclosure. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0029] Figure 1 This is a flowchart of a display rendering method according to an embodiment of the present disclosure;

[0030] Figure 2 This is another flowchart of a display rendering method according to an embodiment of the present disclosure;

[0031] Figure 3 This is a structural diagram of a rendering apparatus according to an embodiment of the present disclosure;

[0032] Figure 4 This is a structural diagram of an electronic device according to an embodiment of the present disclosure. Detailed Implementation

[0033] The technical solutions of the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of this disclosure. Unless otherwise specified, the following embodiments and features can be combined with each other. Based on the embodiments of this disclosure, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this disclosure.

[0034] This disclosure provides a display rendering method.

[0035] This display rendering method is applied to electronic devices, in some embodiments of which are specifically smart interactive flat panels. These smart interactive flat panels typically have large display panels and high resolutions, such as 2K or 4K or even higher. The smart interactive flat panel can run on an operating system such as Android.

[0036] It's important to understand that some operating systems, when updating the display interface, first need to clear the existing content and then draw new content on the canvas. The content to be drawn can be understood as being composed of various elements such as points, lines, and arcs. If the content to be drawn is complex, it will increase the drawing time, which may cause stuttering, flickering, or other issues during the screen update process, affecting the display effect.

[0037] It should be understood that the technical solution of this embodiment can also be applied to electronic devices with other operating systems, as long as the screen update in the operating system is based on the above principle.

[0038] In some embodiments, the display rendering method includes the following steps:

[0039] Step 101: If the canvas data changes, identify the target element located within the visible area.

[0040] In the technical solution of this embodiment, the display interface is updated when the canvas data changes.

[0041] When updating the display screen, the visible area is first determined. In this embodiment, the visible area can be understood as the area corresponding to the current display screen, that is, the area corresponding to the canvas and the display interface of the electronic device.

[0042] For example, in the handwriting interface of an electronic device, in one view, the size of the handwriting interface is equal to the display interface of the electronic device, and the entire handwriting interface is displayed on the display interface. At this time, the entire handwriting interface is the visible area. When the handwriting interface is zoomed in, the display interface only shows a portion of the handwriting interface. At this time, the area displayed on the electronic device is the visible area, and the canvas data corresponding to this area is the target element located in the visible area.

[0043] It is important to understand that if the display shows the entire area corresponding to the canvas, then the visible area corresponds to the entire canvas. In some cases, the display shows only a part of the canvas. For example, when a user zooms in to observe a certain area, the screen displayed by the electronic device is only a part of the canvas.

[0044] During implementation, the boundaries of the visible area can be determined based on the current display interface, and further, the elements within the boundaries of the visible area can be identified as target elements.

[0045] Step 102: In the redraw thread, generate a redraw canvas and draw the target element on the redraw canvas.

[0046] In this embodiment, a redraw thread is established, in which a redrawing canvas is provided, and the target elements to be drawn are drawn onto the redrawing canvas.

[0047] In some embodiments, step 102 includes:

[0048] Detect the number of the target elements;

[0049] If the number of target elements is greater than a preset threshold, then the step of creating multiple redrawing sub-threads is executed;

[0050] If the number of target elements is not greater than the preset number threshold, then the target elements are drawn on the redrawing canvas.

[0051] In the technical solution of this embodiment, the preset quantity threshold is determined based on the hardware and software performance of the electronic device. It should be understood that electronic devices with different hardware and software can provide different computing capabilities. If the computing capability provided is relatively high, the number of elements that can be drawn in a unit of time of a redraw thread will be more. Correspondingly, if the computing capability provided is relatively low, the number of elements that can be drawn in a unit of time of a redraw thread will be less.

[0052] If the total number of target elements is relatively small, for example, less than or close to the number of elements that a redraw thread can draw per unit time, then the target elements can be drawn directly on the redraw canvas in the redraw thread.

[0053] In this embodiment, a preset quantity threshold can be determined based on the computing power provided by the electronic device. For example, the preset quantity threshold can be set to a value that is equal to or slightly lower than the number of elements that can be drawn per unit time of a redraw thread.

[0054] If the number of target elements is not greater than the preset threshold, the target elements can be drawn directly on the redraw canvas.

[0055] If the number of target elements is relatively large, for example, greater than the preset threshold, multiple redraw threads are created to improve the drawing speed of the target elements.

[0056] Specifically, if the number of target elements exceeds the preset threshold, the following steps are executed:

[0057] Multiple redrawing sub-threads are established, and redrawing sub-canvases are generated within each of the redrawing sub-threads, wherein each redrawing sub-thread and each redrawing sub-canvas corresponds one-to-one.

[0058] The target element is divided into the redraw sub-canvas, and the target element corresponding to each redraw sub-canvas is drawn onto the corresponding redraw sub-canvas.

[0059] The multiple redrawn sub-canvases are superimposed onto the redrawn canvas.

[0060] In this embodiment, multiple redrawing sub-threads are established within the redrawing thread, with each sub-thread corresponding to a redrawing sub-canvas. In other words, there is a one-to-one correspondence between the redrawing sub-canvases and the redrawing sub-threads. By establishing multiple redrawing sub-threads, the corresponding target elements are drawn in parallel on multiple redrawing sub-canvases. That is, the drawing threads for the target elements on multiple redrawing canvases are performed in parallel, thereby improving the drawing speed of the target elements.

[0061] Parallelism, also known as parallel communication, refers to a communication method in which multiple data streams are transmitted simultaneously. In this embodiment, it can be understood as multiple redrawing sub-threads operating concurrently.

[0062] After the target elements are drawn on each redraw sub-canvas, all the redraw sub-canvases are superimposed to obtain the redraw canvas. In this way, the obtained redraw canvas includes all the target elements. At the same time, since each redraw sub-thread is parallel, the drawing time of the target elements can be effectively saved.

[0063] In some embodiments, the number of redrawn canvases is determined based on the computing power of the electronic device. Specifically, based on the unused remaining computing power of the electronic device, a certain number of redrawing sub-threads are established, and the computing power occupied by the established redrawing sub-threads is no greater than the remaining computing power.

[0064] In some embodiments, in order to avoid affecting threads that may need to be created, the computing power occupied by the created redrawing sub-thread is no more than 30% of the remaining computing power. Obviously, this value can be set to different values ​​such as 10%, 20%, and 25% as needed.

[0065] In this way, the technical solution of this embodiment can make full use of the computing power of electronic devices, while avoiding occupying the computing power required by other threads and avoiding affecting other threads.

[0066] The example illustrates the setup of three redrawing sub-threads and their corresponding three redrawing sub-canvases.

[0067] In practice, all elements in the canvas data can be distributed equally or approximately equally among the three redrawing sub-threads. Here, all elements include elements located in the visible area and elements located outside the visible area. In some embodiments, in order to balance the processing time of each redrawing sub-thread, the number of target elements allocated to each redrawing sub-thread is also equal or substantially equal.

[0068] In other embodiments, the target elements may be distributed evenly or approximately evenly to each redraw sub-thread, and elements in non-visible areas may not be processed since they do not need to be displayed.

[0069] For each element corresponding to a redrawing sub-thread, iterate through them sequentially.

[0070] If the assigned element is all elements, then during the traversal, it is necessary to confirm whether the corresponding element is the target element and ensure that the target element has been drawn on the corresponding redraw sub-canvas. If the assigned element is the target element, then during the traversal, it is necessary to ensure that the target element has been drawn on the corresponding redraw sub-canvas.

[0071] After traversing the elements corresponding to a redraw child thread, it can be ensured that all target elements corresponding to that redraw child thread have been drawn on the redraw child canvas corresponding to that redraw child thread.

[0072] Following the steps above, each redrawing sub-thread traverses the corresponding elements in parallel and completes the drawing of the target elements on each redrawing sub-canvas. Furthermore, by overlaying each redrawing sub-canvas onto the redrawing canvas, a redrawing canvas containing all the target elements can be obtained.

[0073] Step 103: In the interface rendering thread, the redrawn canvas is overlaid onto the interface rendering canvas, and the display interface is refreshed according to the interface rendering canvas.

[0074] It is important to understand that in these technologies, the data required by the UI rendering thread is processed within the UI rendering thread. This can be understood as the UI rendering thread drawing the target element onto the canvas to update the displayed image. This will increase the load on the UI rendering thread and increase the processing time.

[0075] In the technical solution of this embodiment, a redraw thread is further set up to complete the drawing of the target element on the canvas. Specifically, the target element is drawn onto the redraw canvas in the redraw thread. Then, the interface rendering thread can directly call the redraw canvas with the target element drawn provided by the redraw thread.

[0076] In some embodiments, the redraw thread and the UI rendering thread are serial.

[0077] Serial communication, also known as serial data transmission, refers to a communication method that transmits one bit of data at a time on a data channel and continuously performs the above single process. In other words, the redraw thread and the interface rendering thread operate sequentially. After the redraw thread finishes, it outputs the redrawn canvas it has processed to the interface rendering thread for the interface rendering thread to perform interface update operations.

[0078] Specifically, a rendering canvas can be provided through the UI (User Interface), and then the redrawn canvas can be overlaid onto the rendering canvas. In the UI update thread, only one drawing action is needed to update the content on the rendering canvas.

[0079] like Figure 2 As shown, the technical solution of this embodiment can be summarized as follows:

[0080] If the canvas data changes and a redraw is required, the redraw thread will be activated.

[0081] In the redraw thread, the boundaries of the visible area are first obtained, and the target element located within the visible area is determined.

[0082] The method detects whether the number of target elements is greater than a preset threshold. In this embodiment, the preset threshold of 100 is used as an example.

[0083] If the number of target elements is no more than 100, the redrawn canvas is drawn directly in the redraw thread.

[0084] If the number of target elements is greater than 100, multiple redraw sub-threads are created, and the target elements are assigned to multiple redraw sub-threads for drawing.

[0085] During the drawing process of the target element in each of the above redrawing sub-threads, the elements corresponding to each redrawing sub-thread are traversed. If the traversed element is the target element, then the target element is further drawn onto the redrawing sub-canvas. Finally, the redrawing sub-canvases corresponding to multiple redrawing threads are superimposed to obtain the redrawing canvas.

[0086] The UI rendering thread calls the redraw canvas generated by the redraw thread. The UI rendering thread notifies the UI to update the displayed interface. After entering the UI rendering thread, the UI overlays the redraw onto the UI rendering canvas, thus completing the redraw rendering process.

[0087] This disclosure provides a display rendering apparatus for use in electronic devices.

[0088] like Figure 3 As shown, in one embodiment, the display rendering apparatus 300 includes:

[0089] The target element acquisition module 301 is used to determine the target element 302 located within the visible area when the canvas data changes.

[0090] A redrawing canvas generation module is used to generate a redrawing canvas and draw the target element on the redrawing canvas;

[0091] The interface refresh module 303 is used to overlay the redrawing canvas onto the interface rendering canvas in the interface rendering thread, and refresh the display interface according to the interface rendering canvas.

[0092] In some embodiments, the redrawing canvas generation module 302 includes:

[0093] A submodule is established to create multiple redrawing sub-threads and generate redrawing sub-canvases in the redrawing sub-threads, wherein the redrawing sub-threads and the redrawing sub-canvases correspond one-to-one;

[0094] The partitioning submodule is used to partition the target element into the redrawing sub-canvas and draw the target element corresponding to each redrawing sub-canvas onto the corresponding redrawing sub-canvas.

[0095] The overlay submodule is used to overlay the multiple redrawing sub-canvases onto the redrawing canvas.

[0096] In some embodiments, the plurality of redraw sub-threads are parallel.

[0097] In some embodiments, the number of redrawn sub-canvases is determined based on the computing power of the electronic device.

[0098] In some embodiments, the redraw thread and the interface rendering thread are serial.

[0099] In some embodiments, the redrawing canvas generation module 302 includes:

[0100] The detection submodule is used to detect the number of the target elements;

[0101] The drawing submodule is specifically used to perform the step of dividing the canvas data into multiple redrawing canvases if the number of the target elements is greater than a preset number threshold.

[0102] The drawing submodule is further configured to draw the target element on the redrawing canvas if the number of the target element is not greater than the preset number threshold.

[0103] In some embodiments, the visible area is the area corresponding to the canvas and the display interface of the electronic device, and the target element is the element in the canvas data located in the visible area.

[0104] In some embodiments, the target element includes an element corresponding to the handwriting of a writing operation on the electronic device.

[0105] In some embodiments, the electronic device is a smart interactive flat panel.

[0106] This invention also provides an electronic device. Please refer to [link to relevant documentation]. Figure 4 The electronic device may include a processor 401, a memory 402, and a program 4021 stored in the memory 402 and executable on the processor 401. When the program 4021 is executed by the processor 401, it can achieve... Figure 1 Any steps in the corresponding method embodiments and the achievement of the same beneficial effects will not be repeated here.

[0107] Those skilled in the art will understand that all or part of the steps of the methods described in the above embodiments can be implemented by hardware related to program instructions, and the program can be stored in a readable medium.

[0108] This invention also provides a readable storage medium storing a computer program, which, when executed by a processor, can perform the above-described functions. Figure 1 Any step in the corresponding method embodiment can achieve the same technical effect, and will not be repeated here to avoid repetition.

[0109] The storage medium may be a read-only memory (ROM), a random access memory (RAM), a magnetic disk, or an optical disk.

[0110] It should be noted that the above division of modules is merely a logical functional division. In actual implementation, they can be fully or partially integrated into a single physical entity, or they can be physically separated. Furthermore, these modules can be implemented entirely in software via processing element calls; they can be fully implemented in hardware; or some modules can be implemented by processing element calls to software, while others are implemented in hardware. For example, a determination module can be a separate processing element, or it can be integrated into a chip in the aforementioned device. Alternatively, it can be stored as program code in the memory of the aforementioned device, and its function can be called and executed by a processing element of the device. The implementation of other modules is similar. Moreover, these modules can be fully or partially integrated together, or they can be implemented independently. The processing element mentioned here can be an integrated circuit with signal processing capabilities. In the implementation process, each step of the above method or each of the above modules can be completed through integrated logic circuits in the hardware of the processor element or through software instructions.

[0111] For example, each module, unit, subunit, or submodule can be one or more integrated circuits configured to implement the above methods, such as one or more application-specific integrated circuits (ASICs), one or more digital signal processors (DSPs), or one or more field-programmable gate arrays (FPGAs). As another example, when a module is implemented using processing element scheduler code, the processing element can be a general-purpose processor, such as a central processing unit (CPU) or other processor capable of calling program code. Furthermore, these modules can be integrated together as a system-on-a-chip (SOC).

[0112] The above description represents the preferred embodiments of the present invention. It should be noted that those skilled in the art can make various improvements and modifications without departing from the principles of the present invention, and these improvements and modifications should also be considered within the scope of protection of the present invention.

Claims

1. A display rendering method applied to an electronic device, the method comprising the steps of: determining target elements located in a visible area in a case where canvas data changes; generating a redrawn canvas and drawing the target elements on the redrawn canvas in a redraw thread; superimposing the redrawn canvas to an interface rendering canvas and refreshing a display interface according to the interface rendering canvas in an interface rendering thread; wherein the generating the redrawn canvas and drawing the target elements on the redrawn canvas comprises: establishing a plurality of redraw sub-threads and generating redrawn sub-canvas in the redraw sub-threads, wherein the redraw sub-threads and the redrawn sub-canvas correspond to each other; dividing the target elements to the redrawn sub-canvas and drawing the target elements corresponding to each of the redrawn sub-canvas to the corresponding redrawn sub-canvas; superimposing the plurality of redrawn sub-canvas to the redrawn canvas.

2. The method of claim 1, wherein, The plurality of redraw sub-threads are parallel.

3. The method of claim 1, wherein, The number of the redrawn sub-canvas is determined according to the computing capability of the electronic device.

4. The method of claim 1, wherein, The redraw thread and the interface rendering thread are serial.

5. The method of any one of claims 1 to 4, wherein, The generating the redrawn canvas and drawing the target elements on the redrawn canvas further comprises: detecting the number of the target elements; if the number of the target elements is greater than a preset number threshold, performing the step of establishing the plurality of redraw sub-threads; if the number of the target elements is not greater than the preset number threshold, drawing the target elements on the redrawn canvas.

6. The method of any one of claims 1 to 4, wherein, The visible area is an area corresponding to a display interface of the electronic device, and the target elements are elements located in the visible area in the canvas data.

7. The method of any one of claims 6, wherein, The target elements include elements corresponding to handwriting corresponding to a writing operation on the electronic device.

8. The method of any one of claims 1 to 4, wherein, The electronic device is a smart interactive tablet. 9.A display rendering device applied to an electronic device, comprising: a target element acquisition module configured to determine target elements located in a visible area in a case where canvas data changes; a redrawn canvas generation module configured to generate a redrawn canvas and draw the target elements on the redrawn canvas; an interface refreshing module configured to superimpose the redrawn canvas to an interface rendering canvas and refresh a display interface according to the interface rendering canvas in an interface rendering thread; wherein the generating the redrawn canvas and drawing the target elements on the redrawn canvas comprises: establishing a plurality of redraw sub-threads and generating redrawn sub-canvas in the redraw sub-threads, wherein the redraw sub-threads and the redrawn sub-canvas correspond to each other; dividing the target elements to the redrawn sub-canvas and drawing the target elements corresponding to each of the redrawn sub-canvas to the corresponding redrawn sub-canvas; superimposing the plurality of redrawn sub-canvas to the redrawn canvas.

10. An electronic device comprising: a memory, a processor, and a program stored in the memory and executable on the processor; the processor is configured to read the program in the memory to implement the steps in the display rendering method according to any one of claims 1 to 8.

11. A readable storage medium for storing a program, which, when executed by a processor, implements the steps in the display rendering method according to any one of claims 1 to 8.

Images