Display method, electronic equipment and storage medium

Abstract

The invention provides a display method, electronic equipment and a storage medium, and relates to the technical field of rendering, the method comprises the following steps: calling a holder of a drawing surface to obtain a locked canvas object, responding to switching of the electronic equipment from a first state to a second state, obtaining stroke parameters of one or more characters displayed in the first state, and displaying the stroke parameters of the one or more characters in the second state; the first state is a screen-off state; creating a plurality of stroke layers corresponding to the stroke parameters based on the locked canvas object, wherein the plurality of stroke layers are located at different view levels; drawing strokes on the corresponding stroke layers by using the stroke parameters; and in the process of switching the electronic equipment from the first state to the second state, displaying the process of adjusting the plurality of strokes of the drawn one or more characters on wallpaper of the electronic equipment. According to the method, rendering can be performed safely and efficiently, the rendering time sequence is shortened, and the rendering performance is improved; the strokes of one or more characters are dynamically displayed on the wallpaper, and the interaction experience between a user and the electronic equipment is improved.

Description

Technical Field

[0001] The present application relates to the field of rendering technology, and in particular to a display method, an electronic device and a storage medium. Background Art

[0002] In existing text wallpaper rendering and display solutions, the rendering of each frame is usually achieved based on reflection technology. Reflection is a technology that dynamically accesses and modifies classes, methods, fields, etc. at runtime. In Android (an open source mobile operating system), reflection can be used to access some APIs (Application Programming Interface) or internal implementations that are not originally open to the public. It is unsafe to access internal classes or methods of the system (such as SurfaceControl, a class in the Android system for managing and operating display surfaces) through reflection because these APIs are not designed for use by third-party applications. They may not have been fully tested for stability and security, and using these APIs may cause application crashes or other unforeseen problems. Summary of the invention

[0003] In a first aspect, an embodiment of the present application provides a display method, comprising: calling a holder of a drawing surface to obtain a locked canvas object, wherein the holder of the drawing surface is obtained by passing when creating a wallpaper engine; in response to the electronic device switching from a first state to a second state, obtaining stroke parameters of one or more texts displayed in the first state, wherein the first state is a screen-off state; creating multiple stroke layers corresponding to the stroke parameters based on the locked canvas object, wherein the multiple stroke layers are located at different view levels; drawing strokes in corresponding stroke layers using the stroke parameters; and during the process of the electronic device switching from the first state to the second state, displaying a process of adjusting the multiple strokes of the one or more texts that have been drawn on the wallpaper of the electronic device.

[0004] In a second aspect, an embodiment of the present application provides an electronic device, including a memory, a processor, and a computer program stored in the memory, wherein the processor implements any of the methods described above when executing the computer program.

[0005] In a third aspect, an embodiment of the present application provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, any of the methods described above is implemented.

[0006] The above description is only an overview of the technical solution of the present application. In order to more clearly understand the technical means of the present application, it can be implemented in accordance with the contents of the specification. In order to make the above and other purposes, features and advantages of the present application more obvious and easy to understand, the specific implementation methods of the present application are listed below. BRIEF DESCRIPTION OF THE DRAWINGS

[0007] In the accompanying drawings, unless otherwise specified, the same reference numerals throughout the multiple drawings represent the same or similar parts or elements. These drawings are not necessarily drawn to scale. It should be understood that these drawings only depict some embodiments according to the present application and should not be regarded as limiting the scope of the present application.

[0008] Figure 1 A flow chart of a display method provided in an embodiment of the present application is shown;

[0009] Figure 2 A schematic diagram of a layer provided in an embodiment of the present application is shown;

[0010] Figure 3 A schematic diagram of a vector relationship for calculating an offset from a stroke center to the upper left corner of a text canvas provided in an embodiment of the present application is shown;

[0011] Figure 4 A schematic diagram showing a possible division of regions within and outside a window of an electronic device provided in an embodiment of the present application is shown;

[0012] Figure 5 A schematic diagram of a method for confirming a central trajectory point path provided in an embodiment of the present application is shown;

[0013] Figure 6 A schematic diagram of a stroke head and tail leakage effect provided in an embodiment of the present application is shown;

[0014] Figure 7 A schematic diagram of the normal effect of the beginning and end of a stroke provided in an embodiment of the present application is shown;

[0015] Figure 8 A schematic diagram of a copying effect provided in an embodiment of the present application is shown;

[0016] Fig. 9 A schematic diagram of a screen-off state effect provided in an embodiment of the present application is shown;

[0017] Fig.10 A schematic diagram of a lock screen state effect provided in an embodiment of the present application is shown;

[0018] Fig.11 A schematic diagram of a desktop status effect provided in an embodiment of the present application is shown;

[0019] Fig.12 A schematic diagram showing the implementation steps of a display method provided in an embodiment of the present application is shown;

[0020] Fig.13 A block diagram of an electronic device used to implement an embodiment of the present application is shown. DETAILED DESCRIPTION

[0021] In the following, only some exemplary embodiments are briefly described. As those skilled in the art will appreciate, the described embodiments may be modified in various ways without departing from the concept or scope of the present application. Therefore, the drawings and descriptions are considered to be exemplary in nature and not restrictive.

[0022] To facilitate understanding of the technical solutions of the embodiments of the present application, the following describes the related technologies of the embodiments of the present application. The following related technologies can be combined with the technical solutions of the embodiments of the present application as optional solutions, and they all belong to the protection scope of the embodiments of the present application.

[0023] The existing wallpaper rendering solution is implemented based on the following steps:

[0024] Get SurfaceControl through reflection: Use reflection mechanism to access SurfaceControl class;

[0025] Create ViewRootImpl: Instantiate the ViewRootImpl object, which is a core class for managing the view hierarchy;

[0026] Set DecorView (the top view of the window in Android) and ContentView (the view used to represent the main content area of ​​the application window in Android): Create DecorView and ContentView, and add the customized wallpaper view to ContentView;

[0027] Use Canvas (the core class for drawing graphic elements in Android) to render a custom view of the wallpaper: Use the Canvas object to perform drawing operations in the custom view.

[0028] Build the View Tree (a hierarchical structure consisting of a series of views and view groups): set DecorView to ViewRootImpl (a core class in the Android view system) by calling the setView method (a key method in the ViewRootImpl class) of ViewRootImpl, thereby building a complete view tree structure;

[0029] Render each frame: call the invalidate method of the custom view (a tool in the Android view system for requesting view redrawing) to trigger view redrawing to achieve dynamic rendering of wallpaper.

[0030] However, the Android system is constantly updated and patches vulnerabilities. If the code relies on internal APIs accessed through reflection, these APIs may be modified, deleted, or have access restrictions added in future system updates. Once Android patches these vulnerabilities or restricts access to these internal APIs, the code may become invalid, causing the application to not work properly. SurfaceControl is a low-level graphics control object, and it is necessary to be very cautious when operating it directly. If its life cycle is not managed correctly, it is easy to cause resources not to be released in time. In addition, memory leaks refer to certain objects in the program that are no longer used, but due to some reasons (such as incorrect reference management) are not reclaimed by the garbage collector, resulting in increasing memory usage. Holding SurfaceControl objects may cause this to happen, especially in complex view hierarchies.

[0031] Therefore, the above solution to obtain SurfaceControl by reflection is unsafe because it relies on Android's internal implementation and may be modified or restricted in future system updates. Holding SurfaceControl may cause memory leaks: because it is an underlying resource object, improper management may cause resources to not be released in time, leading to memory leaks.

[0032] In addition, the setView method of ViewRootImpl requires a system signature to be called, which means that only system applications can call it, so this method is not universal for ordinary applications. Building the View Tree structure is also a relatively complex process. The time sequence from calling the invalidate method of View to obtaining the Canvas is longer, which consumes more performance.

[0033] Based on this, the present application provides a display method, an electronic device and a storage medium. The method does not involve the technical processing steps of reflection, so it is more secure and avoids memory leaks. In the rendering process, it is not necessary to build a View Tree, avoiding a complex processing process, and the timing of getting the Canvas is very short, which saves performance.

[0034] The technical solution of the present application and how the technical solution of the present application solves the above-mentioned technical problems are described in detail below with specific embodiments. The several specific embodiments listed can be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments. The embodiments of the present application will be described in detail below with reference to the accompanying drawings.

[0035] The present application embodiment provides a display method. Figure 1 The flowchart of a display method according to an embodiment of the present application is shown, and the method may include:

[0036] Step S101, calling the holder of the drawing surface to obtain the locked canvas object, wherein the holder of the drawing surface is obtained by transmission when the wallpaper engine is created.

[0037] In the Android system, the holder of a drawing surface usually refers to an entity that owns and manages a Surface object. This entity can be an application, a window manager, or other system services. The holder of a drawing surface is responsible for creating, managing, and releasing the Surface, and usually uses the Surface to draw and display graphics content.

[0038] In an embodiment of the present application, the holder of the drawing surface is called to obtain the locked canvas object. For example, SurfaceHolder (an interface for managing and controlling Surface in Android, referred to as "holder of the drawing surface" in this application) can be used to obtain Surface, and SurfaceHolder is used to obtain the locked canvas object, namely Canvas. Among them, SurfaceHolder is an interface in Android that provides access to and control of Surface, Surface is a bottom-level graphics object that can interact directly with the screen, and Canvas is a class for drawing. The canvas object can be a canvas object rendered using software (for example, using two-dimensional software or three-dimensional software), or a canvas object rendered using hardware. It should be noted that being locked means that the newly created GraphicBuffer (a data structure used in Android for efficient management of graphics data) is locked, and this GraphicBuffer will be mapped into an engine bitmap object, and a corresponding engine canvas object will be generated and bound to the bitmap object. The engine canvas object will be packaged into an upper-layer canvas object and provided to the holder of the drawing surface. The graphics are rendered from the canvas to the drawing surface, which is actually rendered into the GraphicBuffer.

[0039] It should also be noted that the holder of the drawing surface is obtained by passing when the wallpaper engine is created. In the Android Wallpaper Engine, when the wallpaper engine is created, the system will call back the onCreated method, which is used to create the Surface object of the wallpaper before. When this method is called back, a SurfaceHolder object can be passed. This SurfaceHolder object allows operations on the wallpaper's drawing surface. SurfaceHolder can be an interface that provides methods for locking and unlocking Canvas, allowing drawing operations on the Surface. Canvas provides a wealth of drawing methods (such as drawing lines, rectangles, circles, text, etc.). Through SurfaceHolder, you can get the Canvas object and draw on it. lockHardwareCanvas is a method of SurfaceHolder that is used to lock the hardware-accelerated Canvas. When lockHardwareCanvas is called, it is actually requesting a hardware-accelerated canvas object so that drawing can be performed on this hardware-accelerated canvas object. This process is called "locking" the canvas because it ensures that the locked canvas object will not be modified by other threads during the drawing process. Hardware acceleration means that the canvas object will use the GPU or other dedicated rendering hardware to perform rendering tasks. In other examples, the lockCanvas method can also be used to get a locked canvas object that is software rendered or CPU rendered. Usually, its rendering speed is slower than that of hardware acceleration.

[0040] In one example, when the wallpaper engine of an electronic device is created, the system calls back the onCreated method and passes a SurfaceHolder object. This SurfaceHolder object can be saved for use in subsequent drawing operations. Lock the Canvas and draw: Use the SurfaceHolder.lockHardwareCanvas() method to lock the Canvas. This method returns a Canvas object for drawing on the Surface. Perform drawing operations on the obtained Canvas object. After drawing is completed, use the SurfaceHolder.unlockCanvasAndPost(Canvascanvas) method to unlock the Canvas and submit the drawing content.

[0041] In this step, the locked canvas object is obtained by calling the holder of the drawing surface, for example, by calling the lockHardwareCanvas method of SurfaceHolder to obtain the Canvas, which optimizes the process of obtaining the canvas object, shortens the time sequence for obtaining the canvas object, and saves performance.

[0042] Step S102, in response to the electronic device switching from a first state to a second state, obtaining stroke parameters of one or more characters displayed in the first state, wherein the first state is a screen-off state.

[0043] In the embodiment of the present application, the electronic device is equipped with a display module, and the types of electronic devices include but are not limited to: mobile phones, tablet computers, laptop computers, desktop computer monitors, televisions, game consoles, media players, smart watches, smart glasses, navigation devices, vehicle terminals, and e-book readers. The first state and the second state are different display states of the electronic device. Among them, the first state is the screen-off state (also known as all-weather display, AOD (Always On Display)). See Fig. 9 A schematic diagram of a screen-off state effect is shown. In the screen-off state, a display module of an electronic device, such as a display screen of a mobile phone, can display one or more words such as "Love without boundaries" in a working area on the display screen, and other areas on the display screen are non-working areas, that is, no content is displayed. The above-mentioned working area may refer to an area composed of light-emitting diodes (such as organic light-emitting diodes) to which a driving voltage is applied in the screen-off state, and the above-mentioned non-working area may refer to an area composed of light-emitting diodes to which no driving voltage is applied in the screen-off state. Continue to refer to the attached Fig. 9 As shown, another working area of ​​the display screen can also display switching buttons such as the screen off interface, the lock screen interface and the desktop interface. The above switching buttons can be displayed after the electronic device receives, for example, an instruction, and the display of another working area can be turned off if no switching instructions are received within a preset time.

[0044] It should be noted that the method described in this application is not limited to the text used in the exemplary description. Those skilled in the art can apply the method described in this application to other text wallpapers with strokes to form the technical effect described in this application without any creative work.

[0045] In response to the electronic device switching from a first state to a second state, the stroke parameters of one or more characters displayed in the first state are obtained. For example, when the characters are text, the stroke parameters can be obtained based on an open source text stroke decomposition library. The stroke parameters may include stroke SVG (Scalable Vector Graphics) vector data (strokes), stroke center trajectory point data (medians) and / or radical numbers (radStrokes). For example, hanzi-writer-date is an open source text stroke decomposition library that stores json data of text strokes in the data directory. The following is part of the json data of the word "hot": {"strokes":["M 388 581Q 401 587 418 591Q 449 601 454 606Q 461615 456 622Q 449632"],"medians":[[[195, 561],[236, 560],[400, 611],[446, 615]],[[338, 795],[373, 767]]],"radStrokes":[6, 7, 8, 9].} (for illustrative purposes only, and does not represent the json data of the entire word "hot").

[0046] The following is an explanation of part of the JSON data for the word "hot":

[0047] strokes: stroke svg vector data, it is a string array, each string in the array represents a stroke (such as: horizontal, vertical, dot, left-falling stroke, right-falling stroke, horizontal hook, vertical hook, horizontal fold hook, etc.), it is in svg vector format. This data is used to draw strokes, M means moving the stroke to the point, for example, moving to (388, 581), Q includes a format of four coordinates to draw a second-order Bezier curve through a control point, and Q includes a format of two coordinates to draw a line segment. medians: stroke center trajectory point data, it is a 3D array, medians[i][j][k] represents the x (or y) coordinate of the jth trajectory point in the ith stroke, k can only be 0 or 1, 0 represents the x coordinate, and 1 represents the y coordinate. This data can be used to copy strokes. radStrokes: The number of radicals. The coordinates of the upper left corner of the text are (0, 0), and the coordinates of the lower right corner are (wordSize, wordHeight). The width and height of the canvas of each word in hanzi-writer-date are 1024*1024.

[0048] Step S103: creating a plurality of stroke layers corresponding to the stroke parameters based on the locked canvas object, wherein the plurality of stroke layers are located at different view levels.

[0049] In an embodiment of the present application, a stroke layer is created for each stroke. When there are multiple strokes, the number of stroke layers is the same as the number of strokes, that is, multiple stroke layers corresponding to the stroke parameters are created based on the locked canvas object, and the multiple stroke layers are located at different view levels, wherein the view level is generally used to describe the hierarchical structure of user interface elements in an application.

[0050] Step S104: drawing the strokes in the corresponding stroke layer using the stroke parameters.

[0051] In the embodiment of the present application, the stroke is drawn in the stroke layer corresponding to the stroke, that is, the stroke is drawn in the corresponding stroke layer using the stroke parameters. For example, the strokes in the json data of the word "hot" mentioned above are used to draw the stroke.

[0052] It should be noted that, in the off screen state, when the translation parameters of each stroke in a character are (0, 0), the strokes will just form a character. Generally speaking, the center of each stroke in a character is not the center of the character, and there is usually some offset.

[0053] Step S105 , during the process of the electronic device switching from the first state to the second state, a process of adjusting the multiple strokes of the one or more characters that have been drawn is displayed on the wallpaper of the electronic device.

[0054] In an embodiment of the present application, after completing the drawing of the strokes in each stroke layer, when the electronic device starts to switch from a first state, i.e., the screen-off state, to a second state, i.e., the non-screen-off state, the process of adjusting the strokes of the text is displayed on the wallpaper of the electronic device to achieve the movement of the stroke positions, thereby obtaining a dynamic display effect of the strokes.

[0055] In one embodiment, the process of displaying and adjusting the strokes of text on the wallpaper of an electronic device can be achieved by adjusting multiple stroke layers. For example, each time the electronic device requests rendering, multiple stroke layers at the current position are synthesized in the drawing surface synthesizer and pushed into the frame buffer. When the next hardware refresh signal arrives, the synthesized frame at the front of the queue in the frame buffer is pushed to the screen for display, thereby displaying the process of multiple strokes moving on the electronic device.

[0056] In one embodiment, each time a new stroke is drawn, only the layer where the new stroke is located needs to be updated, and other layers remain unchanged. This can greatly improve rendering efficiency, avoid the need to re-render the entire canvas, and reduce performance issues and freezes.

[0057] According to an embodiment of the present application, the holder of the drawing surface is called to obtain the locked canvas object, so that rendering can be performed more safely and efficiently, the rendering timing is reduced, and the rendering performance is improved; in response to the state of the electronic device switching from a first state to a second state, a stroke layer is created, strokes are drawn, and the multiple strokes that have been adjusted are displayed on the wallpaper of the electronic device, thereby dynamically displaying and moving the strokes of one or more characters on the wallpaper, thereby improving the interactive experience between the user and the electronic device.

[0058] In a possible implementation manner, the second state is a lock screen state; and the process of displaying the multiple strokes of the one or more characters that have been drawn and adjusted on the wallpaper of the electronic device may be performed according to the following steps:

[0059] Obtaining a stroke screen-off position and a stroke screen-lock position, wherein the stroke screen-off position indicates the position of the stroke on the wallpaper of the electronic device in the screen-off state, and the stroke screen-lock position indicates the position of the stroke on the wallpaper of the electronic device and / or outside the electronic device in the screen-lock state;

[0060] Based on the switching duration from the screen-off state to the screen-locked state, the multiple strokes are moved from the stroke screen-off position to the stroke screen-locked position, wherein the multiple strokes are enlarged during the movement.

[0061] In this possible implementation, see Fig.10 A schematic diagram of a lock screen state effect is shown. In the lock screen state, a display module of an electronic device, such as a display screen of a mobile phone, displays multiple strokes in a scattered manner.

[0062] The second state is a lock screen state. In response to the electronic device switching from the first state to the second state, the multiple stroke layers drawn are adjusted. First, the stroke screen-off position and the stroke screen-lock position are obtained. The stroke screen-off position is the position of the stroke on the wallpaper of the electronic device and / or outside the electronic device in the screen-off state before the stroke moves, for example Fig. 9 Each character shown includes multiple strokes, each stroke in Fig. 9 The lock screen position of a stroke is the position of the stroke outside the wallpaper of the electronic device and / or the electronic device in the lock screen state after the stroke is moved. It can be understood that outside the electronic device refers to the area beyond the display screen of the electronic device. For example, a surface that exceeds the size of the display screen area can be set for the wallpaper. The middle area of ​​the surface is the same size as the wallpaper and the display screen and has a cache area corresponding to the display screen. The content of the surrounding area of ​​the surface will not be displayed on the display screen. For example Fig.10As shown, after the strokes of the text "Love without boundaries" are broken up, some strokes are still retained on the wallpaper in the lock screen state. These displayed strokes indicate the lock screen positions of some strokes, while the other part moves beyond the wallpaper range and is therefore not displayed on the wallpaper in the lock screen state. These undisplayed strokes indicate the lock screen positions of other strokes. From the display of the electronic device, another part of the strokes moves from the edge of the wallpaper to the periphery during the state switching process and is gradually hidden. Alternatively, another example can also pre-set the number of strokes that can be displayed on the wallpaper in the lock screen state. When the strokes of the broken text exceed this pre-set number, one or more strokes are selected from each text to meet the quantity requirement.

[0063] In another example, a surface equal to the size of the display area can be set for the wallpaper, and all strokes of the broken text can still be retained in the wallpaper display in the lock screen state. It can be understood that when all strokes need to be retained and displayed on the wallpaper, the size of the strokes can be smaller than the size when only some strokes are retained and displayed on the wallpaper.

[0064] In one example, an interpolator can be used to move the multiple strokes from the stroke off-screen position to the stroke lock-screen position based on the switching duration from the screen-off state to the screen-lock state, thereby achieving a dynamic change effect of the screen display of the electronic device from the composed text state in the screen-off state to the scattered stroke display state in the screen-lock state. For example, during the movement of multiple strokes, the current positions of the multiple strokes are obtained by linear interpolation between the stroke off-screen position and the stroke lock-screen position. It should be noted that the interpolator can also be used to generate intermediate frames between the key frames of the animation to create a smoother transition effect. They define the speed curve of the animation, that is, the way the animation changes on the timeline. In the embodiment of the present application, the type of interpolator used can be selected according to actual needs, and the embodiment of the present application does not make specific limitations on this.

[0065] In the embodiment of the present application, when the screen is off, the positions of all strokes of the same character are the same, that is, the coordinates (mPosX, mPosY) are the same, where (mPosX, mPosY) are the coordinates of the center of the stroke (for example, Figure 3 The upper left corner of the center of the text canvas is the coordinate origin, the right is the positive direction of the X axis, and the downward is the positive direction of the Y axis). To obtain the stroke screen-off position, it can be achieved based on the following steps:

[0066] In order to calculate the position of the stroke when the screen is off, a floating point array pos can be created and initialized with the first two elements of the mIdleCenter array. mIdleCenter is an array containing two elements, namely the x coordinate and the y coordinate, which represents the center position of a row of words in the screen off state, such as "Love without boundaries". First, the position of the first word is calculated: mIdleCenter[0] is the x coordinate of the center, and mIdleWordWidth is the width of the word when the screen is off. By calculating mIdleWordWidth*(wordNum-1)*0.5f, the offset of the first word relative to the center position can be determined. wordNum represents the total number of words, and f represents the x position of the first word. Then, the position of the first word can be determined based on mIdleCenter[0] and the offset of the first word relative to the center position. Then, the position of the current word is calculated based on the word sequence number wordSeq (starting from 0). According to the x position of the first word, add wordSeq multiplied by the width of the word mIdleWordWidth to get the x coordinate of the current word, and assign it to the first element of the pos array. Returns the calculated floating point array pos, which contains the position coordinates of the current text.

[0067] It should be noted that wordNum is the number of characters; wordSeq is the sorting number of the characters in which the strokes are located (numbering starts from 0); mIdleCenter is the coordinate of the center of a row of characters when the screen is off, and the value in the embodiment of the present application is (mScreenWidth*0.5, mScreenHeight*0.15); mIdleWordWidth is the width of the text when the screen is off, which is calculated by mWordWidth*mScale (ie 1024*0.17).

[0068] See also Figure 4 A possible schematic diagram of the division of regions within and outside the window of an electronic device is shown, where the window 40 (screen) of an electronic device such as a mobile phone is divided into Figure 4In the grid area shown, gray represents the inside of the mobile phone screen (i.e., the window 40 of the electronic device described in this article), and white represents the enclosed area 42 outside the mobile phone window 40. The enclosed area 42 includes multiple virtual areas 420 described in this article. Each grid in the window 40, such as the first area 401 and the second area 402, has at most one stroke, and each grid in the enclosed area 42, such as the virtual area 420, can have one or more strokes. By designing the window 40 to be 9 grids or other suitable number of grids, it is realized that when the screen is locked, there is time on the top of the screen and UI such as flashlight, camera, fingerprint, etc. on the bottom. This design avoids large-scale overlap of text and UI. There are more blank areas in the middle of the window 40, so there will be more distributed strokes. It should be noted that the window is the area where the electronic device can provide visual display effects, and its size is basically corresponding to the display screen.

[0069] Exemplarily, the window 40 of the electronic device is divided into a plurality of first areas 401 and a plurality of second areas 402. For example, the plurality of first areas 401 may be arranged closer to the top or bottom of the window 40, and the plurality of second areas 402 may be arranged in the middle of the window 40, that is, the plurality of second areas 402 are arranged between the plurality of first areas 401. The size of the second area 402 is smaller than the size of the first area 401, and some of the plurality of strokes are randomly distributed in the plurality of first areas 401 and the plurality of second areas 402, and each first area 401 and each second area 402 displays a stroke. In this possible implementation, by setting the first area 401, the second area 402, and the size, i.e., the relative positional relationship between the two, and the number of strokes displayed in the two, the arrangement of the stroke display positions can be realized, and the display position and effect of the strokes in the window of the electronic device can be optimized.

[0070] Each time the screen is off, the explosion position of each stroke will be recalculated, that is, the stroke position and / or stroke displayed on the wallpaper in each lock screen state can be different. The explosion position is the position of the stroke displayed on the screen after the screen is switched to the lock screen state, that is, the stroke lock screen position. Based on this, obtaining the stroke lock screen position can be achieved based on the following steps:

[0071] ① At most 9 strokes are randomly selected each time to be displayed on the screen, and the remaining strokes are displayed outside the screen.

[0072] ② There are as many strokes as possible on the screen (until all 9 grids are filled, then consider displaying them outside the screen), and the strokes outside the screen are as dispersed as possible (until every space is filled, then consider random overlapping).

[0073] ③ The coordinates of the center of the grid are randomly offset to the surroundings within a certain range as the explosion position of the stroke (in the present invention, the random offset range of the x-axis is -80 to 80, and the random offset range of the y-axis is -250 to 250).

[0074] In a possible implementation, in order to present an explosion effect, the multiple strokes are enlarged while moving the multiple strokes from the stroke screen-off position to the stroke screen-lock position.

[0075] In this possible implementation, while moving the multiple strokes from the stroke screen-off position to the stroke screen-lock position, the multiple strokes are enlarged, so that in the process of changing from the screen-off to the screen-lock, the strokes are displayed as growing from small to large, imitating an explosion effect.

[0076] Taking into account that an electronic device may have multiple usage scenarios, after switching from a first state to a second state, it may also switch from the second state to the first state again. Therefore, in a possible implementation, the method may also perform the following steps: in response to the electronic device switching from the lock screen state to the screen off state, based on the switching duration from the lock screen state to the screen off state, move the multiple strokes from the stroke lock screen position to the stroke screen off position, wherein the multiple strokes are reduced during the movement.

[0077] In this possible implementation, multiple strokes can be moved based on the stroke lock screen position and the stroke off screen position stored when the electronic device switches from the first state to the second state. In response to the electronic device switching from the lock screen state to the off screen state, an interpolator can be used to move the multiple strokes to the stroke off screen position based on the switching duration from the lock screen state to the off screen state and from the stroke lock screen position. For example, during the movement of multiple strokes, the current positions of the multiple strokes are obtained by linear interpolation between the stroke lock screen position and the stroke off screen position. Thus, the screen display of the electronic device shows a dynamic change effect of the explosion restoration process from the scattered display state of the strokes in the lock screen state to the text-forming state in the off screen state.

[0078] It should be noted that interpolators can also be used to generate intermediate frames between key frames of animation to create a smoother transition effect. They define the speed curve of the animation, that is, how the animation changes on the timeline. In the embodiment of the present application, the type of interpolator used can be selected according to actual needs, and the embodiment of the present application does not specifically limit this.

[0079] In this possible implementation, in order to present an explosion restoration effect, the multiple strokes are moved from the stroke lock screen position to the stroke off screen position while reducing the size of the multiple strokes.

[0080] Considering that when using the strokes and medians fields in the hanzi - writer - date character - splitting library for stroke drawing, to facilitate stroke drawing using Canvas, it is necessary to convert the jason data into path (Path) data and then call the drawPath method of Canvas to draw the path. Therefore, in a possible implementation, it further includes: converting the stroke parameters into stroke paths, determining the central trajectory point path based on the stroke paths; in response to the electronic device switching from the locked - screen state to the desktop state, generating first imitation data for the multiple strokes according to the switching duration from the locked - screen state to the desktop state and the central trajectory point path, where the first imitation data is configured to indicate the imitation effect displayed on the multiple strokes during the process of the electronic device switching from the locked - screen state to the desktop state.

[0081] In this possible implementation, the stroke parameters may include stroke SVG (Scalable Vector Graphics) vector graphic data (strokes) and the central trajectory point data of the stroke. Therefore, converting the stroke parameters into stroke paths includes separately converting the stroke SVG vector graphic data (strokes) and the central trajectory point data of the stroke (medians) into stroke paths. Then, taking the stroke path corresponding to the central trajectory point data of the stroke after being converted into a stroke path as the central trajectory point path. Among them, the method of converting each string in strokes into a path is as follows:

[0082] To create a stroke path, define a method named createStrokePath, which is public, returns a Path object, and accepts a parameter pathStr of type String. Call the static method createPathFromPathData of the PathParser class, pass pathStr as a parameter, and return the generated Path object. The function of the PathParser.createPathFromPathData method is to parse the SVG path data string (pathStr) into a Path object.

[0083] In response to the electronic device switching from the locked - screen state to the desktop state, generating first imitation data for the multiple strokes according to the switching duration from the locked - screen state to the desktop state and the central trajectory point path, so that the electronic device dynamically displays the imitation effect of multiple strokes during the process of switching from the locked - screen state to the desktop state. It should be noted that the imitation effect is displayed according to the central trajectory point path. For example, for the stroke "一", the imitation process is displayed in the stroke writing order from left to right. Figure 8Shows a schematic diagram of the tracing effect. During the tracing process, the strokes are traced, and the color used for tracing the strokes is different from the color used for drawing the strokes, thereby showing a dynamic tracing effect. See Fig.11 A schematic diagram of the desktop state effect shown in Fig.11 . In the desktop state, the display module of the electronic device, such as the display screen of a mobile phone, scatteredly displays the tracing results of multiple completed strokes.

[0084] It can be understood that the desktop state can also be referred to as the main interface state, which is usually configured to display various application icons, smart cards, quick bars, etc.

[0085] In a possible implementation manner, it further includes: in response to the electronic device switching from the desktop state to the locked screen state, generating second tracing data for the multiple strokes according to the switching duration from the desktop state to the locked screen state and the center trajectory point path, where the second tracing data is configured to indicate the display of the tracing effect on the multiple strokes during the process of the electronic device switching from the desktop state to the locked screen state, and the tracing direction of the second tracing data is the same as that of the first tracing data.

[0086] In this possible implementation manner, in response to the electronic device switching from the desktop state to the locked screen state, second tracing data for the multiple strokes is generated according to the switching duration from the desktop state to the locked screen state and the center trajectory point path, so that the electronic device dynamically displays the tracing effect of multiple strokes during the process of switching from the desktop state to the locked screen state. The tracing effect is displayed according to the center trajectory point path. For example, for the stroke "一", the tracing process is displayed in the stroke writing order from left to right, which is consistent with the stroke tracing direction during the process of the electronic device switching from the locked screen state to the desktop state. In the embodiments of the present application, there is a stroke tracing special effect during the process from the locked screen to the desktop, and there is also a stroke tracing special effect during the process from the desktop to the locked screen, and the two are not simply inverse relationships (for example, one traces from the pen tip to the pen tail, and the other traces from the pen tail to the pen tip), but both are forward tracings (that is, both trace from the pen tip to the pen tail), that is, the tracing direction of the second tracing data is the same as that of the first tracing data.

[0087] The following introduces a possible implementation manner of stroke tracing. The principle is: intercept the center trajectory path segment through the getSegment method of PathMeasure, set the width of the trajectory (the strokeWidth of the Path) wide enough (set to 100 in the embodiments of the present application) so that it can cover the strokes in width, and then use the SRC_IN mode to draw the trajectory segment on the strokes (in this mode, only the pixels in the intersection area of the trajectory segment and the strokes are drawn). When the trajectory segment gradually becomes longer, the stroke tracing effect will be achieved.

[0088] For example, create a public method drawMedian, which accepts a Canvas object as a parameter for drawing on the canvas; then, measure the length of the path and calculate the position of the starting point to determine where to start drawing on the path; calculate the position of the end point to determine the end position of the path drawing; set the blending mode of the brush mMedianPaint to SRC_IN, which means that only the part of the color where the source color (i.e. the brush color) intersects with the target color (i.e. the background color) is the result of multiplying the alpha channel values ​​of the source color and the target color, and the transparent part of the source color will be transparent to display the target color (i.e. the background color); reset the temporary path mTempPath so that it can be reused; according to the starting and ending positions, get a fragment of the path from mMedianMeasures and draw it into mTempPath. The true parameter indicates whether the path needs to be optimized; use the mMedianPaint brush to draw the mTempPath path on the Canvas; reset the brush's blending mode to the default value and cancel the previously set SRC_IN mode.

[0089] It should be noted that Canvas is the Canvas in the above stroke layer, mMedianMeasure is an object of the PathMeasure class, medianMeasures = new PathMeasure (mMedianPath, false), mMedianPath is the stroke center trajectory path created by the createMedianPath method in the method of converting each stroke in the above medians to Path; mStartProgress and mEndProgress are the copying progress of the beginning and end of the stroke respectively. In the process from the lock screen state (or the screen off state) to the desktop state, mStartProgress remains at 0, and mEndProgress changes from 0 to 1. In the process from the desktop state to the lock screen state (or the screen off state), mStartProgress changes from 0 to 1, and mEndProgress remains at 1; SRC_IN mode means that only the area where the path fragment intersects the stroke is drawn, and it is filled with the copied color; when xfermode is set to null (that is, transparency or blending effects are not considered), the effect is shown in the attached figure. Figure 8 , Figure 8 A schematic diagram of the copying effect is shown, in which thicker gray lines are used to copy the strokes.

[0090] In a possible implementation, the second state is a desktop state; the process of displaying the multiple strokes of the one or more characters that have been adjusted and drawn on the wallpaper of the electronic device includes: converting the stroke parameters into a stroke path, and determining a center track point path based on the stroke path; obtaining a stroke screen-off position and a stroke desktop position, wherein the stroke screen-off position represents the position of the stroke on the wallpaper of the electronic device in the screen-off state, and the stroke desktop position represents the position of the stroke on the wallpaper of the electronic device and / or outside the electronic device in the desktop state; moving the multiple strokes from the stroke screen-off position to the stroke desktop position according to the switching duration from the screen-off state to the desktop state; generating third copying data of the multiple strokes according to the switching duration from the screen-off state to the desktop state and the center track point path, wherein the third copying data is configured to indicate displaying a copying effect on the multiple strokes during the process of the electronic device switching from the screen-off state to the desktop state.

[0091] In this possible implementation, the electronic device switches directly from the screen-off state to the desktop state, so it is necessary to adjust the multiple stroke layers that have been drawn so that the electronic device can display the copying effect after displaying the explosion effect. Among them, the explosion effect includes the change process from the stroke composition text state to the stroke dispersion display state. The copying effect includes the dynamic change process of depicting the strokes in the writing order of the strokes. The step of displaying the explosion effect can refer to the aforementioned processing steps of the electronic device from the screen-off state to the locked screen state, the step of displaying the copying effect can refer to the aforementioned processing steps of the electronic device from the locked screen state to the desktop state, and the display effect of the third copying data can refer to the display effect of the aforementioned first copying data. The specific implementation method will not be repeated here.

[0092] It should be noted that in the embodiment of the present application, although the screen is switched from the off-screen state to the desktop state, the strokes all start to move from the off-screen position until they move to the target position, and when switching to the off-screen or locked screen state, the target position can be the same, that is, the lock-screen position of the strokes and the desktop position of the strokes are the same. Therefore, the aforementioned method for calculating the off-screen position of the strokes and the lock-screen position of the strokes when switching from the off-screen state to the locked screen state can be applied to the embodiment of the present application, and the specific calculation process is referred to the aforementioned content, which will not be repeated here. In a possible implementation, it also includes: in response to the electronic device switching from the desktop state to the screen-off state, moving the multiple strokes from the stroke desktop position to the stroke screen-off position according to the switching duration from the desktop state to the screen-off state; and generating fourth copying data of the multiple strokes according to the switching duration from the desktop state to the screen-off state and the center trajectory point path, wherein the fourth copying data is configured to indicate displaying a copying effect on the multiple strokes during the process of the electronic device switching from the desktop state to the screen-off state, and the fourth copying data has the same copying direction as the third copying data.

[0093] In this possible implementation, the electronic device switches from the desktop state to the screen-off state, so it is necessary to adjust the multiple stroke layers that have been drawn so that the electronic device simultaneously displays the explosion restoration effect and the copying effect. Among them, the explosion restoration effect includes the change process from the scattered stroke display state to the re-formed text state. The copying effect includes the dynamic change process of drawing the strokes in the writing order of the strokes. The step of displaying the explosion restoration effect can refer to the aforementioned processing steps of the electronic device from the lock screen state to the screen-off state, the step of displaying the copying effect can refer to the aforementioned processing steps of the electronic device from the desktop state to the lock screen state, and the display effect of the fourth copying data can refer to the display effect of the aforementioned second copying data. In the embodiment of the present application, there is a stroke copying special effect in the process from or screen-off to the desktop, and there is also a stroke copying special effect in the process from the desktop to the screen-off, and the two are not a simple inverse relationship (i.e., one is copied from the beginning of the pen to the end of the pen, and the other is copied from the end of the pen to the beginning of the pen), but both are positive copying (i.e., both are copied from the beginning of the pen to the end of the pen), that is, the fourth copying data has the same copying direction as the third copying data. The specific implementation method of copying can refer to the aforementioned copying implementation steps, which will not be repeated here.

[0094] Considering that the trajectory from the beginning to the end of the center trajectory point data is shorter than the trajectory from the beginning to the end of the stroke data, the problem of incomplete filling of the beginning and end of the stroke will occur during copying. Figure 6The schematic diagram of the effect of the beginning and end of a stroke leaking out is shown in the figure. The starting position of the vertical hook of the stroke shows the blank point that was not filled in during copying. In order to improve the leakage of the end of the stroke and make it present a complete copying effect, it is necessary to extend the beginning and end outwards a little bit respectively. The effect after adjustment can be seen in Figure 7 A schematic diagram of a normal effect of the beginning and end of a stroke is shown. Based on this, in a possible implementation, determining the center trajectory point path based on the stroke path can be performed according to the following steps: based on the stroke path, determining the initial starting point position and the initial end point position of the center trajectory point path, and determining the extension direction of the starting point and the extension direction of the end point; using the position corresponding to the starting point position after extending the specified length in the extension direction of the starting point as the updated starting point position of the path, and using the position corresponding to the end point position after extending the specified length in the extension direction of the end point as the updated end point position of the path; determining the center trajectory point path based on the updated starting point position, the updated end point position and the stroke path.

[0095] In this possible implementation, Figure 5 The area filled with orange in the middle represents the display effect of the stroke after drawing, the circle on the left represents the initial starting point position of the center track point path, the circle below represents the initial end point position of the center track point path, the direction of the arrow is the writing direction of the stroke (copying direction), the opposite direction of the arrow on the left represents the extension direction of the starting point, the direction of the arrow below represents the extension direction of the end point, the starting point of the left arrow is the updated starting point position of the path, and the end point of the arrow below is the updated end point position of the path. The center track point path is determined based on the updated starting point position, the updated end point position and the stroke path, thereby optimizing the copying effect of the stroke and avoiding the situation where there are unfilled blank points during copying.

[0096] In a possible implementation, each stroke parameter in medians is converted into a stroke path, which can be implemented by referring to the following steps:

[0097] In order to create a stroke center point path, define a method called createMedianPath. This method is public and can return a Path object. It accepts a two-dimensional integer array median as a parameter. median represents the coordinates of the center points of a series of strokes. Create a new Path object to store path data. Call the getExtendPoint method to calculate the extension point with a distance of -20f (indicating extension to the starting point) or other appropriate distance in the direction of median[0] (i.e. the first point of the stroke) and median[1] (i.e. the second point of the stroke). Extend the first point (starting point) and the second point of the stroke outward by a certain distance and store the result in the start array to represent the adjusted coordinates of the first and second points. Move the starting point of the path to the start coordinate (i.e. the two calculated extension points). Use a for loop to traverse each point in the median array. Draw the path from the current point to the next point to form a continuous line segment. Calculate the index of the last point in the median array and store it in the last variable. Call the getExtendPoint method again to calculate the extension point with a distance of 20f (indicating extension to the end point) or other appropriate distance from median[last-1] (i.e. the second to last point of the stroke) to median[last] (i.e. the first to last point of the stroke), and store the result in the end array after extending the second to last point and the first to last point of the stroke outward by the first distance. Draw the path from the current point to the end coordinates (i.e. the two calculated extension points). Finally, return the created Path object.

[0098] The implementation of the getExtendPoint method is as follows, and its function is to obtain the point after the stroke is extended outward by the length dist.

[0099] Define a private method called getExtendPoint. This method first returns a float array. This float array accepts three parameters: two int arrays start and end, and a float value dist. Calculate the vector from the start point to the end point and store the result in the vec array. Calculate the modulus (length) of the vector vec and store the result in the mode variable. You can use the Pythagorean theorem, for example, to calculate the length of the vector vec. Calculate the unit vector (direction vector) of the vector vec and store the result in the norm array. The unit vector is obtained by dividing the original vector by its modulus. The starting point of the extension point is determined by the positive or negative value of dist. If dist is negative, the starting point is start; otherwise, the starting point is end. Calculate the coordinates of the extension point and return a float array containing the coordinates of the extension point. The coordinates of the extension point are calculated by adding the unit vector to the coordinates of the starting point and multiplying it by dist.

[0100] In a possible implementation, after the electronic device switches from a screen-off state or a lock screen state to a desktop state, it also includes: enlarging and shrinking the multiple strokes according to a given cycle, and controlling the multiple strokes to approach and move away from the center of the screen used to display the wallpaper according to the cycle.

[0101] In the process from the off screen to the lock screen state, each stroke is enlarged and translated to the target position, where the target position can be the center of the screen for displaying the wallpaper. In this possible implementation, after entering the desktop state, the strokes are periodically scaled and translated. When the translation parameters of each stroke are (0, 0), the strokes will just form a word. The following is the stroke translation and scaling method.

[0102] Define a method called transform, which is private and has a result return type of void (i.e., empty type). It accepts a Canvas object canvas as a parameter. Then call the getStrokeOffset method to calculate the offset of the stroke center relative to the upper left corner of the canvas and store the result in the offset array. Translate the origin of the canvas canvas to a new position by a distance of mPosX-offset[0] and mPosY-offset[1]. mPosX and mPosY are the coordinates of the stroke center, with the upper left corner of the center of the text canvas as the origin, while offset[0] and offset[1] are the offsets of the stroke center. The position of the stroke can be adjusted by subtracting the value in the offset array. Then you need to move the stroke to the canvas where the stroke exists (for example Figure 3The rectangle on the text canvas where the stroke is shown is scaled, sx is the horizontal scaling ratio, sy is the vertical scaling ratio, sx is determined by multiplying the stroke scaling factor mScale by a desktop periodic scaling factor mAutoScale, and sx is determined by multiplying the stroke scaling factor mScale by a desktop periodic scaling factor to take the negative.

[0103] It should be noted that, among them, the getStrokeOffset method is used to calculate the offset from the stroke center to the upper left corner of the text canvas; (mPosX, mPosY) is the coordinate of the stroke center (with the upper left corner of the text canvas center as the coordinate origin, the right is the positive direction of the X axis, and the downward is the positive direction of the Y axis). During the animation process, its value is obtained by linear interpolation of the position when the screen is off and the target position when it explodes; mScale is the scaling factor of the stroke. In the embodiment of the present application, the value of mScale is 0.17 when the screen is off, and the values ​​are both 0.68 when the screen is locked and in the desktop state. During the animation process, mScale is interpolated between 0.17 and 0.68; mAutoScale is the scaling factor of the periodic scaling of the desktop state, which changes periodically between 0.85 and 1.15 over time; in the canvas.scale method, the negative sign for sy is to solve the problem of the drawn strokes being upside down.

[0104] like Figure 3 A schematic diagram of a vector relationship for calculating an offset from a stroke center to the upper left corner of a text canvas is shown, in which wordWidth represents the width of the text canvas and wordHeight represents the height of the text canvas. Figure 3 In the vector OS, it is the value required by the getStrokeOffset function. Therefore, the implementation of the getStrokeOffset function is as follows:

[0105] Define a private method called getStrokeOffset that returns a float array to store the calculated offset. Create a float array called ws that contains two elements, which are the values ​​of the original stroke center offset mPathOffset adjusted by mAodRate. mPathOffset is an array containing path offsets, and mAodRate is a scaling factor. Next, declare a float array os of length 2, corresponding to the offsets in the x and y directions, to store the final offsets. Then calculate the horizontal offset and store it in os[0]. The calculation formula is: (mWordWidth*0.5f+ws[0]+mAutoTranslate[0])*mScale*mAutoScale. mWordWidth is the width of the word, ws[0] is the horizontal offset calculated previously, mAutoTranslate[0] is the horizontal offset of the automatic translation, and mScale and mAutoScale are scaling factors. Next, calculate the vertical offset and store it in os[1]. The calculation formula is: -(mWordHeight*0.5f+ws[1]+mAutoTranslate[1])*mScale*mAutoScale. mWordHeight is the height of the word, ws[1] is the vertical offset calculated previously, mAutoTranslate[1] is the vertical offset of the automatic translation, and mScale and mAutoScale are scaling factors. Note that there is a minus sign here, indicating a vertical reversal. Return the calculated offset array os.

[0106] Among them, mPathOffset is the offset of the original stroke center in the hanzi-writer-date database relative to the center of the canvas. The center position of the stroke can be obtained through the computeBounds method of the Path class; mAodRate is the coefficient of the wallpaper in the screen-off state. When the wallpaper changes from the screen-off state to the lock screen (or desktop) state, mAodRate gradually changes from 1 to 0. When the screen is locked (or desktop), ws takes the value of (0, 0), that is, the stroke is moved to the center of the text. In this way, when calculating the target position of the explosion, only the position change of the stroke center needs to be considered; mAutoTranslate is the translation coefficient of the stroke periodically approaching and moving away from the center of the screen.

[0107] In a possible implementation, before creating multiple stroke layers corresponding to the stroke parameters, it also includes: creating a background layer corresponding to the stroke parameters; after creating multiple stroke layers corresponding to the stroke parameters, it also includes: creating a blur layer and a mask layer corresponding to the stroke parameters.

[0108] In this possible implementation, see Figure 2 The layer diagram shown is Figure 2 The background layer, mask layer, blur layer and stroke layer are shown. In Canvas, a Layer of a specified size and position can be created through the saveLayer method, and the image drawn by the layer can be flushed to the buffer through the restoreToCount method. In addition, a Canvas can be created through the beginRecording method of RenderNode, which is equivalent to creating an independent layer. The advantage of using layers is that images of different layers can be controlled independently without affecting each other, which makes it convenient to transform each layer independently. Therefore, the embodiment of the present application draws the layers in the order of background layer, stroke layer, blur layer and mask layer, that is, before creating multiple stroke layers corresponding to the stroke parameters, it also includes: creating a background layer corresponding to the stroke parameters; after creating multiple stroke layers corresponding to the stroke parameters, it also includes: creating a blur layer and a mask layer corresponding to the stroke parameters.

[0109] The drawing of each layer is introduced below with a specific embodiment.

[0110] The existing method uses SurfaceControl and ViewRootImpl to build a View Tree for rendering, which consumes more performance and is not safe. In addition, holding the SurfaceControl in the framework is prone to memory leaks. The embodiment of the present application uses the lockHardwareCanvas method of SurfaceHolder to get the Canvas for rendering, which reduces the rendering timing, improves the rendering performance, and is safer. The following is a function that requests rendering of a frame:

[0111] Define a method named requestRender, which is public and has a return type of void. Call the lockHardwareCanvas method of the mSurfaceHolder object to get a Canvas object canvas. mSurfaceHolder is a SurfaceHolder object, which is typically used to manage the drawing surface of SurfaceView. The lockHardwareCanvas method locks the canvas for drawing and returns a hardware-accelerated Canvas object. Call the draw method of the mRenderer object and pass canvas to it as a parameter. mRenderer is an object responsible for drawing content, and its draw method performs drawing operations on the passed-in Canvas. Call the unlockCanvasAndPost method of the mSurfaceHolder object to unlock the canvas and submit the drawing operation. The unlockCanvasAndPost method submits the drawn content to the Surface for display.

[0112] It should be noted that mSurfaceHolder is the native SurfaceHolder class of Android. When the wallpaper engine is created, the system will call back the onCreated method and pass the SurfaceHolder. We can save this SurfaceHolder object; Canvas is the native canvas class of Android. After defining the brush (Paint), various graphics can be drawn on the canvas; in SurfaceHolder, the Canvas object can be obtained through the lockCanvas and lockHardwareCanvas methods. The former is software rendering (CPU rendering) and the latter is hardware rendering (GPU rendering, more efficient); mRenderer is a custom WordRenderer renderer, which renders graphics through Canvas; after rendering, you need to call the unlockCanvasAndPost method of SurfaceHolder to unlock and submit the canvas content on the Surface, and write the image data into the Surface buffer.

[0113] The implementation of the draw method of WordRenderer is as follows, where mBgEffect is a custom background effect class (BackgroundEffect), and mMaskEffect is a custom mask effect class.

[0114] Define a method named draw, which is public, has a void return type, and accepts a Canvas object as a parameter. Call the drawBackground method of the mBgEffect object and pass the canvas to it as a parameter. mBgEffect is an object responsible for drawing background effects, and its drawBackground method draws the background layer on the passed Canvas. Call the drawMask method of the mMaskEffect object and pass the canvas to it as a parameter. mMaskEffect is an object responsible for drawing mask effects, and its drawMask method draws the mask layer on the passed Canvas.

[0115] The following is an introduction to the background layer. Draw a gradient background, which is implemented as follows:

[0116] Define a method called drawBackground, which is public, has a return type of void, and accepts a Canvas object and an int array bgColors as parameters. Create a new LinearGradient object and set it as the shader of mBgPaint. LinearGradient is a linear gradient shader. The parameters of the constructor are the x and y coordinates of the starting point, the x and y coordinates of the end point, the color array bgColors, the position array (null here, indicating that the colors are evenly distributed), and the shader's tiling mode Shader.TileMode.CLAMP (indicating that the edge color will extend to the border of the control). Continue the previous line, passing the color array bgColors, the position array (null here), and the tiling mode Shader.TileMode.CLAMP. Create a new Rect object bgRect, which represents the area of ​​the background rectangle. The parameters of the Rect constructor are the coordinates of the left, top, right, and bottom boundaries, respectively. Here, a rectangular area from (0, 0) to (mScreenWidth, mScreenHeight) is defined. Use the drawRect method of the canvas object to draw the background rectangle bgRect and fill it with mBgPaint. mBgPaint contains the LinearGradient shader set previously, so the drawn rectangle will display a linear gradient effect.

[0117] In this method, the input parameter canvas is the Canvas returned by the lockHardwareCanvas method of the above SurfaceHolder; bgColors is the input decimal color array, which represents the gradient color; mBgPaint is the background brush (the one starting with m indicates a member variable of the class, the same below), which is an object of the Paint class; mScreenWidth and mScreenHeight represent the screen width and height respectively (the same below).

[0118] The following is an introduction to the mask layer. The mask layer is used to mask the strokes at the top and bottom of the screen, making the stroke color of the status bar and navigation bar area transparent so that it appears as the background color. The mask layer can be implemented by following the steps below:

[0119] The function of the following method is to draw a mask layer. Define a method named drawMask, which accepts a Canvas object as a parameter. Set the Xfermode of mMaskPaint to PorterDuff.Mode.DST_OUT mode. This mode means that the target part will become transparent in the area where the source and target intersect. Save the state of the current canvas and create a new layer. The size of the new layer is from (0, 0) to (mScreenWidth, mScreenHeight), and it is drawn using mMaskPaint. Call the drawBlur method of the mBlurEffect object to draw the blur effect layer on the passed in canvas. Next, the top rectangle will be drawn. Use mMaskPaint to draw a rectangle with the upper left corner coordinates of (topRect.left, topRect.top) and the lower right corner coordinates of (topRect.right, topRect.bottom). Next, the bottom rectangle will be drawn. Use mMaskPaint to draw another rectangle with the upper left corner coordinates (bottomRect.left, bottomRect.top) and the lower right corner coordinates (bottomRect.right, bottomRect.bottom). Restore the canvas state saved before, that is, the state before saveLayerCount. This means that all drawing operations after saveLayer will be applied to this layer. Clear the Xfermode of mMaskPaint and restore the default drawing mode.

[0120] It should be noted that the input parameter canvas is the Canvas returned by the lockHardwareCanvas method of the above-mentioned SurfaceHolder; mMaskPaint is the mask brush (an object of the Paint class); DST_OUT will clear the pixels where SRC and DST intersect to transparent color, that is, set the top and bottom strokes to transparent color; mBlurEffect is a custom blur effect class.

[0121] The following is an introduction to the blur layer. When the wallpaper is in desktop state, it will become blurred, and when switching between lock screen and desktop state, the wallpaper will be enlarged and reduced. This operation is also implemented in the blur layer. The blur layer can be implemented as follows:

[0122] The following method is used to draw the blur layer. Define a method named drawBlur, which accepts a Canvas object as a parameter. Start recording drawing operations on mBlurRenderNode and return a Canvas object blurCanvas, which is used to draw on mBlurRenderNode. Determine whether the blur radius mBlurRadius is greater than 0. If mBlurRadius is greater than 0, create a blur effect blur with a blur radius of mBlurRadius and use Shader.TileMode.CLAMP mode. Apply the created blur effect blur to mBlurRenderNode. Otherwise (that is, mBlurRadius is not greater than 0). Cancel the blur effect on mBlurRenderNode. Call the scaleCanvas method to scale blurCanvas. Iterate over each stroke in mStrokeList. Draw each stroke on blurCanvas. End the forEach loop. End recording on mBlurRenderNode. Draw mBlurRenderNode on the passed canvas.

[0123] The following method is used to scale the canvas. Define a private method called scaleCanvas, which accepts a Canvas object as a parameter. Call the getScaleCenter method to get the scaling center point center. Scale the canvas with the center point as the center, and the scaling ratio is mTotalScale.

[0124] The following method is used to get the scaling center of the canvas. Define a private method named getScaleCenter, which has no parameters and returns a PointF object. Create a new PointF object center to store the center point coordinates. Calculate the x coordinate of the center point using the formula mScreenWidth*0.5f*mTotalScale. Calculate the y coordinate of the center point using the formula mScreenHeight*0.5f*mTotalScale. Return the calculated center point center.

[0125] It should be noted that the input parameter canvas is the Canvas in the mask layer; mBlurRenderNode is an object of the RenderNode class, which is a native class of Android and supports hardware accelerated rendering. When creating an mBlurRenderNode object, you need to call the setPosition method to set the rendering interval. The four parameters passed in the embodiment of the present application are: (0, 0, mScreenWidth, mScreenHeight); mBlurRadius is the blur radius of the canvas; mStrokeList is a stroke list that stores the data of all strokes, and each element in it is an object of a custom Stroke class; mTotalScale is the global scaling factor of the canvas when switching between the lock screen and desktop states. In the embodiment of the present application, when switching from the lock screen to the desktop state, mTotalScale gradually changes from 1 to 1.15.

[0126] The following is an introduction to the relevant content of the stroke layer. The embodiment of the present application creates a stroke layer for each stroke, which will perform translation, scaling, copying and other processing of the stroke, and the steps are as follows:

[0127] The following method is used to draw the text layer. Define a method named drawStroke, which accepts a Canvas object as a parameter. Save the current canvas state. After calling the save method, all drawing operations will be performed on a new layer until the restore method is called to restore the previous state. Call the transform method to translate and scale the canvas. This line of comments indicates that this method is responsible for the translation and scaling of the stroke. Start recording drawing operations on mStrokeRenderNode and return a Canvas object strokeCanvas for drawing on mStrokeRenderNode. Draw the path mStrokePath on strokeCanvas and use mStrokePaint to draw. This line of comments indicates that this is an operation to draw a stroke. Call the drawMedian method of the mMediaEffect object to apply a media effect on strokeCanvas. This line of comments indicates that this is an operation to copy a stroke. End recording on mStrokeRenderNode. Draw mStrokeRenderNode on the passed canvas. Restore to the previously saved canvas state. After calling the restore method, all drawing operations performed after the save method will be undone.

[0128] It should be noted that the input parameter canvas is the Canvas in the blurred layer, mStrokeRenderNode is an object of the RenderNode class, which is an Android native class that supports hardware accelerated rendering. When creating the mStrokeRenderNode object, it is necessary to call the setPosition method to set the rendering interval. The four parameters passed in the embodiment of the present application are: (0, 0, mWordWidth, mWordHeight), mWordWidth, mWordHeight are the original canvas width and height of the text, respectively, and the original canvas width and height of the text defined in the hanzi-writer-date character library are both 1024*1024; mStrokePath is the path data of the stroke loaded by the method of converting each string in the above strokes to Path; mStrokePaint is the brush object of the stroke. In order to make the stroke also have a gradient color, refer to the method of converting each string in the above strokes to Path, and set the shader of the brush to LinearGradient; mMediaEffect is a copying special effect; the transform method translates and scales the stroke.

[0129] In a possible implementation, the method further includes: in response to receiving a control instruction to switch to a third target state when the electronic device switches from the first target state to the second target state, saving current state parameters; and controlling the electronic device to switch from the current state parameters to the third target state.

[0130] In this possible implementation, the first target state, the second target state, and the third target state are different states, and the first target state, the second target state, and the third target state are one of the screen-off state, the screen-locked state, and the desktop state. For example, the first target state may be the first state, i.e., the screen-off state, the second target state may be the second state, such as the screen-locked state or the desktop state, and the third target state may be the desktop state or the screen-locked state. In other examples, the first target state may be the screen-locked state, and the second target state and the third target state may be the screen-off state or the desktop state, respectively; or the first target state may be the desktop state, and the second target state and the third target state may be the screen-off state or the screen-locked state, respectively. This application does not limit this.

[0131] When the electronic device switches from the first target state to the second target state, it receives a control instruction to switch to the third target state, that is, the animation is interrupted. In this case, all current state parameters (that is, the state parameters at the interruption moment) are saved, such as but not limited to: the blur radius (mBlurRadius) of the canvas, the global scaling factor (mTotalScale) of the canvas, the horizontal position of the stroke (mPosX), the vertical position of the stroke (mPosY), the scaling factor (mScale) of the stroke, the copying progress of the beginning of the stroke (mStartProgress), the copying progress of the end of the stroke (mStartProgress), etc. Afterwards, based on these state parameters, the electronic device is controlled to change to the third target state, thereby realizing animation support interruption, and will continue to change to the target state from the current state.

[0132] For example, a parameter (denoted as a) takes the value of 0 when the screen is off, 1 when the screen is locked, and 2 when the desktop is on. Now the screen is being switched from the lock screen to the desktop, and a will gradually change from 1 (the first target state) to 2 (the second target state). For example, when it changes to 1.5 (interruption moment), the user wants to switch to the screen off state again, then the a variable will gradually change from 1.5 to 0 (the third target state); this 1.5 is the state parameter value saved when the interruption occurs, and 0 is the new target value. In this possible implementation, when the wallpaper changes from one target state (screen off, lock screen, or desktop) to another target state, the user switches the wallpaper to another target state. At this time, the animation will be interrupted, and the current state will change to another target state at the same time, so as to respond to the user's interactive information in a timely manner, without having to wait for the animation to be completed before responding to the user's new actions; in addition, if the animation is only interrupted without being continued, the animation will flicker. For example, when an electronic device is switching from the lock screen to the desktop, and the user wants to switch to the off screen, if the interruption is not continued, the animation will jump to the desktop, and then continue to change gradually to the off screen. The animation will flash, affecting the user's interactive experience.

[0133] Considering that in existing text wallpapers, when a parameter changes, the invalidate method will be called once. During the animation process, many parameters often change at the same time, resulting in multiple calls to the invalidate method within the rendering of a frame of animation, resulting in performance waste and the inability to control the frame rate. In order to reduce overhead and improve performance, in a possible implementation, the holder of the drawing surface is called to obtain the locked canvas object, including: in response to the state switch of the electronic device, obtaining the rendering duration corresponding to the state switch; submitting a rendering task, and determining the number of animation frames generated by the rendering within the rendering duration according to the rendering frame rate of the electronic device and the rendering duration; calling the holder of the drawing surface once to obtain the locked canvas object each time a rendering generation animation frame is requested, wherein the canvas object is locked by the holder of the drawing surface; after the rendering duration, removing the rendering task.

[0134] In this possible implementation, when a transition animation occurs (this application refers to a change in the wallpaper state / electronic device state), the rendering duration is obtained. It can be determined according to actual needs, for example, it can be determined to be 2 seconds. Multiple renderings can be performed within the rendering duration.

[0135] The rendering frame rate can be used to indicate the number of animation frames that the processor of the electronic device can generate per second, and the value can include but is not limited to 30, 60, 90 or 120. The product of the frame rate and the number of seconds determined by the rendering duration can be used as the number of rendering times within the rendering duration, that is, the number of animation frames generated.

[0136] In one example, a rendering task is submitted through Handler post (i.e., handle push), so that the holder of the drawing surface is called once to obtain the locked canvas object each time a rendering request is made to generate an animation frame. For example, if the frame rate of the electronic device is 50 and the rendering duration is 2 seconds, the submitted rendering task can be rendered 100 times within the 2-second duration, that is, in this rendering task, an animation frame is requested to be rendered at a fixed time interval, that is, the aforementioned requestRender method is called once to obtain the canvas object and perform rendering on the canvas object. Finally, the rendering task is removed periodically through HandlerpostDelay.

[0137] It should be noted that the frame rate of animation is different from the frame rate of rendering. The frame rate of animation is generally uncontrollable and is determined by the signal pulse frequency of Android, which is generally 60 frames / s or 120 frames / s. The frame rate in the embodiment of the present application is the rendering frame rate.

[0138] In this possible implementation, the rendering scheduling process is optimized, and animation and rendering are independently controlled by two threads. The rendering thread is only responsible for rendering a picture once within a specified time (i.e., generating an animation frame), avoiding the problem of multiple rendering requests within a frame, reducing unnecessary rendering times, and reducing performance waste. At the same time, the rendering duration is autonomously controllable, and the rendering frame rate is autonomously controllable.

[0139] See also Fig.12 A schematic diagram of the implementation steps of a display method is shown, and a possible specific implementation method of the display method is described below.

[0140] First, load the path data of the strokes and center tracks, then calculate the stroke screen-off position and the stroke explosion position (i.e. the stroke lock screen position and stroke desktop position mentioned in this article), then draw the mask layer and blur layer to use the blur layer to control the overall scaling of the canvas, then draw the strokes, control the stroke translation and scaling, and finally draw the copying data to show the copying effect. This display method can integrate explosion and copying special effects: when entering the lock screen state from the screen-off state, the strokes of the text will explode to a random position; when entering the screen-off state from the lock screen state, the strokes will return to the position when the screen was in the screen-off state; when entering the desktop state from the lock screen state, the strokes will show a copying animation, the entire canvas will gradually enlarge to the target size, and the strokes will gradually blur, and the strokes will periodically enlarge and shrink as well as move away from and approach the center of the screen over time; when entering the lock screen state from the desktop state, the strokes will also perform a copying animation, the entire canvas will gradually shrink to the target size, and the strokes will gradually become clear; when entering the desktop state from the screen-off state, the explosion and copying special effects will be integrated; when entering the screen-off state from the desktop state, the explosion shrinkage and copying special effects will be integrated. This method can realize the fusion effect of stroke copying. There is a fusion stroke copying effect from the lock screen state to the desktop state (or from the desktop state to the lock screen state, from the screen off state to the desktop state, and from the desktop state to the screen off state). The copying from the lock screen state to the desktop state and from the desktop state to the lock screen state is not a simple inverse relationship (one is copying from the beginning of the pen to the end of the pen, and the other is copying from the end of the pen to the beginning of the pen), but both are copying from the beginning of the pen to the end of the pen. In the desktop state, the strokes can be automatically scaled and translated to simulate the pulse beating effect. Each stroke moves closer to and farther away from the center of the screen while scaling, bringing a better interactive experience to the user. In addition, this method obtains the Canvas for rendering through the lockHardwareCanvas method of SurfaceHolder, which is more performance-saving and safer.

[0141] Corresponding to the application scenario and method of the display method provided in the embodiment of the present application, the embodiment of the present application also provides a display device. The device may include:

[0142] A calling module, used to call the holder of a drawing surface to obtain a locked canvas object, wherein the holder of the drawing surface is obtained by passing when creating a wallpaper engine; a stroke module, used to obtain stroke parameters of one or more characters displayed in the first state in response to the electronic device switching from a first state to a second state, wherein the first state is a screen-off state; a layer module, used to create multiple stroke layers corresponding to the stroke parameters based on the locked canvas object, wherein the multiple stroke layers are located at different view levels; a drawing module, used to draw strokes in the corresponding stroke layer using the stroke parameters; a display module, used to display the process of adjusting the multiple strokes of the one or more characters that have been drawn on the wallpaper of the electronic device during the process of the electronic device switching from the first state to the second state.

[0143] The functions of each module in each device in the embodiments of the present application can be found in the corresponding description in the above method, and have corresponding beneficial effects, which will not be repeated here.

[0144] Fig.13 FIG. 1 is a block diagram of an electronic device used to implement an embodiment of the present application. Fig.13 As shown, the electronic device includes: a memory 1301 and a processor 1302. The memory 1301 stores a computer program that can be run on the processor 1302. When the processor 1302 executes the computer program, the method in the above embodiment is implemented. The number of the memory 1301 and the processor 1302 can be one or more.

[0145] The electronic device also includes:

[0146] The communication interface 1303 is used to communicate with external devices and perform data exchange transmission.

[0147] If the memory 1301, the processor 1302 and the communication interface 1303 are implemented independently, the memory 1301, the processor 1302 and the communication interface 1303 can be connected to each other through a bus and communicate with each other. The bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus. The bus can be divided into an address bus, a data bus, a control bus, etc. For ease of representation, Fig.13 Only one thick line is used in the diagram, but this does not mean that there is only one bus or only one type of bus.

[0148] Optionally, in a specific implementation, if the memory 1301, the processor 1302 and the communication interface 1303 are integrated on a chip, the memory 1301, the processor 1302 and the communication interface 1303 can communicate with each other through an internal interface.

[0149] An embodiment of the present application provides a computer-readable storage medium storing a computer program, which implements the method provided in the embodiment of the present application when the program is executed by a processor.

[0150] An embodiment of the present application provides a computer program product, wherein the computer program product includes a computer program, and when the computer program is executed by a processor, the method provided in the embodiment of the present application is implemented.

[0151] An embodiment of the present application also provides a chip, which includes a processor for calling and executing instructions stored in the memory from the memory, so that a communication device equipped with the chip executes the method provided by the embodiment of the present application.

[0152] An embodiment of the present application also provides a chip, including: an input interface, an output interface, a processor and a memory, wherein the input interface, the output interface, the processor and the memory are connected via an internal connection path, and the processor is used to execute the code in the memory. When the code is executed, the processor is used to execute the method provided in the embodiment of the application.

[0153] It should be understood that the processor may be a central processing unit (CPU), or other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. A general-purpose processor may be a microprocessor or any conventional processor, etc. It is worth noting that the processor may be a processor supporting the Advanced RISC Machines (ARM) architecture.

[0154] Further, optionally, the above-mentioned memory may include a read-only memory and a random access memory. The memory may be a volatile memory or a non-volatile memory, or may include both volatile and non-volatile memory. Among them, the non-volatile memory may include a read-only memory (ROM), a programmable read-only memory (PROM), an erasable programmable read-only memory (EPROM), an electrically erasable programmable read-only memory (EEPROM), or a flash memory. The volatile memory may include a random access memory (RAM), which is used as an external cache. By way of exemplary but not limiting description, many forms of RAM are available. For example, static random access memory (SRAM), dynamic random access memory (DRAM), synchronous dynamic random access memory (SDRAM), double data rate synchronous dynamic random access memory (DDR SDRAM), enhanced synchronous dynamic random access memory (ESDRAM), synchronous link dynamic random access memory (SLDRAM) and direct memory bus random access memory (DR RAM).

[0155] In the above embodiments, it can be implemented in whole or in part by software, hardware, firmware or any combination thereof. When implemented using software, it can be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, the process or function according to the present application is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. The computer instructions can be stored in a computer-readable storage medium, or transmitted from one computer-readable storage medium to another computer-readable storage medium.

[0156] It should be noted that the information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of relevant countries and regions, and provide corresponding operation entrances for users to choose to authorize or refuse.

[0157] In the description of this specification, the description with reference to the terms "one embodiment", "some embodiments", "example", "specific example", or "some examples" means that the specific features, structures, materials or characteristics described in conjunction with the embodiment or example are included in at least one embodiment or example of the present application. Moreover, the specific features, structures, materials or characteristics described may be combined in any one or more embodiments or examples in a suitable manner. In addition, those skilled in the art may combine and combine different embodiments or examples described in this specification and the features of different embodiments or examples, unless they are contradictory.

[0158] In addition, the terms "first" and "second" are used for descriptive purposes only and should not be understood as indicating or implying relative importance or implicitly indicating the number of technical features indicated. Therefore, a feature defined as "first" or "second" may explicitly or implicitly include at least one of the features. In the description of this application, the meaning of "plurality" is two or more, unless otherwise clearly and specifically defined.

[0159] Any process or method described in the flow chart or otherwise described herein can be understood as a module, fragment or portion of a code representing one or more executable instructions for implementing the steps of a specific logical function or process. And the scope of the preferred embodiment of the present application includes other implementations, in which the functions may not be performed in the order shown or discussed, including in a substantially simultaneous manner or in a reverse order according to the functions involved.

[0160] The logic and / or steps described in the flowchart or otherwise described herein, for example, can be considered as an ordered list of executable instructions for implementing logical functions, which can be specifically implemented in any computer-readable medium for use by an instruction execution system, device or apparatus (such as a computer-based system, a system including a processor, or other system that can fetch instructions from an instruction execution system, device or apparatus and execute instructions), or used in combination with these instruction execution systems, devices or apparatuses.

[0161] It should be understood that the various parts of the present application can be implemented with hardware, software, firmware or a combination thereof. In the above embodiments, multiple steps or methods can be implemented with software or firmware stored in a memory and executed by a suitable instruction execution system. All or part of the steps of the above embodiment method can be completed by instructing the relevant hardware through a program, which can be stored in a computer-readable storage medium, and when the program is executed, it includes one of the steps of the method embodiment or a combination thereof.

[0162] In addition, each functional unit in each embodiment of the present application can be integrated into a processing module, or each unit can exist physically separately, or two or more units can be integrated into one module. The above-mentioned integrated module can be implemented in the form of hardware or in the form of a software functional module. If the above-mentioned integrated module is implemented in the form of a software functional module and sold or used as an independent product, it can also be stored in a computer-readable storage medium. The storage medium can be a read-only memory, a disk or an optical disk, etc.

[0163] The above is only an exemplary embodiment of the present application, but the protection scope of the present application is not limited thereto. Any technician familiar with the technical field can easily think of various changes or substitutions within the technical scope recorded in the present application, which should be included in the protection scope of the present application. Therefore, the protection scope of the present application shall be based on the protection scope of the claims.

Claims

1. A display method, comprising: Call the holder of the drawing surface to obtain the locked canvas object, wherein the holder of the drawing surface is obtained by passing when creating the wallpaper engine; In response to the electronic device switching from a first state to a second state, obtaining stroke parameters of one or more characters displayed in the first state, wherein the first state is a screen-off state; Creating a plurality of stroke layers corresponding to the stroke parameters based on the locked canvas object, wherein the plurality of stroke layers are located at different view levels; Using the stroke parameters to draw the strokes in the corresponding stroke layer; and During the process of the electronic device switching from the first state to the second state, the process of adjusting the multiple strokes of the one or more characters that have been drawn is displayed on the wallpaper of the electronic device.

2. According to the method of claim 1, the second state is a lock screen state; the process of displaying and adjusting the multiple strokes of the one or more characters drawn on the wallpaper of the electronic device comprises: Obtaining a stroke screen-off position and a stroke screen-lock position, wherein the stroke screen-off position indicates the position of the stroke on the wallpaper of the electronic device in the screen-off state, and the stroke screen-lock position indicates the position of the stroke on the wallpaper of the electronic device and / or outside the electronic device in the screen-lock state; Based on the switching duration from the screen-off state to the screen-locked state, the multiple strokes are moved from the stroke screen-off position to the stroke screen-locked position, wherein the multiple strokes are enlarged during the movement.

3. The method according to claim 2, further comprising: In response to the electronic device switching from the lock screen state to the screen off state, based on the switching duration from the lock screen state to the screen off state, the multiple strokes are moved from the stroke lock screen position to the stroke screen off position, wherein the multiple strokes are reduced during the movement.

4. The method according to claim 2, further comprising: Converting the stroke parameters into a stroke path, and determining a center trajectory point path based on the stroke path; In response to the electronic device switching from the lock screen state to the desktop state, generating first copying data of the plurality of strokes according to the switching duration from the lock screen state to the desktop state and the center track point path, wherein the first copying data is configured to indicate displaying a copying effect on the plurality of strokes during the process of the electronic device switching from the lock screen state to the desktop state; In response to the electronic device switching from the desktop state to the lock screen state, generating second copying data of the plurality of strokes according to the switching duration from the desktop state to the lock screen state and the center track point path, wherein the second copying data is configured to indicate displaying a copying effect on the plurality of strokes during the process of the electronic device switching from the desktop state to the lock screen state, and the second copying data has the same copying direction as the first copying data; and After switching to the desktop state, the multiple strokes are enlarged and reduced according to a given cycle, and the multiple strokes are controlled to approach and move away from the center of the screen for displaying the wallpaper according to the cycle.

5. The method according to claim 1, wherein: The second state is a desktop state; the process of displaying and adjusting the multiple strokes of the one or more characters drawn on the wallpaper of the electronic device includes: Converting the stroke parameters into a stroke path, and determining a center trajectory point path based on the stroke path; Obtaining a stroke screen-off position and a stroke desktop position, wherein the stroke screen-off position indicates the position of the stroke on the wallpaper of the electronic device in the screen-off state, and the stroke desktop position indicates the position of the stroke on the wallpaper of the electronic device and / or outside the electronic device in the desktop state; According to the switching time from the screen-off state to the desktop state, moving the plurality of strokes from the stroke screen-off position to the stroke desktop position; The third copying data of the plurality of strokes is generated according to the switching time from the screen-off state to the desktop state and the path of the center track point, wherein the third copying data is configured to indicate displaying the copying effect on the plurality of strokes during the process of the electronic device switching from the screen-off state to the desktop state; After switching to the desktop state, the multiple strokes are enlarged and reduced according to a given cycle, and the multiple strokes are controlled to approach and move away from the center of the screen for displaying the wallpaper according to the cycle.

6. The method according to claim 5, further comprising: In response to the electronic device switching from the desktop state to the screen-off state, the plurality of strokes are moved from the stroke desktop position to the stroke screen-off position according to the switching duration from the desktop state to the screen-off state; as well as The fourth copying data of the multiple strokes is generated according to the switching duration from the desktop state to the screen-off state and the center trajectory point path, wherein the fourth copying data is configured to indicate displaying the copying effect on the multiple strokes when the electronic device switches from the desktop state to the screen-off state, and the fourth copying data has the same copying direction as the third copying data.

7. The method according to claim 4 or 5, wherein: Determining a center trajectory point path based on the stroke path includes: Based on the stroke path, determining an initial starting point position and an initial end point position of the center track point path, and determining an extension direction of the starting point and an extension direction of the end point; The position corresponding to the starting point position after being extended by a specified length in the extension direction of the starting point is used as the updated starting point position of the path, and the position corresponding to the ending point position after being extended by a specified length in the extension direction of the ending point is used as the updated ending point position of the path; The center track point path is determined based on the updated starting point position, the updated end point position and the stroke path.

8. The method according to claim 1, wherein: Call the drawing surface holder to get the canvas object, including: In response to a state switch of the electronic device, obtaining a rendering duration corresponding to the state switch; Submitting a rendering task, and determining the number of animation frames generated by rendering within the rendering duration according to the rendering frame rate of the electronic device and the rendering duration; The holder of the drawing surface is called once to obtain the locked canvas object each time a rendering is requested to generate an animation frame; The rendering task is removed after the rendering duration.

9. An electronic device, comprising a memory, a processor, and a computer program stored in the memory, wherein the processor implements the method according to any one of claims 1 to 8 when executing the computer program.

10. A computer-readable storage medium, wherein a computer program is stored in the computer-readable storage medium, and when the computer program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.

Images