Wallpaper editing methods, electronic devices and storage media
By obtaining the display area information of the lock screen wallpaper page and the position information of the candidate images, the position or size of the foreground objects in the wallpaper is automatically adjusted, solving the problem of tedious manual adjustment for users and improving the user experience.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2024-01-10
- Publication Date
- 2026-04-03
AI Technical Summary
When users choose wallpapers for their electronic devices, they need to manually adjust the position or size of the main object in the image on the lock screen or desktop multiple times, which is cumbersome and affects the user experience.
This paper provides a wallpaper editing method that automatically adjusts the position or size of foreground objects in the image on the lock screen or desktop by obtaining the display area information of the lock screen wallpaper page and the position information of the candidate images, thus simplifying user operation.
It automatically adjusts wallpaper effects, reducing user steps and improving user experience.
Smart Images

Figure CN120335681B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of terminal technology, and in particular to a wallpaper editing method, electronic device, and storage medium. Background Technology
[0002] With the continuous development of terminal technology, electronic devices such as mobile phones and tablets are becoming increasingly popular, bringing great convenience to people's daily lives. Users can set wallpapers for the lock screen and desktop of their electronic devices to enhance their aesthetics. However, currently, when users select an image from their electronic device's gallery as wallpaper, they need to manually adjust the position or size of the main subject (also known as the foreground object) on the lock screen or desktop multiple times to achieve the best wallpaper effect. This process is cumbersome and negatively impacts the user experience. Summary of the Invention
[0003] This application provides a wallpaper editing method, electronic device, and storage medium that can automatically adjust the position or size of foreground objects in an image on the lock screen or desktop, reducing user operations and improving user experience. The technical solution is as follows:
[0004] Firstly, a wallpaper editing method is provided, which includes:
[0005] Displays the lock screen wallpaper page, which includes a button to change the image;
[0006] In response to the operation of the "Change Image" button, obtain the position information of the candidate images and the first display area of the lock screen wallpaper page. The candidate images include foreground objects.
[0007] Based on the location information of the first display area and the candidate image, the location information of the first area is obtained. The first area includes a foreground object, and the aspect ratio of the first area is the same as that of the first display area.
[0008] Based on the location information of the first display area and the location information of the first region, the candidate images are adjusted to obtain the first display image corresponding to the candidate images;
[0009] The first image corresponding to the candidate image is displayed in the first display area.
[0010] In this embodiment, the electronic device can obtain the position information of the candidate image and the first display area of the lock screen wallpaper page after responding to the user's operation of the "Change Image" button. Then, based on the position information of the first display area and the candidate image, it obtains the position information of the first area. Subsequently, it adjusts the candidate image according to the position information of the first display area and the first area. Compared to when the user selects an image from the electronic device's gallery as wallpaper, which requires the user to manually adjust the position or size of the foreground object in the image on the lock screen or desktop multiple times, this embodiment can adjust the candidate image according to the position information of the first display area and the first area, thereby automatically adjusting the position or size of the foreground object in the image on the lock screen or desktop, simplifying user operation, and displaying a better wallpaper effect, thus improving the user experience.
[0011] In conjunction with the first aspect, in certain implementations of the first aspect, the candidate image is adjusted based on the position information of the first display area and the position information of the first region to obtain the first display image corresponding to the candidate image, including:
[0012] Based on the position information of the first display area and the position information of the first region, determine the offset information and scaling ratio information of the first region relative to the first display area;
[0013] Based on offset and scaling information, the candidate images are adjusted to obtain the first display image corresponding to the candidate images.
[0014] In conjunction with the first aspect, in certain implementations of the first aspect, the location information of the first display area is obtained based on the location information of the first display area and the candidate images, including:
[0015] Obtain the position information of the clock frame in the clock layer;
[0016] The position information of the first display area is obtained based on the position information of the candidate image and the clock frame.
[0017] In conjunction with the first aspect, in some implementations of the first aspect, the method further includes:
[0018] The candidate images are processed to generate the first cutout image;
[0019] Based on the location information of the first display area and the location information of the first region, the first cutout image is adjusted to obtain the first display image corresponding to the first cutout image;
[0020] The first display area displays the first image corresponding to the first cutout image.
[0021] In conjunction with the first aspect, in some implementations of the first aspect, the currently used lock screen wallpaper file includes multiple decorative layers with frame effects, and the method further includes:
[0022] Obtain the position information of the security lines on images in multiple decoration layers;
[0023] Based on the location information of the first display area and the first display image corresponding to the first cutout image, determine the target security lines that are mapped to the first mapping area for multiple security lines, and generate the location information of the target security lines.
[0024] Based on the location information of the target safety line, determine the number of the first pixels on the target safety line, and the pixel value of the first pixel is zero;
[0025] If the number of first pixels is greater than the first threshold, the candidate image is adjusted based on the position information of the transparent areas on the images of multiple decorative layers to obtain the second display image corresponding to the candidate image.
[0026] The second display image corresponding to the candidate image is displayed in the transparent area on the image of multiple decorative layers.
[0027] In conjunction with the first aspect, in certain implementations of the first aspect, based on the location information of the first display area and the first display image corresponding to the first cutout image, target security lines that map multiple security lines to the first mapping area are determined, and the location information of the target security lines is generated, including:
[0028] Based on the location information of the first display area and the first display image corresponding to the first cutout image, determine the first mapping area that the first display area is mapped onto the first display image corresponding to the first cutout image, and generate the location information of the first mapping area. The first mapping area includes the foreground object in the first display image corresponding to the first cutout image.
[0029] Based on the location information of multiple safety lines and the location information of the first mapping area, the target safety line mapped from the multiple safety lines to the first mapping area is determined, and the location information of the target safety line is generated.
[0030] In conjunction with the first aspect, in certain implementations of the first aspect, when it is determined that the number of first pixels is greater than a first threshold, the candidate image is adjusted based on the position information of the transparent areas on the images of multiple decorative layers to obtain the second display image corresponding to the candidate image, including:
[0031] If the number of first pixels is greater than the first threshold, the position information of the second display area of the lock screen wallpaper page is determined based on the position information of the transparent areas on the images of multiple decorative layers.
[0032] Based on the second display area and the candidate image, the position information of the second area is obtained. The second area includes the foreground object of the candidate image, and the aspect ratio of the second area is the same as that of the second display area.
[0033] Based on the location information of the second display area and the second region, the candidate image is adjusted to obtain the second display image corresponding to the candidate image;
[0034] Display the second display image corresponding to the candidate image in the transparent area on the image with multiple decorative layers, including:
[0035] The second display area displays the second image corresponding to the candidate image.
[0036] Secondly, a wallpaper editing method is provided, which includes:
[0037] Display the lock screen wallpaper page;
[0038] In response to operations on the lock screen wallpaper page, obtain the third display image of the original layer, the third display image of the cut-out layer, the first position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame in the clock layer;
[0039] Based on the position information of the third display image of the cutout layer, the first display area of the lock screen wallpaper page, and the position information of the clock frame, generate the position information of the third mapping area;
[0040] The visibility of the cutout layer is determined based on the location information of the third mapping area and the foreground object of the third display image of the cutout layer.
[0041] If the visibility of the cutout layer is already visible, set the visibility of the cutout layer to visible.
[0042] The third display image of the original layer and the third display image of the cutout layer are displayed in the first display area of the lock screen wallpaper page.
[0043] In this embodiment, the electronic device can respond to operations on the lock screen wallpaper page by generating position information of a third mapping area based on the position information of the third display image of the cutout layer, the first display area of the lock screen wallpaper page, and the position information of the clock frame. Based on the position information of the third mapping area and the foreground object of the third display image of the cutout layer, the visibility of the cutout layer is determined. When the cutout layer is visible, a depth-of-field effect can be displayed when the cutout layer and the clock layer are superimposed. In other words, during user operations on the lock screen wallpaper page, the electronic device can display a depth-of-field effect in real time based on user actions, thus improving the user experience.
[0044] In conjunction with the second aspect, in some implementations of the second aspect, the position information of the third mapping area is generated based on the position information of the third display image of the cut-out layer, the first display area of the lock screen wallpaper page, and the position information of the clock frame, including:
[0045] Based on the position information of the third display image of the cutout layer and the first display area of the lock screen wallpaper page, determine the second mapping area of the first display area of the lock screen wallpaper page mapped to the third display image of the cutout layer, and generate the position information of the second mapping area, which includes the foreground object of the third display image of the cutout layer.
[0046] Based on the position information of the clock frame and the position information of the second mapping area, determine the third mapping area to which the clock frame is mapped from the second mapping area, and generate the position information of the third mapping area.
[0047] In conjunction with the second aspect, in some implementations of the second aspect, the visibility of the cutout layer is determined based on the position information of the third mapping region and the foreground object of the third display image of the cutout layer, including:
[0048] Based on the location information of the third mapping region, determine the location information of the line connecting the midpoints of the short sides of the third mapping region;
[0049] Based on the position information of the line connecting the midpoints of the short sides of the third mapping region, determine the number of first pixels on the line connecting the midpoints of the short sides of the third mapping region, and the pixel value of the first pixel is zero.
[0050] If the number of first pixels is less than the second threshold, the visibility of the cutout layer is determined to be visible.
[0051] In conjunction with the second aspect, in some implementations of the second aspect, the currently used lock screen wallpaper file includes multiple decorative layers with frame effects, and the method also includes:
[0052] Obtain the position information of the security lines on images in multiple decoration layers;
[0053] Based on the position information of the first display area of the lock screen wallpaper page and the third display image of the cutout layer, determine the fourth mapping area of the first display area of the lock screen wallpaper page mapped to the third display image of the cutout layer, and generate the position information of the fourth mapping area, which includes the foreground object in the third display image of the cutout layer.
[0054] Based on the location information of multiple safety lines and the location information of the fourth mapping area, determine the target safety line that the multiple safety lines are mapped to the fourth mapping area, and generate the location information of the target safety line;
[0055] Based on the location information of the target safety line, determine the number of the first pixels on the target safety line, and the pixel value of the first pixel is zero;
[0056] If the number of first pixels is greater than the first threshold, the visibility of the cutout layer is determined to be visible, and the visibility of the cutout layer is set to visible.
[0057] The third display image of the original layer and the third display image of the cutout layer are displayed in the first display area of the lock screen wallpaper page.
[0058] Thirdly, an electronic device, comprising: one or more processors, and a memory;
[0059] The memory is coupled to one or more processors, and the memory is used to store computer program code, which includes computer instructions. One or more processors invoke the computer instructions to cause the electronic device to perform the method as described in either the first or second aspect.
[0060] Fourthly, a chip system applied to an electronic device, the chip system including one or more processors, the one or more processors being configured to invoke computer instructions to cause the electronic device to perform a method as described in either the first or second aspect.
[0061] Fifthly, a computer-readable storage medium includes instructions that, when executed on an electronic device, cause the electronic device to perform a method as described in either the first or second aspect. Attached Figure Description
[0062] Figure 1 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application;
[0063] Figure 2 This is a schematic diagram of a multi-layer structure provided in an embodiment of this application;
[0064] Figure 3 This is a schematic diagram of a different type of layer provided in an embodiment of this application;
[0065] Figure 4 This is a schematic diagram of a lock screen wallpaper provided in an embodiment of this application;
[0066] Figure 5 This is a schematic diagram of a wallpaper provided in an embodiment of this application;
[0067] Figure 6 This is a layer hierarchy diagram provided in an embodiment of this application;
[0068] Figure 7 This is a schematic diagram of a wallpaper editing interface provided in an embodiment of this application;
[0069] Figure 8 This is a schematic diagram illustrating an example of entering a wallpaper editing interface provided in this application embodiment;
[0070] Figure 9 This is a schematic diagram illustrating another way to enter the wallpaper editing interface provided in an embodiment of this application;
[0071] Figure 10 This is a schematic diagram illustrating the selection of a wallpaper template according to an embodiment of this application;
[0072] Figure 11 This is a schematic diagram of setting a clock according to an embodiment of this application;
[0073] Figure 12 This is a schematic diagram of a decorative element provided in an embodiment of this application;
[0074] Figure 13 This is a schematic diagram illustrating a depth-of-field effect provided in an embodiment of this application;
[0075] Figure 14 This is a schematic diagram illustrating an embodiment of image replacement provided in this application;
[0076] Figure 15 This is a schematic diagram illustrating image scaling and movement provided in an embodiment of this application;
[0077] Figure 16 This is a schematic diagram illustrating how to set a lock screen wallpaper according to an embodiment of this application;
[0078] Figure 17 This is a schematic diagram of a screen lock following an embodiment of this application;
[0079] Figure 18 This is a schematic diagram illustrating a color setting method provided in an embodiment of this application;
[0080] Figure 19 This is a schematic diagram of the implementation environment involved in a wallpaper editing method provided in an embodiment of this application;
[0081] Figure 20 This is a technical architecture diagram of a wallpaper editing module provided in an embodiment of this application;
[0082] Figure 21 This is a flowchart of a wallpaper editing method provided in an embodiment of this application;
[0083] Figure 22 This is a schematic diagram of a display area provided in an embodiment of this application;
[0084] Figure 23 This is a schematic diagram of a target area provided in an embodiment of this application;
[0085] Figure 24 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0086] Figure 25 This is a schematic diagram of a JSON file provided in an embodiment of this application;
[0087] Figure 26 This is a schematic diagram of another target area provided in an embodiment of this application;
[0088] Figure 27 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0089] Figure 28 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0090] Figure 29 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0091] Figure 30 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0092] Figure 31 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0093] Figure 32 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0094] Figure 33 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0095] Figure 34 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0096] Figure 35 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0097] Figure 36 This is a flowchart of another wallpaper editing method provided in the embodiments of this application;
[0098] Figure 37 This is a schematic diagram of another display area provided in an embodiment of this application. Detailed Implementation
[0099] In the following description, specific details such as particular system architectures and technologies are set forth for illustrative purposes and not for limiting purposes, in order to provide a thorough understanding of the embodiments of this application. However, those skilled in the art will understand that this application may also be implemented in other embodiments without these specific details.
[0100] It should be understood that, when used in this specification and the appended claims, the term "comprising" indicates the presence of the described features, integrals, steps, operations, elements, and / or components, but does not exclude the presence or addition of one or more other features, integrals, steps, operations, elements, components, and / or collections thereof. The terms "comprising," "including," "having," and variations thereof all mean "including but not limited to," unless otherwise specifically emphasized.
[0101] It should be understood that "one or more" as mentioned in this application refers to one, two, or more, and "multiple" as mentioned in this application refers to two or more. In the description of this application, unless otherwise stated, " / " means "or," for example, A / B can mean A or B. The "and / or" in this document is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can represent: A existing alone, A and B existing simultaneously, and B existing alone.
[0102] Furthermore, to facilitate a clear description of the technical solutions of this application, the terms "first" and "second" are used to distinguish identical or similar items with essentially the same function and effect. Those skilled in the art will understand that the terms "first" and "second" do not limit the quantity or execution order, and that the terms "first" and "second" do not necessarily imply that they are different.
[0103] The terms "one embodiment" or "some embodiments" used in this application mean that one or more embodiments of this application include the specific features, structures, or characteristics described in that embodiment. Therefore, the phrases "in one embodiment," "in some embodiments," "in other embodiments," "in still other embodiments," etc., appearing in different parts of this application do not necessarily refer to the same embodiment, but rather mean "one or more, but not all, embodiments," unless otherwise specifically emphasized.
[0104] The wallpaper editing method provided in this application can be applied to electronic devices. These electronic devices can be mobile phones, tablets, wearable devices, digital cameras, in-vehicle devices, augmented reality (AR) devices, virtual reality (VR) devices, laptops, ultra-mobile personal computers (UMPCs), netbooks, personal digital assistants (PDAs), laptops, etc., and this application does not limit the specific type of device.
[0105] Figure 1 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application. See also... Figure 1 The electronic device 100 may include a processor 110, an external memory interface 120, an internal memory 121, a universal serial bus (USB) interface 130, a charging management module 140, a power management module 141, a battery 142, an antenna 1, an antenna 2, a mobile communication module 150, a wireless communication module 160, an audio module 170, a speaker 170A, a receiver 170B, a microphone 170C, a headphone jack 170D, a sensor module 180, buttons 190, a motor 191, an indicator 192, a camera 193, a display screen 194, and a subscriber identification module (SIM) card interface 195, etc. The sensor module 180 may include a pressure sensor 180A, a gyroscope sensor 180B, a barometric pressure sensor 180C, a magnetic sensor 180D, an accelerometer sensor 180E, a distance sensor 180F, a proximity sensor 180G, a fingerprint sensor 180H, a temperature sensor 180J, a touch sensor 180K, an ambient light sensor 180L, a bone conduction sensor 180M, etc.
[0106] It is understood that the structures illustrated in the embodiments of this application do not constitute a specific limitation on the electronic device 100. In other embodiments of this application, the electronic device 100 may include more or fewer components than illustrated, or combine some components, or split some components, or have different component arrangements. The illustrated components may be implemented in hardware, software, or a combination of software and hardware.
[0107] Processor 110 may include one or more processing units, such as: application processor (AP), modem processor, graphics processing unit (GPU), image signal processor (ISP), controller, memory, video codec, digital signal processor (DSP), baseband processor, and / or neural network processing unit (NPU), etc. Different processing units may be independent devices or integrated into one or more processors.
[0108] The controller can be the nerve center and command center of the electronic device 100. The controller can generate operation control signals according to the instruction opcode and timing signals to complete the control of fetching and executing instructions.
[0109] The processor 110 may also include a memory for storing instructions and data. In some embodiments, the memory in the processor 110 is a cache memory. This memory can store instructions or data that the processor 110 has just used or that are used repeatedly. If the processor 110 needs to use the instruction or data again, it can retrieve it directly from this memory. This avoids repeated accesses, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.
[0110] The external storage interface 120 can be used to connect an external memory card, such as a Micro SD card, to expand the storage capacity of the electronic device 100. The external memory card communicates with the processor 110 through the external storage interface 120 to perform data storage functions, such as saving music, video, and other files on the external memory card.
[0111] Internal memory 121 can be used to store computer-executable program code, which includes instructions. Processor 110 executes various functional applications and data processing of electronic device 100 by running the instructions stored in internal memory 121. Internal memory 121 may include a program storage area and a data storage area. The program storage area may store the operating system, at least one application program required for a function (such as sound playback, image playback, etc.), etc. The data storage area may store data created by electronic device 100 during use (such as audio data, phonebook, etc.). Furthermore, internal memory 121 may include high-speed random access memory, and may also include non-volatile memory, such as at least one disk storage device, flash memory device, universal flash storage (UFS), etc.
[0112] The wireless communication function of electronic device 100 can be realized through antenna 1, antenna 2, mobile communication module 150, wireless communication module 160, modem processor and baseband processor, etc.
[0113] Electronic device 100 can implement audio functions, such as music playback and recording, through audio module 170, speaker 170A, receiver 170B, microphone 170C, headphone jack 170D and application processor.
[0114] Electronic device 100 can perform shooting functions through ISP, camera 193, video codec, GPU, display 194 and application processor.
[0115] Electronic device 100 implements display functions through GPU, display screen 194, and application processor.
[0116] The GPU is a microprocessor for image processing, connected to the display screen 194 and the application processor. The GPU performs mathematical and geometric calculations for graphics rendering. The processor 110 may include one or more GPUs, which execute program instructions to generate or modify display information. The display screen 194 is used to display images, videos, etc.
[0117] Touch sensor 180K, also known as a "touch panel," can be located on display screen 194. The touch sensor 180K and display screen 194 together form a touchscreen, also known as a "touch display." Touch sensor 180K detects touch operations applied to or near it. Touch sensor 180K can transmit the detected touch operation to the application processor to determine the type of touch event. Visual output related to the touch operation can be provided through display screen 194. In other embodiments, touch sensor 180K may also be located on the surface of electronic device 100, in a different position than display screen 194.
[0118] This application does not specifically limit the structure of the execution subject of the wallpaper editing method. As long as the code containing the wallpaper editing method provided in this application is run, the wallpaper editing method can be processed according to the wallpaper editing method provided in this application. For example, the execution subject of the wallpaper editing method provided in this application can be a functional module in an electronic device that can call and execute a program, or it can be a processing device applied in an electronic device, such as a chip.
[0119] The wallpapers involved in the wallpaper editing method provided in the embodiments of this application will be described next.
[0120] The wallpaper in this application embodiment may include multiple layers. The layers described in this application embodiment may also be referred to as views.
[0121] These multiple layers have a hierarchical relationship, which refers to the vertical relationship between the layers when they are displayed. Generally, a layer above will partially or completely obscure the layers below it when displayed.
[0122] Figure 2 This is a schematic diagram of multiple layers provided in an embodiment of this application. These multiple layers can be divided into various types.
[0123] For example, such as Figure 2 As shown, these multiple layers can include five types of layers: original layer, color background layer, decoration layer, clock layer, and cutout layer.
[0124] Generally, the original layer is at the bottom. The color background layer is below the decoration layer, clock layer, and cutout layer. The decoration layer's layer level can be below the clock layer and cutout layer in some cases, and above them in others. The clock layer's layer level can be below the cutout layer.
[0125] The image in the original layer can be referred to as the main image. For example, the main image could be an image selected by the user, such as one chosen from their gallery or from preset images on their electronic device. Alternatively, the main image could be the image from the original layer of a wallpaper template chosen by the user from multiple preset wallpaper templates on their electronic device. For instance, the original layer could be... Figure 3 The layer shown in Figure (a) is shown in the image.
[0126] The image in the color background layer is an image that has a certain color overall. For example, the color of this image can be a solid color or a gradient. For instance, the color background layer could be... Figure 3The layer shown in Figure (b) can have a solid color background.
[0127] The decorative layer image is an image that can decorate the main image. For example, the image can be an image with a frame effect, an image containing text, an image with a certain texture, or an image with a mask effect, etc., and this application embodiment does not limit this. For example, the decorative layer can be... Figure 3 The layer shown in Figure (c) or Figure (d) in the diagram. Figure 3 The decorative layer shown in Figure (c) is... Figure 3 The decorative layers shown in Figure (d) can create a frame effect when overlaid.
[0128] The clock layer is a layer used to display the time, which can be the system time of an electronic device. For example, this clock layer could be... Figure 3 The layer shown in Figure (e) is shown in the diagram.
[0129] The image to be cut out can be obtained from the image of the original layer. For example, the image to be cut out can be an image of the foreground object in the image of the original layer. In some embodiments, the foreground object can be extracted from the image of the original layer based on object information and edge information. For example, if the original layer is... Figure 3 In the case of the layer shown in Figure (a), the cutout layer can be Figure 3 The layer shown in Figure (f) is shown in the diagram.
[0130] In practical applications, Figure 2 The layer hierarchy shown is not unique and can be changed according to the actual situation, or the layers can be deployed according to the wallpaper editing function of the electronic device. Furthermore, in practical applications, the layer types are not limited to... Figure 2 The five types shown can be customized to other types as needed.
[0131] The wallpaper in this application embodiment may include one or more types of layers, and in some cases may also include one or more decorative layers.
[0132] For example, desktop wallpapers may include the original layer.
[0133] For example, the lock screen wallpaper, from bottom to top, can include: the original layer, the clock layer, etc. For instance, the lock screen wallpaper could be... Figure 4 The wallpaper shown in Figure (a) includes... Figure 3 The original layer shown in Figure (a) and Figure 3 The clock layer is shown in Figure (e).
[0134] Alternatively, the lock screen wallpaper can include, from bottom to top, the following layers: the original layer, the color background layer, the clock layer, and the cutout layer. For example, the lock screen wallpaper could be... Figure 4 The wallpaper shown in Figure (b) includes... Figure 3 The original layer shown in Figure (a) is... Figure 3 The color background layer shown in Figure (b) is... Figure 3 The clock layer shown in Figure (e) is... Figure 3 The cutout layer is shown in Figure (f).
[0135] Alternatively, the lock screen wallpaper can include, from bottom to top, the following layers: original layer, decoration layer 1, clock layer, and decoration layer 2. For example, the lock screen wallpaper could be... Figure 4 The wallpaper shown in Figure (c) includes... Figure 3 The original layer shown in Figure (a) is... Figure 3 The decorative layer shown in Figure (c) is... Figure 3 The clock layer shown in Figure (e) is... Figure 3 The decorative layer shown in Figure (d) is shown in the diagram.
[0136] Alternatively, the lock screen wallpaper can include, from bottom to top, the following layers: original layer, decoration layer 1, clock layer, cutout layer, and decoration layer 2. For example, the lock screen wallpaper could be... Figure 4 The wallpaper shown in figure (d) includes... Figure 3 The original layer shown in Figure (a) is... Figure 3 The decorative layer shown in Figure (c) is... Figure 3 The clock layer shown in Figure (e) is... Figure 3 The cutout layer shown in Figure (f) is... Figure 3 The decorative layer shown in Figure (d) is shown in the diagram.
[0137] Compared to Figure 4 The wallpaper shown in figure (c) is... Figure 4 The wallpaper shown in Figure (d) can create a sense of depth through the interaction of the original layer, the decorative layer, the clock layer, and the cutout layer. In this embodiment, this effect is referred to as the depth-of-field effect.
[0138] Of course, in addition to the examples above, various types of layers can be flexibly combined in other ways to obtain lock screen wallpapers with better visual effects. This application embodiment does not limit this.
[0139] It should be noted that the above text Figure 3 and Figure 4 This is merely an illustrative description of layers and wallpapers and does not constitute a limitation on the embodiments of this application.
[0140] As can be seen from the above, the wallpaper in this embodiment can be obtained by overlaying multiple layers according to their hierarchical relationship. For example, by... Figure 5 By processing the main image shown in Figure (a), we can obtain... Figure 5 The wallpaper shown in Figure (b) can include... Figure 6 The seven layers shown in Figure (a) are: Original Layer, Decoration Layer 1, Decoration Layer 2, Clock Layer, Cutout Layer, Decoration Layer 3, and Decoration Layer 4, with their layer hierarchy from lowest to highest as: 1, 2, 3, 4, 5, 6, and 7. This wallpaper features rich visual elements and can meet the personalized needs of users.
[0141] In some embodiments, such as Figure 6 As shown in Figure (b), the layer has positional information, which can be represented by coordinates (x, y, z). Here, (x, y) represents the center position of the layer. And (z) indicates the layer's hierarchy within all layers of the wallpaper. It can be seen that in... Figure 6 In the seven layers shown, the Z-values of the layers increase sequentially from the leftmost layer to the rightmost layer.
[0142] The wallpaper editing function provided in this application embodiment can edit various types of layers included in the wallpaper. For example, for the original layer, it can be scaled, moved, blurred, etc.; for the color background layer, its color can be adjusted, etc.; for the decorative layer, its style and color can be adjusted, etc.; for the clock layer, its font and color can be adjusted, etc.; for the cutout layer, its depth of field effect can be adjusted, etc.
[0143] The wallpaper editing function provided in this application embodiment can be implemented based on the wallpaper editing interface, which will be described below.
[0144] Figure 7 This is a schematic diagram of a wallpaper editing interface provided in an embodiment of this application. See also... Figure 7 The wallpaper editing interface 700 may include function buttons, a lock screen wallpaper page 702, and a desktop wallpaper page 703.
[0145] Function buttons may include main function buttons, such as the back button 70 and the apply button 71. Function buttons may also include buttons for editing wallpapers, which provide various editing functions.
[0146] Lock screen wallpaper page 702 is used to preview the edited lock screen wallpaper. Lock screen wallpaper refers to the wallpaper displayed on the lock screen.
[0147] Desktop wallpaper page 703 is a page used to preview the edited desktop wallpaper. Desktop wallpaper refers to the wallpaper displayed on the desktop after the electronic device is unlocked. Optionally, desktop wallpaper page 703 can also display thumbnails of the desktop content, thus providing a better preview of the desktop wallpaper's display effect.
[0148] Lock screen wallpaper page 702 and desktop wallpaper page 703 can exist in a paginated format, and the two can be switched by swiping. For example, in Figure 7 The wallpaper editing interface 700 shown in Figure (a) displays a lock screen wallpaper page 702. After the user swipes left in the wallpaper editing interface 700, as shown... Figure 7 As shown in Figure (b), the wallpaper editing interface 700 can display the desktop wallpaper page 703. Afterwards, the user... Figure 7 In Figure (b), the wallpaper editing interface 700 is shown. After sliding to the right, as shown... Figure 7 As shown in Figure (a), the wallpaper editing interface 700 can display the lock screen wallpaper page 702.
[0149] For example, such as Figure 7 As shown in Figure (a), when the wallpaper editing interface 700 displays the lock screen wallpaper page 702, the wallpaper editing interface 700 can also display relevant function buttons for editing the lock screen wallpaper, such as the image change button 75, the lock screen style button 72, the personalized decoration button 73, the depth of field effect button 74, etc. This application embodiment does not limit this.
[0150] For example, such as Figure 7 As shown in Figure (b), when the wallpaper editing interface 700 displays the desktop wallpaper page 703, the wallpaper editing interface 700 can also display relevant function buttons for editing the desktop wallpaper, such as the follow lock screen button 76, the color button 77, the select wallpaper button 78, the blur button 79, etc. This application embodiment does not limit this.
[0151] In some embodiments, such as Figure 7 As shown, the wallpaper editing interface 700 may also include a mask 704. For example, the mask 704 may be a blurred mask, which is a mask obtained through blurring. In this case, the function button, the lock screen wallpaper page 702, and the desktop wallpaper page 703 can all be displayed on top of the mask 704.
[0152] For example, the mask 704 can be obtained by blurring the main image of the lock screen wallpaper displayed on the lock screen wallpaper page 702. Alternatively, the mask 704 can be obtained by blurring the desktop wallpaper displayed on the desktop wallpaper page 703. Of course, the mask 704 can also be obtained in other ways, such as by blurring a preset image, and this embodiment of the application does not limit this.
[0153] In some embodiments, the wallpaper editing interface 700 can be accessed from the lock screen or the desktop.
[0154] As an example, such as Figure 8 As shown in Figure (a), when the electronic device displays a lock screen interface 800, the user can perform a first gesture operation on the lock screen interface 800. Figure 8 (Taking the two-finger pinch gesture as an example). In response to the first gesture, the electronic device can display... Figure 8 The wallpaper editing interface 700 shown in Figure (b) displays a lock screen wallpaper page 702 and related function buttons for editing the lock screen wallpaper. In this case, the user can... Figure 8 The wallpaper editing interface shown in Figure (b) 700 is used to edit the lock screen wallpaper.
[0155] If users want to edit their desktop wallpaper, they can do so in [the following settings]. Figure 8 In the wallpaper editing interface 700 shown in Figure (b), swipe left, and then... Figure 8 As shown in Figure (c), the wallpaper editing interface 700 can display the desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper. In this case, the user can... Figure 8 The wallpaper editing interface 700 shown in Figure (c) is used to edit the desktop wallpaper.
[0156] As another example, such as Figure 9 As shown in Figure (a), when the electronic device displays desktop 900, the user can perform a second gesture operation on desktop 900. Figure 9 (Taking the two-finger pinch gesture as an example). In response to the second gesture, the electronic device displays... Figure 9 The desktop editing interface shown in Figure (b) displays buttons for editing the desktop, such as wallpaper buttons, card buttons, effect switching buttons, and desktop settings buttons. The user then clicks the wallpaper button in this interface. In response to this click, the electronic device can display... Figure 9 The wallpaper editing interface 700 shown in Figure (c) displays a desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper. In this case, the user can... Figure 9 The wallpaper editing interface 700 shown in Figure (c) is used to edit the desktop wallpaper.
[0157] If users want to edit the lock screen wallpaper, they can do so in... Figure 9 In the wallpaper editing interface 700 shown in Figure (c), slide to the right, and then... Figure 9As shown in Figure (d), the wallpaper editing interface 700 can display the lock screen wallpaper page 702 and related function buttons for editing the lock screen wallpaper. In this case, the user can... Figure 9 The wallpaper editing interface shown in Figure (d) 700 is used to edit the lock screen wallpaper.
[0158] The following section explains the specific process of editing lock screen wallpapers using the wallpaper editing interface 700.
[0159] This application provides lock screen wallpapers with features such as wallpaper templates, custom clocks, decorative settings, depth-of-field settings, image replacement, and image scaling. These features allow users to create personalized wallpapers.
[0160] As an example, electronic devices display such as Figure 10 After the wallpaper editing interface 700 shown in Figure (a) is completed, the user can click the lock screen style button 72. In response to this click, as shown... Figure 10 As shown in Figure (b), the electronic device can display a pop-up window 7011 from the bottom of the wallpaper editing interface 700. The pop-up window 7011 displays multiple wallpaper template options, and may further display image options from the gallery and some preset wallpaper image options. Assuming the user selects a wallpaper template from these multiple templates, in response to the selection of this wallpaper template, as shown... Figure 10 As shown in Figure (c), the electronic device can close the pop-up 7011 and display the wallpaper template on the lock screen wallpaper page 702.
[0161] As an example, electronic devices display such as Figure 11 After accessing the wallpaper editing interface 700 shown in Figure (a), the user can click on the clock frame 710 in the lock screen wallpaper page 702. In response to this click, as shown... Figure 11 As shown in Figure (b), the electronic device can display a pop-up window 7012 from the bottom of the wallpaper editing interface 700. Pop-up window 7012 displays multiple clock font options and multiple clock color options. Users can adjust the font of the clock in the lock screen wallpaper page 702 using these clock font options, and adjust the color of the clock in the lock screen wallpaper page 702 using these clock color options. Assuming the user selects a clock color, in response to the selection of this clock color, as shown... Figure 11 As shown in Figure (c), the electronic device can set the color of the clock in the wallpaper of lock screen wallpaper page 702 to this clock color, so that the user can view the clock display effect. Afterwards, if the user confirms that the clock settings are complete, then... Figure 11 As shown in Figure (c), the user can click the collapse button 712. In response to this click, as... Figure 11As shown in Figure (d), the electronic device can close pop-up 7012.
[0162] As an example, electronic devices display such as Figure 12 After viewing the wallpaper editing interface 700 shown in Figure (a), the user can click the "Personalize Decoration" button 73. In response to this click, as shown... Figure 12 As shown in Figure (b), the electronic device can display a pop-up window 7013 from the bottom of the wallpaper editing interface 700. The pop-up window 7013 displays multiple style options and multiple color options. Users can use these style options to adjust the style of the decorative elements in the wallpaper of the lock screen wallpaper page 702, and use these color options to adjust the color of the decorative elements in the wallpaper of the lock screen wallpaper page 702. Assuming the user selects a color, in response to the selection of that color, as follows... Figure 12 As shown in Figure (c), the electronic device can set the color of the decorative elements in the wallpaper of the lock screen wallpaper page 702 to this color, so that the user can view the display effect of the decorative elements. Afterwards, if the user confirms the completion of the decorative element settings, then as shown... Figure 12 As shown in Figure (c), the user can click the collapse button 713. In response to this click, as... Figure 12 As shown in Figure (d), the electronic device can close pop-up 7013.
[0163] As an example, electronic devices display such as Figure 13 After the wallpaper editing interface 700 shown in Figure (a) is completed, the user can click the depth-of-field effect button 74. In response to this click, as shown... Figure 13 As shown in Figure (b), the electronic device can display a pop-up window 7014 from the bottom of the wallpaper editing interface 700. The pop-up window 7014 displays a depth-of-field effect switch 7141, and can further display a background blur control 7142. Figure 13 (Taking a slider-style control as an example). Users can turn the depth-of-field effect of the wallpaper on the lock screen wallpaper page 702 on or off using the depth-of-field effect switch 7141, and adjust the blur of the background portion of the main image of the wallpaper on the lock screen wallpaper page 702 using the background blur control 7142. Assuming the user turns off the depth-of-field effect switch 7141, the response to turning off the depth-of-field effect switch 7141 is as follows: Figure 13 As shown in Figure (c), the electronic device can turn off the depth-of-field effect of the wallpaper on lock screen wallpaper page 702. Afterwards, if the user confirms that the depth-of-field setting is complete, then... Figure 13 As shown in Figure (c), the user can click the collapse button 7143. In response to this click, as... Figure 13 As shown in Figure (d), electronic devices can close pop-up 7014.
[0164] As an example, electronic devices display such as Figure 14 After the wallpaper editing interface 700 shown in Figure (a) is completed, the user can click the "Change Picture" button 75. In response to this click, as shown... Figure 14 As shown in Figure (b), the electronic device can display a pop-up window 7015 from the bottom of the wallpaper editing interface 700, which shows the picture options in the gallery. Assuming the user selects a picture from these pictures, in response to the selection, as shown... Figure 14 As shown in Figure (c), the electronic device can close pop-up 7015 and change the main image of the wallpaper on the lock screen wallpaper page 702 to this image.
[0165] As an example, users can zoom in or out on the main image of the wallpaper on lock screen wallpaper page 702, and can also move the position of that main image. For example, as Figure 15 As shown in Figure (a), assuming the user performs a two-finger zoom operation on the lock screen wallpaper page 702, the response to this two-finger zoom operation is as follows: Figure 15 As shown in Figure (b), the electronic device can zoom in on the main image of the wallpaper on the lock screen wallpaper page 702. For example, as... Figure 15 As shown in Figure (c), assuming the user performs a two-finger pinch-to-zoom operation on the lock screen wallpaper page 702, the response to this pinch-to-zoom operation is as follows: Figure 15 As shown in Figure (d), electronic devices can reduce the size of the main image of the wallpaper on lock screen wallpaper page 702. For example, as... Figure 15 As shown in Figure (e), assuming the user performs a scroll-down operation on wallpaper page 702, the response to this scroll-down operation is as follows: Figure 15 As shown in Figure (f), the electronic device can scroll down the main image of the wallpaper on the lock screen wallpaper page 702.
[0166] After editing the lock screen wallpaper using one or more of the methods described above, if the user determines that the wallpaper on the current lock screen wallpaper page 702 meets their needs, then... Figure 16 As shown in Figure (a), the user can click the Apply button 71 in the wallpaper editing interface 700. In response to this click, the electronic device can close the wallpaper editing interface 700, and, as... Figure 16 As shown in Figure (b), an electronic device can set the wallpaper of the lock screen wallpaper page 702 as the lock screen wallpaper of the lock screen interface 800.
[0167] Later, if the user wants to edit the wallpaper again while using the electronic device, then... Figure 17 As shown in Figure (a), the user can perform a first gesture operation on the lock screen 800. Figure 17 (Taking the two-finger pinch gesture as an example). In response to the first gesture, the electronic device can display... Figure 17The wallpaper editing interface 700 shown in Figure (b) displays a lock screen wallpaper page 702 and related function buttons for editing the lock screen wallpaper. At this time, the lock screen wallpaper page 702 displays the lock screen wallpaper that the user previously edited. In this case, the user can continue editing the previously edited lock screen wallpaper. For example, they can follow a similar... Figure 10 You can change the wallpaper template using the lock screen style button 72, or you can do it in a similar way. Figure 11 This method uses the clock frame 710 to reset the clock in the previously edited lock screen wallpaper, or you can follow a similar... Figure 12 This allows you to reset the style and color of the decorative elements in the previously edited lock screen wallpaper, or you can follow a similar method. Figure 13 This method allows you to change the depth-of-field effect and background blur in the previously edited lock screen wallpaper, or you can follow a similar approach. Figure 14 This is how you change the main image in the previously edited lock screen wallpaper, or you can follow a similar method. Figure 15 This allows you to zoom and / or move the main image in the lock screen wallpaper that was last edited.
[0168] The following section explains the specific process of editing desktop wallpapers using the 700 wallpaper editing interface.
[0169] This application provides desktop wallpapers with features such as following the lock screen, color settings, custom selection, blurring, and scaling. These features allow users to create personalized wallpapers.
[0170] As an example, electronic devices display such as Figure 18 Figure (a) shows a wallpaper editing interface 700, which displays a lock screen wallpaper page 702 and related function buttons for editing the lock screen wallpaper. The user swipes left in the wallpaper editing interface 700, and then... Figure 18 As shown in Figure (b), the wallpaper editing interface 700 displays the desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper. Assuming the user clicks the "Follow Lock Screen" button 76 in the wallpaper editing interface 700, the response to this click is as follows: Figure 18 As shown in Figure (c), the electronic device displays the main image of the wallpaper from the lock screen wallpaper page 702 on the desktop wallpaper page 703.
[0171] In some possible implementations, after the user clicks the "Follow Lock Screen" button 76 in the wallpaper editing interface 700, the desktop wallpaper page 703 enters the "Follow Lock Screen" state. In this case, any operation the user performs on the main image on the lock screen wallpaper page 702 will be synchronized to the desktop wallpaper page 703. Specifically, if the user zooms in on the main image on the lock screen wallpaper page 702, the wallpaper on the desktop wallpaper page 703 will zoom in accordingly; if the user zooms out on the main image on the lock screen wallpaper page 702, the wallpaper on the desktop wallpaper page 703 will zoom out accordingly; if the user moves the main image on the lock screen wallpaper page 702, the wallpaper on the desktop wallpaper page 703 will move accordingly.
[0172] As an example, electronic devices display such as Figure 19 After the wallpaper editing interface 700 shown in Figure (a) is completed, the user can click the color button 77. In response to this click, as shown... Figure 19 As shown in Figure (b), the electronic device can display a pop-up window 7016 from the bottom of the wallpaper editing interface 700. The pop-up window 7016 displays a gradient color switch 7161 and multiple color options. Users can set the desktop wallpaper to a solid color or a gradient color using the gradient color switch 7161, and users can set the color of the desktop wallpaper using these color options. Optionally, these multiple color options may include a smart color picker, the color of which corresponds to the background color of the main image of the wallpaper on the lock screen wallpaper page 702. Assuming the user selects a color, in response to this color selection operation, if the gradient color switch 7161 is off, as shown... Figure 19 As shown in Figure (c), the electronic device can display a solid color wallpaper of this color on the desktop wallpaper page 703, allowing the user to view the wallpaper display effect. Afterwards, if the user confirms the color setting is complete, then... Figure 19 As shown in Figure (c), the user can click the collapse button 7162. In response to this click, as... Figure 19 As shown in Figure (d), electronic devices can close pop-up 7016.
[0173] As an example, when the wallpaper editing interface 700 displays the desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper, the user can select an image from the gallery or preset wallpaper images on the electronic device using the select wallpaper button 78 in the wallpaper editing interface 700 as the wallpaper for the desktop wallpaper page 703. This process is similar to the above. Figure 10 or Figure 14 The process of selecting images is similar and will not be repeated here.
[0174] As an example, when the wallpaper editing interface 700 displays the desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper, the user can adjust the blur level of the wallpaper on the desktop wallpaper page 703 using the blur button 79 in the wallpaper editing interface 700. This process is similar to the above. Figure 13 The process of adjusting ambiguity is similar and will not be repeated here.
[0175] As an example, when the wallpaper editing interface 700 displays the desktop wallpaper page 703 and related function buttons for editing the desktop wallpaper, the user can zoom in or out on the wallpaper on the desktop wallpaper page 703, and also move the position of the wallpaper. This process is similar to the above. Figure 15 The process of adjusting the size or position of the main image is similar and will not be described in detail here.
[0176] After editing the desktop wallpaper using one or more of the methods described above, if the user determines that the wallpaper on the current desktop wallpaper page 703 meets their needs, the user can click the Apply button 71 in the wallpaper editing interface 700. In response to this click, the electronic device can set the wallpaper on the desktop wallpaper page 703 as the desktop wallpaper.
[0177] It should be noted that since the wallpaper editing interface 700 includes a lock screen wallpaper page 702 and a desktop wallpaper page 703, after the user clicks the apply button 71 in the wallpaper editing interface 700, the electronic device can set the wallpaper of the current lock screen wallpaper page 702 as the lock screen wallpaper, and at the same time set the wallpaper of the current desktop wallpaper page 703 as the desktop wallpaper.
[0178] Another point to note is that in some embodiments, if the electronic device enters the wallpaper editing interface 700 from the lock screen interface 800, then after the user clicks the apply button 71 in the wallpaper editing interface 700, in response to the click operation, the electronic device can display the lock screen interface 800 and show the edited lock screen wallpaper on the lock screen interface 800. Conversely, if the electronic device enters the wallpaper editing interface 700 from the desktop 900, then after the user clicks the apply button 71 in the wallpaper editing interface 700, in response to the click operation, the electronic device can display the desktop 900 and show the edited desktop wallpaper on the desktop 900.
[0179] In other embodiments, if the user clicks the apply button 71 in the wallpaper editing interface 700 while the lock screen wallpaper page 702 is displayed in the wallpaper editing interface 700, then in response to the click operation, the electronic device can display the lock screen interface 800 and display the edited lock screen wallpaper on the lock screen interface 800. If the user clicks the apply button 71 in the wallpaper editing interface 700 while the desktop wallpaper page 703 is displayed in the wallpaper editing interface 700, then in response to the click operation, the electronic device can display the desktop 900 and display the edited desktop wallpaper on the desktop 900.
[0180] In some other embodiments, after a user clicks the apply button 71 in the wallpaper editing interface 700, in response to the click operation, the electronic device can display the desktop 900 and display the edited desktop wallpaper on the desktop 900.
[0181] After understanding the various editing functions in the wallpaper editing method provided in the embodiments of this application, the specific implementation process of these editing functions will be described in detail below.
[0182] Figure 20 This is a schematic diagram of the software system involved in a wallpaper editing method provided in an embodiment of this application. See also... Figure 20 As shown in Figure (a), the software system may include an application layer, which may include lock screen applications, desktop applications, and gallery applications. Furthermore, the software system can interact with the file system in the hardware layer.
[0183] Both the lock screen app and the desktop app can instruct the gallery app to display the wallpaper editing interface.
[0184] When the Gallery app receives an instruction from the Lock Screen app or the Desktop app, it can load the wallpaper editing interface, which includes the function buttons, the Lock Screen wallpaper page, and the Desktop wallpaper page.
[0185] The gallery application can retrieve lock screen wallpaper files and desktop wallpaper files from the file system, and display the lock screen wallpaper on the lock screen wallpaper page based on the lock screen wallpaper file, and display the desktop wallpaper on the desktop wallpaper page based on the desktop wallpaper file.
[0186] The file system can store a first file and a second file for the lock screen wallpaper. The first file is used when editing the lock screen wallpaper in the wallpaper editing interface; that is, the gallery application can display the lock screen wallpaper on the lock screen wallpaper page based on the first file. The second file is used when displaying the lock screen wallpaper on the lock screen interface; that is, the lock screen application can display the lock screen wallpaper on the lock screen interface based on the second file.
[0187] Similarly, the file system can store a first file and a second file for the desktop wallpaper. The first file is used when editing the desktop wallpaper in the wallpaper editing interface; that is, the gallery application can display the desktop wallpaper on the desktop wallpaper page based on the first file. The second file is used when displaying the desktop wallpaper on the desktop; that is, the desktop application can display the desktop wallpaper based on the second file.
[0188] Figure 20 Figure (b) is a technical architecture diagram related to a wallpaper editing method provided in an embodiment of this application. This technical architecture diagram only shows modules relevant to the embodiments of this application. These modules can be set within a gallery application or as other applications independent of the gallery application, such as a standalone wallpaper editing application. In practical applications, this technical architecture diagram may also include other modules, which are not shown individually.
[0189] For example, such as Figure 20 As shown in Figure (b), the gallery application may include a main function module, a lock screen view module, and a desktop view module.
[0190] The main functional module implements various editing functions during the wallpaper editing process. This module can interact with external systems, such as lock screen applications, desktop applications, and the file system. Furthermore, it can perform parsing tasks related to the wallpaper file during the wallpaper editing process. Additionally, the main functional module can save operation data for each editing action during the wallpaper editing process.
[0191] The lock screen view module is used to display the lock screen wallpaper on the lock screen wallpaper page based on the lock screen wallpaper display information.
[0192] The Desktop View module is used to display the desktop wallpaper on the desktop wallpaper page based on the desktop wallpaper display information.
[0193] Following the description of the technical architecture diagram of the wallpaper editing method provided in the embodiments of this application, a timing diagram of the wallpaper editing method provided in the embodiments of this application is described next. This timing diagram is related to... Figures 7 to 18 The scenario shown illustrates the specific implementation process of wallpaper editing based on the wallpaper editing interface.
[0194] Figure 21 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 21 The flowchart shown illustrates the specific process of displaying the wallpaper editing interface when the wallpaper editing function is used for the first time. See also... Figure 21 The method may include the following steps:
[0195] Step 2101: The lock screen application receives the first gesture operation.
[0196] The first gesture operation can be a predefined gesture operation. For example, the first gesture operation can be a two-finger pinch operation, a long press operation, a double-tap operation, an S-shaped swipe operation, etc., and this application embodiment does not limit it.
[0197] For example, suppose the first gesture is a two-finger pinch gesture, such as Figure 8 As shown in Figure (a), when the electronic device displays the lock screen interface 800, the user can perform a two-finger pinch on the lock screen interface 800. In this case, the lock screen application can receive the two-finger pinch operation on the lock screen interface 800. Specifically, the two-finger pinch operation triggered on the lock screen interface 800 is used to indicate entry into the wallpaper editing function, that is, to indicate the display of the wallpaper editing interface.
[0198] Step 2102: In response to the first gesture operation, the lock screen application sends a first message to the gallery application.
[0199] For example, the first message could be an intent message.
[0200] The first message can carry source information, which indicates which application the first message comes from. For example, the source information in the first message can be the application identifier of the lock screen application.
[0201] In some implementations, if the lock screen wallpaper has not been edited using the wallpaper editing method provided in this application, the lock screen wallpaper is generally a default wallpaper image. In this case, the first message may also carry the storage path of the wallpaper image.
[0202] Since the first gesture triggered on the lock screen is used to indicate entry into the wallpaper editing function, the lock screen application can send a first message to the gallery application after receiving the first gesture to instruct the gallery application to display the wallpaper editing interface.
[0203] Step 2103: After receiving the first message, the main functional module in the Gallery application determines that the first message comes from the Lock Screen application, and then displays the function buttons.
[0204] For example, such as Figure 8As shown in Figures (b) and (c), the function button may include main function buttons, such as the back button 70 and the application button 71, as well as related function buttons for editing the lock screen wallpaper, such as the change image button 75, the lock screen style button 72, the personal decoration button 73, the depth effect button 74, and related function buttons for editing the desktop wallpaper, such as the follow lock screen button 76, the color button 77, the select wallpaper button 78, and the blur button 79.
[0205] The main functional module can determine whether the first message comes from the lock screen application based on the source information in the first message.
[0206] In some embodiments, if the main functional module determines that the first message comes from a lock screen application, then the main functional module can determine that the display area of the lock screen wallpaper page is a preset first display area within the screen, and the display area of the desktop wallpaper page is a preset second display area, wherein the second display area is either partially located within the screen or completely located outside the screen. In this case, such as Figure 8 As shown in Figure (b), the main functional module can first display the main function button and the function button for editing the lock screen wallpaper, while temporarily not displaying the function button for editing the desktop wallpaper.
[0207] In some embodiments, the size of the first display area is the same as the size of the second display area. The area ratio (i.e., the area aspect ratio) of the first display area and the area ratio of the second display area are both the same as the screen ratio (i.e., the screen aspect ratio) of the electronic device.
[0208] For example, such as Figure 22 As shown, when the first message originates from the lock screen application, the main functional module can determine that the display area of the lock screen wallpaper page is a preset display area A within the screen, while the display area of the desktop wallpaper page is a preset display area B. Display area B has only a very small portion within the screen, with the majority located off-screen. In this case, the user can see the complete lock screen wallpaper page, but only a very small portion of the desktop wallpaper page.
[0209] In some embodiments, if the main functional module determines that the first message comes from a lock screen application, it may also display a mask. For example, such as Figure 7 As shown, layer 704 is the bottommost layer of the wallpaper editing interface 703. The function buttons, lock screen wallpaper page 702, and desktop wallpaper page 703 in the wallpaper editing interface 700 are all displayed on top of layer 704.
[0210] For example, the mask can be a blurred mask, which is a mask obtained through blurring.
[0211] As an example, the main functional module can retrieve the corresponding image based on the storage path of the image carried in the first message (i.e., the wallpaper image mentioned above), or it can retrieve a preset image. Then, the main functional module can adjust the image according to the screen information to make its size match the screen size, then blur the image to obtain the overlay, and finally display the overlay.
[0212] In one possible implementation, the operation of the main functional module to adjust the image based on the screen information can be as follows: crop the image according to the screen ratio, and the aspect ratio of the cropped image (i.e., the image height-to-width ratio) is the same as the screen ratio; divide the screen height by the height of the cropped image, or divide the screen width by the width of the cropped image, to obtain the scaling ratio; scale the cropped image according to the scaling ratio, and the size of the scaled image is the screen size.
[0213] Step 2104: The main functional module sends a wallpaper data retrieval request to the file system.
[0214] This wallpaper data retrieval request is used to request lock screen wallpaper files and desktop wallpaper files.
[0215] A lock screen wallpaper file is a file that contains data related to the current lock screen wallpaper of an electronic device.
[0216] A desktop wallpaper file is a file that contains data related to the current desktop wallpaper on your electronic device.
[0217] Step 2105: After receiving the wallpaper data acquisition request, the file system sends the lock screen wallpaper file and the desktop wallpaper file to the main functional module.
[0218] After receiving a wallpaper data retrieval request from the main functional module of the gallery application, the file system can send the first file of the lock screen wallpaper as the lock screen wallpaper file to the main functional module, and also send the first file of the desktop wallpaper as the desktop wallpaper file to the main functional module.
[0219] The first file of the lock screen wallpaper is the lock screen wallpaper file that the gallery application needs to use when editing the lock screen wallpaper. In some implementations, if the lock screen wallpaper has not been edited using the wallpaper editing method provided in this application embodiment, the lock screen wallpaper can be a preset first image, in which case the first file of the lock screen wallpaper can contain the storage path of the first image.
[0220] The first file of the desktop wallpaper is the desktop wallpaper file that the gallery application needs to use when editing the desktop wallpaper. In some implementations, if the desktop wallpaper has not been edited using the wallpaper editing method provided in this application embodiment, the desktop wallpaper can be a preset second image, in which case the first file of the desktop wallpaper can include the storage path of the second image.
[0221] The first and second images are wallpaper images pre-installed on electronic devices. The first and second images may be the same or different, and this application embodiment does not limit this.
[0222] Step 2106: After receiving the lock screen wallpaper file and the desktop wallpaper file, the main functional module obtains the first image based on the lock screen wallpaper file and the second image based on the desktop wallpaper file.
[0223] After receiving the lock screen wallpaper file, if the lock screen wallpaper file contains the storage path of the first image, the main functional module can retrieve the first image based on the storage path.
[0224] After receiving the desktop wallpaper file, if the desktop wallpaper file contains the storage path of the second image, the main functional module can retrieve the second image based on the storage path.
[0225] It should be noted that, in this embodiment, after the main functional module obtains the image (such as the first image or the second image) according to the storage path, it saves the obtained image in memory and performs subsequent processing on it, rather than directly processing the original image in the storage path. This avoids the related processing from damaging the original image.
[0226] It should be noted that the images described in this application embodiment may exist in the electronic device as image data before being displayed, and can be drawn and rendered according to the image data to present the image on the screen during display. Therefore, obtaining the first image can be understood as obtaining the first image data, and obtaining the second image can be understood as obtaining the second image data.
[0227] Step 2107: The main functional module processes the first image to obtain the first display image, and processes the second image to obtain the second display image.
[0228] The first displayed image is the image used to display on the lock screen wallpaper page. The size of the first displayed image is the same as the size of the display area on the lock screen wallpaper page.
[0229] The second display image is the image used to display on the desktop wallpaper page. The size of the second display image is the same as the display area of the desktop wallpaper page.
[0230] In some embodiments, the operation of the main functional module to process the first image to obtain the first display image may include the following steps (1) to (4).
[0231] (1) The main functional module determines the initial scaling ratio of the first image based on the screen size and the size of the first image, and scales the first image according to the initial scaling ratio to obtain a full-screen image.
[0232] The initial scaling ratio is used to process the first image as a full-screen image, which means an image that can fill the entire screen.
[0233] Specifically, the screen height can be divided by the height of the first image to obtain a first value, and the screen width can be divided by the width of the first image to obtain a second value. The larger of the first and second values can then be used as the initial scaling ratio of the first image.
[0234] (2) The main functional module determines the target area in the full-screen image.
[0235] The target area in the full-screen image is the region of the full-screen image that can be displayed on the screen. The target area in the full-screen image can be a region centered on the center of the full-screen image with the same aspect ratio as the screen. For example, the size of the target area in the full-screen image can be the same as the screen size, or it can be smaller than the screen size; this application embodiment does not limit this.
[0236] For example, assuming the screen ratio is 16:9 and the full-screen image has a 4:3 aspect ratio, then the target area in the full-screen image can be as follows: Figure 23 As shown.
[0237] (3) The main functional module crops out the image within the target area of the full-screen image to obtain the target image.
[0238] (4) The main functional module scales the target image according to a specific scaling ratio to obtain the first display image.
[0239] A specific scaling factor is used to process a target image into an image that can be displayed on the lock screen wallpaper page. For example, the specific scaling factor can be obtained by dividing the height (or width) of the display area of the lock screen wallpaper page by the screen height (or screen width).
[0240] It should be noted that the operation of the main functional module in processing the second image to obtain the second display image is similar to the operation of the main functional module in processing the first image to obtain the first display image, and will not be described again in this embodiment.
[0241] Step 2108: The main functional module sends a first display request to the lock screen view module and a second display request to the desktop view module.
[0242] The first display request is used to request the display of the lock screen wallpaper page. The first display request may carry a first display image, and may further carry the location information of the display area of the lock screen wallpaper page.
[0243] The second display request is used to request the display of the desktop wallpaper page. The second display request may carry a second display image, and may further carry location information of the display area of the desktop wallpaper page.
[0244] The position information of a certain display area is its position in the screen coordinate system. Therefore, based on this position information, the corresponding location of the display area on the screen can be determined.
[0245] Step 2109: After receiving the first display request, the lock screen view module displays the lock screen wallpaper page.
[0246] Specifically, the lock screen view module can display the first display image at the corresponding position on the screen based on the location information of the display area carried by the first display request, so as to display the lock screen wallpaper page.
[0247] Step 2110: After receiving the second display request, the desktop view module displays the desktop wallpaper page.
[0248] Specifically, the desktop view module can display the second display image at the corresponding position on the screen based on the location information of the display area carried by the second display request, so as to display the desktop wallpaper page.
[0249] After completing the steps outlined above to display the function buttons, lock screen wallpaper page, and desktop wallpaper page, the wallpaper editing interface is now complete. For example, the displayed wallpaper editing interface could be... Figure 8 The wallpaper editing interface 700 is shown in Figure (b).
[0250] After the wallpaper editing interface is displayed, users can edit the lock screen wallpaper or desktop wallpaper. The following is a detailed explanation of the implementation process of various editing functions.
[0251] Figure 24 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 24 The flowchart shown illustrates the specific process of a user selecting a wallpaper template based on the wallpaper editing interface. See also... Figure 24 The method may include the following steps:
[0252] Step 2401: The main functional module receives click operations on the lock screen style button.
[0253] When the lock screen wallpaper page is displayed in the wallpaper editing interface, various editing operations can be performed on the wallpaper. In some cases, if the user wants to change the style of the lock screen wallpaper, such as... Figure 10 As shown in Figure (a), the user can click the lock screen style button 72, and the main function module will receive the click operation of the lock screen style button 72.
[0254] Step 2402: In response to the click operation of the lock screen style button, the main function module displays the first pop-up window.
[0255] For example, such as Figure 10 As shown in Figure (b), the first pop-up window 7011 displays multiple wallpaper template options. Optionally, it may also display image options from the gallery and some wallpaper image options preset by the electronic device.
[0256] Step 2403: The main functional module receives the selection operation for wallpaper template option 1.
[0257] For example, such as Figure 10 As shown in Figure (b), the user can click on a wallpaper template option (hereinafter referred to as wallpaper template option 1) displayed in the first pop-up window 7011, and the main functional module will receive a selection operation for wallpaper template option 1. For example, wallpaper template option 1 is the option corresponding to wallpaper template 1.
[0258] Step 2404: In response to the selection operation of wallpaper template option 1, the main function module obtains the template identifier corresponding to wallpaper template option 1.
[0259] Each template identifier uniquely identifies a wallpaper template. The template identifier corresponding to wallpaper template option 1 is the template identifier for wallpaper template 1.
[0260] The wallpaper templates in this embodiment can be preset. Each wallpaper template may include multiple layers, and the types and levels of the multiple layers included in each wallpaper template can be preset.
[0261] For example, such as Figure 4 As shown, a wallpaper template, from bottom to top, can include the original layer and a clock layer; or it can include the original layer, a color background layer, a clock layer, and a cutout layer; or it can include the original layer, decoration layer 1, a clock layer, and decoration layer 2; or it can include the original layer, decoration layer 1, a clock layer, a cutout layer, and decoration layer 2. Of course, these are not the only examples; the multiple layers included in a wallpaper template can be flexibly set according to actual needs.
[0262] Step 2405: The main functional module sends a wallpaper template data retrieval request to the file system.
[0263] This wallpaper template data retrieval request is used to request the wallpaper template file for wallpaper template 1. This request may include the template identifier for wallpaper template 1.
[0264] Step 2406: After receiving the wallpaper template data acquisition request, the file system sends the wallpaper template file to the main functional module.
[0265] Specifically, the file system can obtain the corresponding wallpaper template file based on the template identifier and send the wallpaper template file to the main functional module.
[0266] For example, a wallpaper template file contains information such as the wallpaper template's layers, offset, scale ratio, blur factor, and depth-of-field support status.
[0267] Layer set information includes basic layer information for each of the multiple layers, and this basic layer information can be organized in hierarchical order within the layer set information.
[0268] For example, the basic information of the original layer may include layer identifier, layer type, image storage path, etc. The basic information of the color background layer may include layer identifier, layer type, color setting type, color value, etc. The basic information of the decoration layer may include layer identifier, layer type, image storage path, color setting type, color value, etc. The basic information of the clock layer may include layer identifier, layer type, layout, font, color value, color setting type, etc. The basic information of the cutout layer may include layer identifier, layer type, image storage path, etc.
[0269] The offset information is determined based on the user's movement of the main image and indicates how much the center of the main image has shifted relative to the screen center after the movement. The offset information applies to both the original layer and the cutout layer. It should be noted that if the user has not moved the main image, the offset in the offset information can default to [0,0].
[0270] The scaling ratio information is determined based on the user's scaling operation on the main image, indicating how much the scaled main image has been reduced compared to the original. This scaling ratio information applies to both the original layer and the cutout layer. It should be noted that if the user has not scaled the main image, the scaling ratio in the scaling ratio information can default to 1.
[0271] The blur information is determined based on the blur level adjusted by the user and is used to indicate the blur level of the main image. The blur information applies to the original layer. It should be noted that if the user has not adjusted the blur level, the blur level in the blur information can be set to 0 by default.
[0272] The depth-of-field effect switch status information indicates whether the depth-of-field effect switch is on or off. This status information applies to the cutout layer. It should be noted that if the user has not interacted with the depth-of-field effect switch, the status in the status information can be assumed to be on.
[0273] It should be noted that the basic layer information for each layer in the layer set information included in the wallpaper template file can be preset. Furthermore, the offset in the offset information can be set to [0,0] by default, the scaling ratio in the scaling ratio information can be set to 1 by default, the blur in the blur information can be set to 0 by default, and the depth-of-field effect on / off status information can be set to on by default.
[0274] In some embodiments, the wallpaper template file can be a JavaScript Object Notation (JSON) file. The JSON file can store data in the form of "key-value pairs," where each "key" has its unique "value," and each "value" can also have its own child "key-value pairs." This structure effectively records information such as layer set information, offset information, scaling information, blur information, and depth-of-field effect on / off status.
[0275] As an example, a JSON file can contain, for example, Figure 25 The information shown includes various parameters. "type" indicates the layer type; for example, the values of "type" are: [0] Original layer, [1] Color background layer, [2] Decoration layer, [3] Clock layer, [4] Cutout layer. "colorPolicy" indicates the color setting type; for example, the values of "colorPolicy" are: [0] No color setting allowed, [1] Main color, can be set independently, [2] Cannot be set independently, use main color and secondary color, [3] Main color gradient, [4] Select clock color. "isDepthofFieldSupported" indicates the depth-of-field effect on / off status; for example, the values of "isDepthofFieldSupported" are: [true] On, [false] Off.
[0276] It's worth noting that JSON files have a simple and efficient format, with straightforward syntax rules and more efficient data parsing. Therefore, when the wallpaper template file is a JSON file, the main functional module can retrieve the wallpaper template file from the file system more quickly and parse it faster.
[0277] Step 2407: After receiving the wallpaper template file, the main functional module parses the wallpaper template file to obtain the wallpaper display information, which includes the display information of each layer in multiple layers.
[0278] For example, the display information of a clock layer may include the clock layer's layer identifier, level, clock settings (including layout, font, and color values), and visibility.
[0279] For example, for layers other than the clock layer, such as the original layer, color background layer, decoration layer, cutout layer, etc., the display information for that layer can include its layer identifier, level, display image, and visibility. The display image is the image used to display on the lock screen wallpaper page.
[0280] In some embodiments, the operation of step 2407 may include the following steps (1) to (5).
[0281] (1) The main functional module determines the layer identifier, level and clock setting information of the clock layer based on the layer set information in the wallpaper template file, as well as the layer identifier, level and full-screen image of each layer other than the clock layer.
[0282] For layers other than the clock layer, such as the original layer, color background layer, decoration layer, cutout layer, etc., the layer has an initial image. In this embodiment of the application, the initial image can be processed into a full-screen image, which refers to an image that can fill the entire screen.
[0283] As an example, step (1) may include steps A through E as follows:
[0284] Step A: The main functional module determines the number of layers based on the layer set information.
[0285] For example, the main functional module can determine the number of layer identifiers in the layer set information as the layer number. For instance, for... Figure 25 The JSON file shown can be used to determine the number of "id" entries in "layers" as the number of layers, thus determining that the number of layers is 8.
[0286] The following assumes that the number of layers is k, where k is an integer greater than or equal to 2.
[0287] Step B: Determine i as 1 for the main functional module.
[0288] Step C: The main functional module determines whether the i-th layer in the layer set information is a clock layer.
[0289] For example, the main functional module can determine whether the i-th layer is a clock layer based on the layer type in the layer base information of the i-th layer.
[0290] Step D: If the i-th layer is a clock layer, the main functional module obtains the layer identifier from the basic layer information of the clock layer, and uses the layout, font, and color values from the basic layer information of the clock layer as the clock setting information of the clock layer, and determines the level of the clock layer as i. Then, it checks whether i is equal to k; if i is not equal to k, it sets i = i + 1, and repeats step C and subsequent steps; if i is equal to k, the operation ends.
[0291] Step E: If the i-th layer is not a clock layer, the main functional module parses the basic layer information of the i-th layer to obtain the layer identifier and initial image of the i-th layer. It then processes the initial image of the i-th layer to obtain the full-screen image of the i-th layer and determines the layer level of the i-th layer as i. Afterward, it checks if i equals k; if i does not equal k, it sets i = i + 1 and re-executes step C and subsequent steps; if i equals k, the operation ends.
[0292] For example, the operation of the main functional module parsing the basic information of the i-th layer to obtain the initial image of the i-th layer can be as follows: If the basic information of the i-th layer contains an image storage path but does not contain color values and color setting types, then the image is obtained according to the image storage path as the initial image of the i-th layer; if the basic information of the i-th layer contains an image storage path, color values, and color setting types, then the image is obtained according to the image storage path, and the color of the image is set according to the color values and color setting types to obtain the initial image of the i-th layer; if the basic information of the i-th layer does not contain an image storage path but contains color values and color setting types, then an image with the same size as the screen size is generated, and the color of the image is set according to the color values and color setting types to obtain the initial image of the i-th layer.
[0293] for example, Figure 25 The first array in the "layers" section of the JSON file shown (the array containing "id": "layer_origin") contains the basic layer information for the first layer. Based on the layer type in the first array ("type": 0), we can determine that the first layer is the original layer. We can obtain the image as the initial image for the first layer based on the image storage path in the first array ("src": "02_origin.png").
[0294] Figure 25 The second array in the "layers" section of the JSON file shown (the array containing "id": "layer_color") contains the basic layer information for the second layer. Based on the layer type ("type": 1) in the second array, the second layer is determined to be a color background layer. Since the second array does not contain the image storage path, an image with the same size as the screen can be generated. The image's color is then set according to the color value ("color": "#FFECBD5B") and color setting type ("colorPolicy": 1) in the second array, resulting in the initial image for the second layer.
[0295] Figure 25 The third array in the "layers" section of the JSON file shown (the array containing "id": "layer_res1") contains the basic layer information for the third layer. Based on the layer type in the third array ("type": 2), the third layer is identified as a decorative layer. The image can be retrieved using the image storage path in the third array ("src": "02_res1_1.png"), and its color can be set according to the color value ("color": "#FF9C3022") and color setting type ("colorPolicy": 1) in the third array to obtain the initial image for the third layer.
[0296] Figure 25 The fourth array in the "layers" section of the JSON file shown (the array containing "id": "layer_res3") contains the basic layer information for the fourth layer. Based on the layer type in the fourth array ("type": 2), the fourth layer is identified as a decoration layer. The image can be retrieved as the initial image for the fourth layer based on the image storage path in the fourth array ("src": "02_res1_3.png").
[0297] Figure 25 The fifth array in the "layers" section of the JSON file shown (the array containing "id": "layer_timer") contains the basic layer information for the fifth layer. Based on the layer type in the fifth array ("type": 3), we can determine that the fifth layer is a clock layer. We can retrieve the layout ("layout": 0), font ("font": "HonorDigits_SerifVF.ttf"), and color value ("color": "#FFAE3DF") from the fifth array as the clock settings information for the clock layer.
[0298] Figure 25 The sixth array in the "layers" section of the JSON file shown (the array containing "id": "layer_crop") contains the basic information for the sixth layer. Based on the layer type in the sixth array ("type": 4), the sixth layer is identified as a cutout layer. The image can be retrieved as the initial image for the sixth layer based on the image storage path in the sixth array ("src": "02_crop.png").
[0299] For example, the operation of the main functional module to process the initial image of the i-th layer to obtain the full-screen image of the i-th layer can be as follows: the main functional module determines the initial scaling ratio based on the screen size and the size of the initial image, and scales the initial image according to the initial scaling ratio to obtain the full-screen image of the i-th layer.
[0300] This initial scaling factor is used to process the initial image into a full-screen image. Specifically, the screen height is divided by the height of the initial image to obtain a first value, and the screen width is divided by the width of the initial image to obtain a second value. The larger of the first and second values is then used as the initial scaling factor.
[0301] (2) The main functional module processes the full-screen image of the original layer according to the offset information and scaling information in the wallpaper template file to obtain the target image of the original layer, and processes the full-screen image of the cutout layer according to the offset information and scaling information in the wallpaper template file to obtain the target image of the cutout layer.
[0302] For example, such as Figure 26 As shown, taking a scaling ratio of 1.5 and an offset of [20, 20] as an example, the main functional module processes the full-screen image of the original layer according to the offset and scaling ratio information in the wallpaper template file to obtain the target image of the original layer. The operation can be as follows: The main functional module determines the target area in the full-screen image of the original layer. The target area in the full-screen image is the area that can be displayed on the screen. The target area in the full-screen image can be the area in the full-screen image with the center of the full-screen image as the center and the area ratio is the same as the screen ratio. While keeping the center of the full-screen image unchanged, the full-screen image is scaled according to the scaling ratio in the scaling ratio information. Then, the scaled full-screen image is moved according to the offset in the offset information so that the offset between the center of the moved full-screen image and the center of the target area is the offset in the offset information. After that, the image in the target area of the full-screen image is cropped to obtain the target image of the original layer.
[0303] The operation of the main functional module in processing the cutout layer according to the offset information and scaling information in the wallpaper template file to obtain the target image of the cutout layer is similar to the operation of the main functional module in processing the full-screen image of the original layer according to the offset information and scaling information in the wallpaper template file to obtain the target image of the original layer. Therefore, this embodiment will not be described in detail.
[0304] (3) The main functional module blurs the target image of the original layer based on the blur information in the wallpaper template file.
[0305] (4) When the depth-of-field effect switch status information in the wallpaper template file indicates that it is on, the main functional module sets the visibility of all layers in the multiple layers to visible. For example, this can achieve the following: Figure 13 The depth-of-field effect in the wallpaper of lock screen wallpaper page 702 shown in Figure (a) is configured to be off when the depth-of-field effect switch status information in the wallpaper template file indicates that it is off. The visibility of all layers except the cutout layer is set to visible, and the visibility of the cutout layer is set to invisible. For example, this can turn off the depth-of-field effect. Figure 13 The wallpaper on lock screen page 702 shown in Figure (d) does not have a depth-of-field effect.
[0306] (5) The main functional module scales the target image of the original layer according to a specific scaling ratio to obtain the display image of the original layer, scales the target image of the cutout layer to obtain the display image of the cutout layer, and scales the full-screen images of the other layers in the multiple layers except the original layer, the cutout layer and the clock layer to obtain the display images of the other layers.
[0307] A specific scaling factor is used to process an image to a size that can be displayed on the lock screen wallpaper page. For example, the specific scaling factor can be obtained by dividing the height (or width) of the display area of the lock screen wallpaper page by the screen height (or screen width).
[0308] It should be noted that in step 2407, after the main functional module receives the wallpaper template file, it can save the wallpaper template file as the currently edited lock screen wallpaper file in memory, and subsequent editing processes will modify the currently edited lock screen wallpaper file.
[0309] Understandably, after completing step 2407, that is, after receiving the wallpaper template file and completing the parsing of the wallpaper template file, for any layer identified by a layer identifier, there is a corresponding parsing logic to parse the display information of the layer identified by that layer identifier from the wallpaper template file.
[0310] Step 2408: The main functional module sends a third display request to the lock screen view module.
[0311] The third display request is used to request the display of the lock screen wallpaper page. The third display request carries the wallpaper display information and the location information of the display area of the lock screen wallpaper page.
[0312] It should be noted that after the main functional module sends a third display request to the lock screen view module, the lock screen view module can then display the corresponding wallpaper template.
[0313] Step 2409: After receiving the third display request, the lock screen view module displays the lock screen wallpaper page.
[0314] Specifically, the lock screen view module can, based on the location information of the display area carried in the third display request, display each of the multiple layers in the corresponding position on the screen, in ascending order of hierarchy, according to the display information of each layer, to display the wallpaper template, thus realizing the display of the lock screen wallpaper page. For example, the displayed lock screen wallpaper page could be... Figure 10 The lock screen wallpaper page 702 shown in Figure (c) displays the wallpaper template selected by the user.
[0315] In some embodiments, after a user edits the lock screen wallpaper by selecting a wallpaper template, the user can also save the edited lock screen wallpaper to make it effective. This process may include the following steps 2410 and 2412.
[0316] Step 2410: The main functional module receives click operations on the application button.
[0317] For example, such as Figure 16 As shown in Figure (a), after selecting a wallpaper template, the user can click the application button 71 in the wallpaper editing interface 700, and the main functional module will receive the click operation of the application button 71.
[0318] Step 2411: The main functional module sends a wallpaper data storage request to the file system.
[0319] This wallpaper data storage request is used to request the storage of lock screen wallpaper file 1. Lock screen wallpaper file 1 is the currently edited lock screen wallpaper file, and in this embodiment, it is the wallpaper template file obtained by the main functional module after the user selects a wallpaper template.
[0320] Step 2412: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0321] For example, the file system can update the first file of the lock screen wallpaper to lock screen wallpaper file 1.
[0322] Figure 27 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 27 The flowchart shown illustrates the specific process of a user setting the clock based on the wallpaper editing interface. See also... Figure 27 The method may include the following steps:
[0323] Step 2701: The main functional module receives click operations on the clock frame.
[0324] In some cases, if a user wants to set a clock in the lock screen wallpaper, then... Figure 11 As shown in Figure (a), the user can click on the clock frame 710, and the main functional module will receive the click operation on the clock frame 710.
[0325] Step 2702: In response to the click operation on the clock frame, the main function module displays the second pop-up window.
[0326] For example, such as Figure 11 As shown in Figure (b), the second pop-up window 7012 displays multiple clock font options and multiple clock color options.
[0327] Step 2703: The main functional module receives the selection operation for clock color option 1.
[0328] For example, such as Figure 11 As shown in Figure (b), the user can click on a clock color option (hereinafter referred to as clock color option 1) displayed in the second pop-up window 7012, and the main functional module will receive the selection operation for clock color option 1.
[0329] Step 2704: In response to the selection operation of clock color option 1, the main function module obtains the color value corresponding to clock color option 1.
[0330] For example, the color value corresponding to clock color option 1 can be "#FFAE3DA".
[0331] Step 2705: The main function module updates the color value in the basic information of the clock layer in the currently edited lock screen wallpaper file to the color value corresponding to clock color option 1, and re-acquires the display information of the clock layer.
[0332] For example, suppose the currently edited lock screen wallpaper file is Figure 25 The JSON file shown has a clock layer color value of "color":"#FFAE3DF". This color value can be updated to "color":"#FFAE3DA".
[0333] After the main functional module updates the color value in the basic information of the clock layer in the currently edited lock screen wallpaper file to the color value corresponding to clock color option 1, it can re-parse the display information of the clock layer from the currently edited lock screen wallpaper file according to the parsing logic corresponding to the clock layer.
[0334] Continuing with the example above, the re-parsed clock layer display information may include: layer identifier ("id": "layer_timer"), layer (5), layout ("layout": 0), font ("font": "HonorDigits_SerifVF.ttf"), color value ("color": "#FFAE3DA"), and visibility (visible).
[0335] Step 2706: The main functional module sends the clock layer display information to the lock screen view module.
[0336] Step 2707: After receiving the clock layer display information, the lock screen view module updates the clock layer display information in the wallpaper display information.
[0337] Continuing with the example above, the updated clock layer display information may include: layer identifier ("id":"layer_timer"), layer (5), layout ("layout":0), font ("font":"HonorDigits_SerifVF.ttf"), color value ("color":"#FFAE3DA"), and visibility (visible).
[0338] Step 2708: The lock screen view module displays the lock screen wallpaper page.
[0339] For example, the displayed lock screen wallpaper page can be Figure 11 The lock screen wallpaper page 702 shown in Figure (c) displays a clock in a color set by the user.
[0340] It should be noted that the operation of setting the font of the clock in the lock screen wallpaper through the second pop-up window is similar to the operation of setting the color of the clock as described above, and will not be described again in this embodiment.
[0341] In some embodiments, after a user edits the lock screen wallpaper by setting a clock, the edited lock screen wallpaper can be saved to take effect. This process may include steps 2709 and 2711 as follows.
[0342] Step 2709: The main functional module receives click operations on the application button.
[0343] Step 2710: The main functional module sends a wallpaper data storage request to the file system.
[0344] This wallpaper data storage request is used to request the storage of lock screen wallpaper file 2. Lock screen wallpaper file 2 is the currently edited lock screen wallpaper file, and in this embodiment, it is the lock screen wallpaper file updated by the main functional module according to relevant setting information after the user sets the clock.
[0345] Step 2711: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0346] For example, the file system can update the first lock screen wallpaper file to lock screen wallpaper file 2.
[0347] Figure 28 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 28 The flowchart shown illustrates the specific process of users customizing their wallpapers using the wallpaper editing interface. See also... Figure 28 The method may include the following steps:
[0348] Step 2801: The main functional module receives click operations on the personalized decoration button.
[0349] In some cases, if a user wants to set decorative elements in the lock screen wallpaper, then... Figure 12 As shown in Figure (a), users can click the personalization button 73, and the main functional module will receive the click operation of the personalization button 73.
[0350] Step 2802: In response to the click operation of the personalized decoration button, the main function module displays the third pop-up window.
[0351] For example, such as Figure 12 As shown in Figure (b), the third pop-up window 7013 displays multiple style options and multiple color options.
[0352] Step 2803: The main functional module receives the selection operation for color option 1.
[0353] For example, such as Figure 12 As shown in Figure (b), the user can click on a color option (hereinafter referred to as color option 1) displayed in the third pop-up window 7013, and the main functional module will receive the selection operation for color option 1.
[0354] Step 2804: In response to the selection operation of color option 1, the main function module obtains the color value corresponding to color option 1.
[0355] Step 2805: The main function module updates the color value in the basic information of the decorative layer of the currently edited lock screen wallpaper file to the color value corresponding to color option 1.
[0356] Step 2806: The main functional module re-acquires the display information of the decorative layer.
[0357] After the main functional module updates the color value in the basic information of the decorative layer in the currently edited lock screen wallpaper file to the color value corresponding to color option 1, it can re-parse the display information of the decorative layer from the currently edited lock screen wallpaper file according to the parsing logic corresponding to the decorative layer.
[0358] Step 2807: The main functional module sends the display information of the decorative layer to the lock screen view module.
[0359] Step 2808: After receiving the display information of the decorative layer, the lock screen view module updates the display information of the decorative layer in the wallpaper display information.
[0360] Step 2809: The lock screen view module displays the lock screen wallpaper page.
[0361] For example, the displayed lock screen wallpaper page can be Figure 12 The lock screen wallpaper page 702 shown in Figure (c) displays wallpapers where the colors of the decorative elements are those set by the user.
[0362] In some embodiments, after a user edits the lock screen wallpaper by setting the color of the decorative element, the user can also save the edited lock screen wallpaper to make it effective. This process may include the following steps 2810 and 2812.
[0363] Step 2810: The main functional module receives click operations on the application button.
[0364] Step 2811: The main functional module sends a wallpaper data storage request to the file system.
[0365] This wallpaper data storage request is used to request the storage of lock screen wallpaper file 3. Lock screen wallpaper file 3 is the currently edited lock screen wallpaper file, which in this embodiment is the lock screen wallpaper file updated by the main functional module according to the relevant color information after the user sets the color of the decorative elements.
[0366] Step 2812: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0367] For example, the file system can update the first lock screen wallpaper file to lock screen wallpaper file 3.
[0368] It should be noted that the operation of setting the style of the decorative items in the lock screen wallpaper through the third pop-up window is similar to the operation of setting the color of the decorative items mentioned above. The following is a brief explanation.
[0369] Figure 29 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 29 The flowchart shown illustrates the specific process of users customizing their wallpapers using the wallpaper editing interface. See also... Figure 29 The method may include the following steps:
[0370] Step 2901: The main functional module receives click operations on the personalized decoration button.
[0371] Step 2902: In response to the click operation of the personalized decoration button, the main function module displays the third pop-up window.
[0372] Step 2903: The main functional module receives the selection operation for style option 1.
[0373] Step 2904: In response to the selection operation of style option 1, the main function module obtains the image storage path corresponding to style option 1.
[0374] Step 2905: The main function module updates the image storage path in the basic layer information of the decoration layer in the currently edited lock screen wallpaper file to the image storage path corresponding to style option 1.
[0375] Step 2906: The main functional module re-acquires the display information of the decorative layer.
[0376] After the main functional module updates the image storage path in the basic information of the decorative layer in the currently edited lock screen wallpaper file to the image storage path corresponding to style option 1, it can re-parse the display information of the decorative layer from the currently edited lock screen wallpaper file according to the parsing logic corresponding to the decorative layer.
[0377] Step 2907: The main functional module sends the display information of the decorative layer to the lock screen view module.
[0378] Step 2908: After receiving the display information of the decorative layer, the lock screen view module updates the display information of the decorative layer in the wallpaper display information.
[0379] Step 2909: The lock screen view module displays the lock screen wallpaper page.
[0380] In this case, the style of the wallpaper decorations displayed on the lock screen wallpaper page is the style selected by the user.
[0381] In some embodiments, after a user edits the lock screen wallpaper by setting the style of the decorative elements, the user can also save the edited lock screen wallpaper to make it effective. This process may include the following steps 2910 and 2912.
[0382] Step 2910: The main functional module receives click operations on the application button.
[0383] Step 2911: The main functional module sends a wallpaper data storage request to the file system.
[0384] This wallpaper data storage request is used to request the storage of lock screen wallpaper file 4. Lock screen wallpaper file 4 is the currently edited lock screen wallpaper file, which in this embodiment is the lock screen wallpaper file updated by the main functional module according to the relevant style information after the user sets the style of the decorative elements.
[0385] Step 2912: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0386] For example, the file system can update the first file of the lock screen wallpaper to lock screen wallpaper file 4.
[0387] Figure 30 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 30 The flowchart shown illustrates the specific process of how users set depth-of-field effects based on the wallpaper editing interface. See also... Figure 30 The method may include the following steps:
[0388] Step 3001: The main functional module receives the click operation of the depth of field effect button.
[0389] In some cases, if a user wants to set a depth-of-field effect in their lock screen wallpaper, then... Figure 13 As shown in Figure (a), the user can click the depth-of-field effect button 74, and the main functional module will receive the click operation of the depth-of-field effect button 74.
[0390] Step 3002: In response to the click operation of the depth of field effect button, the main function module displays the fourth pop-up window.
[0391] For example, such as Figure 13 As shown in Figure (b), the fourth pop-up window 7014 displays a depth-of-field effect switch 7141, and can further display a background blur control 7142.
[0392] Step 3003: The main functional module receives the operation to turn off the depth of field effect switch.
[0393] For example, such as Figure 13 As shown in Figure (b), the user can turn off the depth-of-field effect switch by clicking the depth-of-field effect switch 7141, and the main function module will receive the turning-off operation of the depth-of-field effect switch 7141.
[0394] Step 3004: In response to the operation of turning off the depth-of-field effect switch, the main function module updates the state of the depth-of-field effect switch in the currently edited lock screen wallpaper file to the off state.
[0395] Step 3005: The main functional module re-acquires the display information of the cutout layer.
[0396] After the main functional module updates the depth-of-field effect switch status information in the currently edited lock screen wallpaper file to the off state, it can re-parse the display information of the cutout layer from the currently edited lock screen wallpaper file according to the parsing logic corresponding to the cutout layer.
[0397] Step 3006: The main functional module sends the display information of the cutout layer to the lock screen view module.
[0398] Step 3007: After receiving the display information of the cutout layer, the lock screen view module updates the display information of the cutout layer in the wallpaper display information.
[0399] Step 3008: The lock screen view module displays the lock screen wallpaper page.
[0400] For example, the displayed lock screen wallpaper page can be Figure 13 The lock screen wallpaper page 702 shown in Figure (c) has no depth-of-field effect.
[0401] In some embodiments, after a user edits the lock screen wallpaper by turning off the depth-of-field effect switch, the user can also save the edited lock screen wallpaper to make it effective. This process may include the following steps 3009 and 3011.
[0402] Step 3009: The main functional module receives click operations on the application button.
[0403] Step 3010: The main functional module sends a wallpaper data storage request to the file system.
[0404] This wallpaper data storage request is used to request storage of lock screen wallpaper file 5. Lock screen wallpaper file 5 is the currently edited lock screen wallpaper file, and in this embodiment, it is the lock screen wallpaper file updated by the main functional module according to the state of the depth effect switch after the user turns off the depth effect switch.
[0405] Step 3011: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0406] For example, the file system can update the first file of the lock screen wallpaper to lock screen wallpaper file 5.
[0407] Figure 31This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 31 The flowchart shown illustrates the specific process by which a user sets the background blur level using the wallpaper editing interface. See also... Figure 31 The method may include the following steps:
[0408] Step 3101: The main functional module receives the click operation of the depth of field effect button.
[0409] Step 3102: In response to the click operation of the depth of field effect button, the main function module displays the fourth pop-up window.
[0410] Step 3103: The main functional module receives the trigger operation for the background blur control.
[0411] For example, such as Figure 13 As shown in Figure (b), the background blur control 7142 can be a slider-type control with a slider whose position indicates the corresponding blur (which may be called the target blur). Of course, the background blur control 7142 can also be other types of controls, and this application embodiment does not limit this.
[0412] The background blur control can be triggered by the user. That is, if a user wants to adjust the background blur, they can do so by manipulating the background blur control. For example, a user can drag... Figure 13 The slider in slider 7142 shown in Figure (b) is used to adjust the position of the slider in the slider to set the background blur.
[0413] Step 3104: In response to the trigger operation of the background blur control, the main functional module determines the target blur.
[0414] Step 3105: The main function module updates the blur information in the currently edited lock screen wallpaper file to the target blur.
[0415] Step 3106: The main functional module re-acquires the display information of the original layer.
[0416] After updating the blur information in the currently edited lock screen wallpaper file to the target blur, the main functional module can re-parse the display information of the original layer from the currently edited lock screen wallpaper file according to the parsing logic corresponding to the original layer.
[0417] Step 3107: The main functional module sends the display information of the original layer to the lock screen view module.
[0418] Step 3108: After receiving the display information of the original layer, the lock screen view module updates the display information of the original layer in the wallpaper display information.
[0419] Step 3109: The lock screen view module displays the lock screen wallpaper page.
[0420] In this case, the blurriness of the background portion of the main image of the wallpaper on the displayed lock screen wallpaper page is the blurriness set by the user.
[0421] In some embodiments, after editing the lock screen wallpaper by turning off the depth-of-field effect switch, the user can also save the edited lock screen wallpaper to make it effective. This process may include the following steps 3110 and 3112.
[0422] Step 3110: The main functional module receives click operations on the application button.
[0423] Step 3111: The main functional module sends a wallpaper data storage request to the file system.
[0424] This wallpaper data storage request is used to request the storage of lock screen wallpaper file 6. Lock screen wallpaper file 6 is the currently edited lock screen wallpaper file, and in this embodiment, it is the lock screen wallpaper file updated by the main functional module according to the target blur after the user sets the background blur.
[0425] Step 3112: After receiving the wallpaper data storage request, the file system updates the lock screen wallpaper file.
[0426] For example, the file system can update the first file of the lock screen wallpaper to lock screen wallpaper file 6.
[0427] Figure 32 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 32 The flowchart shown illustrates the specific process of a user changing the main image of their wallpaper using the wallpaper editing interface. See also... Figure 32 The method may include the following steps:
[0428] Step 3201: The main functional module receives the click operation of the "Change Image" button.
[0429] In some cases, if a user wants to change the main image of their lock screen wallpaper, then... Figure 14 As shown in Figure (a), the user can click the "Change Picture" button 75, and the main functional module will receive the click operation of the "Change Picture" button 75.
[0430] Step 3202: In response to the click operation of the "Change Image" button, the main function module displays the fifth pop-up window.
[0431] For example, such as Figure 14 As shown in Figure (b), the fifth pop-up window 7015 displays the picture options in the gallery.
[0432] Step 3203: The main functional module receives the selection operation for image option 1.
[0433] For example, such as Figure 14 As shown in Figure (b), the user can click on an image option (hereinafter referred to as image option 1) displayed in the fifth pop-up window 7015, and the main function module will receive the selection operation for image option 1.
[0434] Step 3204: In response to the selection operation of image option 1, the main function module obtains the image storage path corresponding to image option 1, and retrieves the image corresponding to image option 1 based on the image storage path.
[0435] For ease of description, the image corresponding to image option 1 will be referred to as the candidate image in the following sections.
[0436] Step 3205: The main functional module replaces the original layer's displayed image with a candidate image.
[0437] Step 3206: The main functional module obtains the location information of the first display area of the lock screen wallpaper page.
[0438] The position information of the first display area of the lock screen wallpaper page is the position information of this display area in the screen coordinate system. Based on the position information of this display area, the corresponding position of the first display area of the lock screen wallpaper page on the screen can be located.
[0439] In implementation, the position information of the first display area of the lock screen wallpaper page can be obtained in the following way: the position information of the first display area of the lock screen wallpaper page is determined based on the position information of the display screen in the screen coordinate system and the ratio of the preset size of the display screen to the size of the first display area of the lock screen wallpaper page.
[0440] In some embodiments, step 3206 may also be: the main functional module obtains the position information of the first display area of the lock screen wallpaper page and the position information of the clock frame in the clock layer.
[0441] The basic information of the clock layer in the currently used lock screen wallpaper file includes the position information of the clock frame. The main functional module can obtain the position information of the clock frame from the lock screen wallpaper file.
[0442] Step 3207: The main functional module sends the candidate image and the location information of the first display area of the lock screen wallpaper page to the image cutout algorithm module.
[0443] In some embodiments, step 3207 may also be: the main functional module sends the candidate image, the position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame to the image cutout algorithm module.
[0444] Step 3208: After receiving the position information of the candidate image and the first display area of the lock screen wallpaper page, the image cutout algorithm module processes the candidate image to generate the first cutout image.
[0445] The first cutout image includes the foreground object of the candidate image. The pixel corresponding to the foreground object in the first cutout image is the first pixel, which is an opaque pixel with a non-zero pixel value. All pixels in the first cutout image other than the first pixel are the second pixels, which are transparent pixels with a zero pixel value.
[0446] In implementation, the process of the matting algorithm module processing the candidate image to generate the first matted image can be as follows: the matting algorithm module performs matting processing on the candidate image to obtain the foreground object of the candidate image, and generates a first matted image with the same size as the candidate image based on the foreground object and transparent pixels.
[0447] In some embodiments, the candidate image does not include a foreground object. In this case, when the image cutout algorithm module performs image cutout processing on the candidate image, it cannot obtain the foreground object of the candidate image. In this case, the main function module does not execute the steps after step 3208 and uses the candidate image as the final image displayed in the first display area of the lock screen wallpaper page.
[0448] In some embodiments, in step 3208, the image matting algorithm module may also receive the position information of the clock frame.
[0449] Step 3209: The image cutout algorithm module processes the candidate images based on the position information of the first display area of the lock screen wallpaper page to obtain the position information of the first area. The first area includes the foreground object of the candidate image, and the aspect ratio of the first area is the same as that of the first display area of the lock screen wallpaper page.
[0450] In implementation, the image matting algorithm module processes candidate images based on the position information of the first display area of the lock screen wallpaper page. The process of obtaining the position information of the first area can be as follows: the image matting algorithm module determines the aspect ratio of the first display area of the lock screen wallpaper page based on the position information of the first display area of the lock screen wallpaper page; the image matting algorithm module performs image matting processing on the candidate images to obtain the foreground object of the candidate images; and the image matting algorithm module generates the position information of the first area including the foreground object based on the aspect ratio of the first display area of the lock screen wallpaper page and the foreground object.
[0451] In some embodiments, step S3209 may also be: the image cutout algorithm module processes the candidate image according to the position information of the first display area of the lock screen wallpaper page and the position information of the clock frame to obtain the position information of the first area. The first area includes the foreground object of the candidate image. The aspect ratio of the first area is the same as that of the first display area of the lock screen wallpaper page. The position of the foreground object of the candidate image in the first area partially overlaps with the position of the clock frame.
[0452] Step 3210: The image matting algorithm module sends the location information of the first region and the first matted image to the main functional module.
[0453] Step 3211: After receiving the location information of the first area and the first cutout image, the main functional module replaces the display image of the cutout layer with the first cutout image.
[0454] Step 3212: The main functional module determines the offset information and scaling ratio information of the first area relative to the first display area of the lock screen wallpaper page based on the position information of the first area and the position information of the first display area of the lock screen wallpaper page.
[0455] For example, assuming the location information of the first area includes coordinates (A1, B1) and the location information of the first display area of the lock screen wallpaper page includes coordinates (A2, B2), then the offset information is (A2-A1, B2-B1).
[0456] In implementation, the process of determining the offset information of the first region relative to the first display area of the lock screen wallpaper page can be as follows: For example, the horizontal offset is obtained by subtracting the horizontal coordinate of the top-left corner vertex of the first region from the horizontal coordinate of the top-left corner vertex of the first region. The vertical offset is obtained by subtracting the vertical coordinate of the top-left corner vertex of the first region from the vertical coordinate of the top-left corner vertex of the first region.
[0457] The process of determining the scaling ratio information of the first region relative to the first display area of the lock screen wallpaper page can be as follows: calculate the size of the first region based on the position information of the first region, calculate the size of the first display area of the lock screen wallpaper page based on the position information of the first display area of the lock screen wallpaper page, obtain the scaling ratio by dividing the length of the first region by the length of the first display area of the lock screen wallpaper page, and obtain the scaling ratio by dividing the width of the first region by the width of the first display area of the lock screen wallpaper page. Since the aspect ratio of the first region and the first display area of the lock screen wallpaper page are the same, the above two scaling ratios are the same.
[0458] Step 3213: The main functional module stores both the candidate image and the first cutout image to the file system, obtaining the storage paths of the candidate image and the first cutout image.
[0459] Step 3214: The main functional module updates the image storage path in the basic layer information of the original layer in the currently used lock screen wallpaper file to the storage path of the candidate image, and updates the image storage path in the basic layer information of the cut-out layer in the lock screen wallpaper file to the storage path of the first cut-out image.
[0460] Step 3215: The main functional module changes the offset information and scaling ratio information in the currently used lock screen wallpaper file to the offset information and scaling ratio information of the first area relative to the first display area of the lock screen wallpaper page, and changes the blur information and depth effect on / off status information in the currently used lock screen wallpaper file to the default values.
[0461] Step 3216: The main functional module determines the first display image corresponding to the candidate image in the original layer and the first display image corresponding to the first cutout image in the cutout layer based on the offset information and scaling ratio information of the first area relative to the first display area of the lock screen wallpaper page, as well as the blur information and depth of field effect on / off status information.
[0462] Step 3217: The main functional module sends the layer identifier of the original layer and the first display image corresponding to the candidate image in the original layer, as well as the layer identifier of the cutout layer and the first display image corresponding to the first cutout image in the cutout layer, to the lock screen view module.
[0463] Step 3218: After receiving the layer identifier of the original layer and the first display image corresponding to the candidate image in the original layer, and the layer identifier of the cutout layer and the first display image corresponding to the first cutout image in the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0464] Step 3219: The lock screen view module displays the lock screen wallpaper page.
[0465] For example, the displayed lock screen wallpaper page can be Figure 14 The lock screen wallpaper page 702 shown in Figure (c) displays a wallpaper whose main image is a picture changed by the user.
[0466] In this embodiment, the electronic device can obtain the position information of the candidate image and the first display area of the lock screen wallpaper page after responding to the user's operation of the "Change Image" button. Then, based on the position information of the first display area and the candidate image, it obtains the position information of the first area. Subsequently, it adjusts the candidate image according to the position information of the first display area and the first area. Compared to when the user selects an image from the electronic device's gallery as wallpaper, which requires the user to manually adjust the position or size of the foreground object in the image on the lock screen or desktop multiple times, this embodiment can adjust the candidate image according to the position information of the first display area and the first area, thereby automatically adjusting the position or size of the foreground object in the image on the lock screen or desktop, simplifying user operation, and displaying a better wallpaper effect, thus improving the user experience.
[0467] It should be understood that embodiments of this application may include various types of wallpaper templates. For example, please refer again... Figure 4 One type of wallpaper template includes an original layer and a clock layer. Another type may include an original layer, a color background layer, a clock layer, and a cutout layer. Yet another type may include layers, a decoration layer 1, a clock layer, and a decoration layer 2. Of course, these are not the only examples; the number of layers in a wallpaper template can be flexibly configured according to actual needs.
[0468] User utilization Figure 32 The flowchart shown allows users to change the main image in most wallpaper templates based on the wallpaper editing interface. In some embodiments, certain types of wallpaper templates include multiple decorative layers, which, when displayed together, create a frame effect. Figure 32 Following step 3216, the following steps may also be included; please refer to [the provided text]. Figure 32 .
[0469] Step 3220: The main functional module obtains the position information of the security lines in multiple decorative layers, and the multiple decorative layers are displayed in a frame effect.
[0470] It should be understood that the basic layer information of the decorative layer with the frame effect in the currently used lock screen wallpaper file includes the position information of the security line. The main functional module can obtain the position information of the security line in multiple decorative layers from the lock screen wallpaper file.
[0471] For example, please refer to Figure 6 (a) in the middle, Figure 6In (a), decorative layer 1 and decorative layer 3 are shown to have a frame effect when superimposed. The upper part of decorative layer 1 has half a frame, and the lower part of decorative layer 2 has half a frame. The safety line is the boundary line when the upper and lower half frames are superimposed.
[0472] Step 3221: The main functional module sends the location information of multiple security lines, the location information of the first display area of the lock screen wallpaper page, and the first display image corresponding to the first cutout image to the security line detection module.
[0473] The location information of the first display area of the lock screen wallpaper page can be referred to in the above embodiment, and will not be repeated here.
[0474] The main functional module can generate the first display image corresponding to the first cutout image through step 3216.
[0475] Step 3222: After receiving the position information of multiple security lines, the position information of the first display area of the lock screen wallpaper page, and the first display image corresponding to the first cutout image, the security line detection module determines the first mapping area of the lock screen wallpaper page mapped to the first display image of the cutout layer based on the position information of the first display area of the lock screen wallpaper page and the first display image corresponding to the first cutout image, and generates the position information of the first mapping area. The first mapping area includes the foreground object in the first display image corresponding to the first cutout image.
[0476] Step 3223: The security line detection module determines the target security line that the multiple security lines are mapped to the first mapping area based on the position information of the multiple security lines and the position information of the first mapping area, and generates the position information of the target security line.
[0477] Step 3224: The security line detection module determines the number of first pixels on the target security line based on the position information of the target security line.
[0478] The first display image corresponding to the first cutout image includes the foreground object of the first cutout image. The pixel corresponding to the foreground object in the first display image corresponding to the first cutout image is called the first pixel. The first pixel refers to an opaque pixel, and the pixel value of an opaque pixel is not 0. The pixels in the first display image corresponding to the first cutout image other than the first pixel are called the second pixels. The second pixels refer to transparent pixels, and the pixel value of a transparent pixel is 0.
[0479] In implementation, the security line detection module can traverse the pixels on the target security line to obtain the pixel value of each pixel on the target security line. The security line detection module determines the number of the first pixel on the target security line by calculating the number of pixels on the target security line whose pixel value is not 0.
[0480] Step 3225: The security line detection module determines that the number of the first pixel points is equal to the first threshold and sends the first detection result to the main functional module.
[0481] In this embodiment of the application, the value of the first threshold is relatively small. For example, the first threshold can be an integer from zero to ten. Specifically, the first threshold can be zero. Of course, in other embodiments, the first threshold can also be other values. This application does not limit the value of the first threshold.
[0482] The first detection result indicates that the number of first pixels equals the first threshold. The number of first pixels equaling the first threshold indicates that the foreground object has not touched the target safety line. When the foreground object has not touched the target safety line, the wallpaper template can be displayed with better visual effect through the first display area of the lock screen wallpaper page; conversely, when the foreground object has touched the target safety line, the first display area of the lock screen wallpaper page displays poorer visual effect.
[0483] Step 3226: After receiving the first detection result, the main functional module executes steps 3217 and 3218.
[0484] The wallpaper templates displayed on the lock screen wallpaper page in the lock screen view module have a better visual effect.
[0485] Step 3227: The security line detection module determines that the number of first pixels is greater than the first threshold and sends the second detection result to the main functional module.
[0486] The second detection result indicates that the number of first pixels is greater than the first threshold. A number of first pixels greater than the first threshold indicates that the foreground object has touched the target safety line.
[0487] Step 3228: After receiving the second detection result, the main functional module replaces the first display image corresponding to the option image in the original layer with the option image, and replaces the first display image corresponding to the first cutout image in the cutout layer with the first cutout image.
[0488] The display image corresponding to the option image and the first display image corresponding to the first cutout image are generated by the main functional module in step 3216. The first cutout image is generated by the cutout algorithm module in step 3208. The option image is obtained by the main functional module in step 3204.
[0489] Step 3229: The main functional module obtains the position information of the transparent areas in multiple decorative layers. When multiple decorative layers are displayed on top of each other, they have a frame effect. Based on the position information of the transparent areas in multiple decorative layers, the position information of the second display area of the lock screen wallpaper page is determined. The second display area of the lock screen wallpaper page is smaller than the first display area of the lock screen wallpaper page.
[0490] It should be understood that the base layer information of the decorative layer with a frame effect in the currently used lock screen wallpaper file includes the position information of the transparent areas. Pixels in the transparent areas of the decorative layer with a frame effect have a pixel value of 0, while pixels corresponding to the frame effect portion have a non-zero pixel value.
[0491] The decorative layer with the picture frame effect has two layers. The first decorative layer's base layer information includes the position information of the transparent area, which can be... Figure 6 (a) shows the upper half of decorative layer 1, excluding the picture frame. The location information of the transparent area included in the layer base information of the second decorative layer can be referenced. Figure 6 (a) shows the lower half of decorative layer 3, excluding the picture frame.
[0492] Step 3230: The main functional module sends the option image and the second display area of the lock screen wallpaper page to the image cutout algorithm module.
[0493] Step 3231: After receiving the option image and the second display area of the lock screen wallpaper page, the image cutout algorithm module processes the option image according to the second display area of the lock screen wallpaper page to obtain the position information of the second area. The second area includes the foreground object of the option image, and the aspect ratio of the second area is the same as that of the second display area of the lock screen wallpaper page.
[0494] In implementation, the image cutout algorithm module processes the option image based on the position information of the second display area of the lock screen wallpaper page. The process of obtaining the position information of the second area can be as follows: the image cutout algorithm module determines the aspect ratio of the second display area of the lock screen wallpaper page based on the position information of the second display area of the lock screen wallpaper page; the image cutout algorithm module performs image cutout processing on the option image to obtain the foreground object of the option image; and the image cutout algorithm module generates the position information of the second area including the foreground object based on the aspect ratio of the second display area of the lock screen wallpaper page and the foreground object.
[0495] Step 3232: The image matting algorithm module sends the location information of the second region to the main functional module.
[0496] Step 3233: The main functional module determines the offset and scaling information of the second area relative to the second display area of the lock screen wallpaper page based on the location information of the second area and the location information of the second display area of the lock screen wallpaper page.
[0497] The implementation process of step 3233 can be referred to the process of determining the offset information and scaling ratio information of the first area relative to the first display area of the lock screen wallpaper page based on the position information of the first area and the position information of the first display area of the lock screen wallpaper page in the main functional module. It will not be elaborated here.
[0498] Step 3234: The main functional module changes the offset and scaling information of the first region in the currently used lock screen wallpaper file relative to the first display area of the lock screen wallpaper page to the offset and scaling information of the second region relative to the second display area of the lock screen wallpaper page.
[0499] In the above embodiment, the main functional module changes the offset information and scaling ratio information in the currently used lock screen wallpaper file to the offset information and scaling ratio information of the first region relative to the first display area of the lock screen wallpaper page. Therefore, here the offset information and scaling ratio information of the first region relative to the first display area of the lock screen wallpaper page are changed.
[0500] The blur information and depth-of-field effect on / off status information in the currently used lock screen wallpaper file have not been changed and are at their default values.
[0501] Step 3235: The main functional module determines the second display image corresponding to the option image in the original layer and the second display image corresponding to the first cutout image in the cutout layer based on the offset information and scaling information of the second area relative to the second display area of the lock screen wallpaper page, as well as the blur information and depth of field effect on / off status information.
[0502] Step 3236: The main functional module sends the layer identifier of the original layer and the second display image corresponding to the option image in the original layer, as well as the layer identifier of the cutout layer and the second display image corresponding to the first cutout image in the cutout layer, to the lock screen view module.
[0503] Step 3237: After receiving the layer identifier of the original layer and the second display image corresponding to the option image in the original layer, and the layer identifier of the cutout layer and the second display image corresponding to the first cutout image in the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0504] Step 3238: The lock screen view module displays the lock screen wallpaper page.
[0505] Figure 33 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 33 The flowchart shown illustrates the specific process of how a user zooms in and out of the main image of the wallpaper using the wallpaper editing interface. See also... Figure 33 The method may include the following steps:
[0506] Step 3301: The main functional module receives zoom operations on the lock screen wallpaper page.
[0507] In some cases, if a user wants to zoom in on the main image of the lock screen wallpaper, then... Figure 15 As shown in Figure (a) or (c), users can zoom in and out on the lock screen wallpaper page, and the main functional module will receive this zoom operation.
[0508] Step 3302: In response to the scaling operation, the main functional module determines the target scaling ratio and the target offset.
[0509] The target scaling factor is the scaling factor corresponding to this scaling operation. The target offset is the offset corresponding to this scaling operation.
[0510] For example, when the zoom operation is a two-finger zoom-in or two-finger zoom-out operation, the target zoom ratio and target offset can be determined based on the sliding direction, sliding distance, sliding position, etc. of the two fingers.
[0511] Step 3303: The main functional module updates the scaling ratio in the scaling ratio information of the currently used lock screen wallpaper file to the product of the scaling ratio and the target scaling ratio, and updates the offset in the offset information of the lock screen wallpaper file to the sum of the offset and a specific offset, where the specific offset is obtained by dividing the target offset by the specific scaling ratio.
[0512] Step 3304: The main functional module processes the full-screen image of the original layer and the full-screen image of the cutout layer based on the offset information, scaling ratio information, blur information, and specific scaling ratio in the lock screen wallpaper file, to obtain the third display image of the original layer and the third display image of the cutout layer.
[0513] The operation in step 3304 is similar to the related operation in step 2407 above, and will not be described again in this embodiment.
[0514] Step 3305: The main functional module obtains the first position information of the first display area of the lock screen wallpaper page and the position information of the clock frame in the clock layer.
[0515] The implementation method of step 3305 has been described in the above embodiments and will not be repeated here.
[0516] Step 3306: The main functional module sends the third display image of the cutout layer, the position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame in the clock layer to the depth detection module.
[0517] Step 3307: After receiving the position information of the third display image of the cutout layer, the first display area of the lock screen wallpaper page, and the position information of the clock frame in the clock layer sent by the depth detection module, the depth detection module determines the second mapping area of the first display area of the lock screen wallpaper page mapped onto the third display image of the cutout layer based on the position information of the third display image of the cutout layer and the first display area of the lock screen wallpaper page, and generates the position information of the second mapping area, which includes the foreground object of the third display image.
[0518] Step 3308: The depth detection module determines the third mapping area to which the clock frame is mapped from the second mapping area based on the position information of the clock frame and the position information of the second mapping area, and generates the position information of the third mapping area.
[0519] Step 3309: The depth detection module determines the position information of the line connecting the midpoints of the short sides of the third mapping region based on the position information of the third mapping region.
[0520] Step 3310: The depth detection module determines the number of first pixels on the line connecting the midpoints of the short sides of the third mapping region based on the position information of the line connecting the midpoints of the short sides of the third mapping region.
[0521] The implementation process of step 3310 can refer to the implementation process of the security line detection module determining the number of first pixels on the target security line based on the position information of the target security line, which will not be repeated here.
[0522] In some embodiments, the depth detection module can also determine the position information of the short side vertex connection line of the third mapping region based on the position information of the third mapping region, and determine the number of first pixels on the short side midpoint connection line of the third mapping region based on the position information of the short side vertex connection line of the third mapping region. This application embodiment does not limit this.
[0523] Step 3311: The depth detection module determines that the number of the first pixel is less than the second threshold and sends the third detection result to the main functional module.
[0524] In this embodiment, the value of the second threshold is relatively large compared to the first threshold. For example, the second threshold can be an integer from 70 to 90. Specifically, the second threshold can be 80. Of course, in other embodiments, the second threshold can also be other values. This application does not limit the value of the second threshold.
[0525] The third detection result indicates that the number of first pixels is less than the second threshold. A number of first pixels less than the second threshold indicates that the foreground object covers a portion of the lower half of the clock frame. When the foreground object covers a portion of the lower half of the clock frame, the depth-of-field effect of the wallpaper template can be displayed through the first display area of the lock screen wallpaper page. Conversely, if the number of first pixels is greater than or equal to the second threshold, it indicates that the foreground object covers a portion of the upper half of the clock frame. When the foreground object covers a portion of the upper half of the clock frame, the depth-of-field effect of the wallpaper template may not be displayed through the first display area of the lock screen wallpaper page.
[0526] Step 3312: After receiving the third detection result, the main functional module changes the depth-of-field effect switch status information in the currently used lock screen wallpaper file to the on state and sets the visibility of the cutout layer to visible.
[0527] Step 3313: The main functional module sends the layer identifier and third display image of the original layer, the layer identifier and third display image of the cut-out layer, and the visibility of the cut-out layer to the lock screen view module.
[0528] Step 3314: After receiving the layer identifier and third display image of the original layer, the layer identifier and third display image of the cutout layer, and the visibility of the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0529] Step 3315: The lock screen view module displays the lock screen wallpaper page.
[0530] For example, the displayed lock screen wallpaper page can be Figure 15 The lock screen wallpaper page 702 shown in Figure (b) or (d) has its main image of the wallpaper enlarged or reduced accordingly.
[0531] It should be noted that the process of moving the main image of the lock screen wallpaper is similar to the process of scaling the main image of the lock screen wallpaper as described above, and will not be repeated in this embodiment.
[0532] Step 3316: The depth detection module determines that the number of the first pixel is greater than or equal to the second threshold, and sends the fourth detection result to the main functional module.
[0533] Step 3317: After receiving the fourth detection result, the main functional module changes the depth-of-field effect switch status information in the currently used lock screen wallpaper file to the off state and sets the visibility of the cutout layer to invisible.
[0534] Step 3318: The main functional module sends the layer identifier and third display image of the original layer, the layer identifier and third display image of the cut-out layer, and the visibility of the cut-out layer to the lock screen view module.
[0535] Step 3319: After receiving the layer identifier and third display image of the original layer, the layer identifier and third display image of the cutout layer, and the visibility of the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0536] Step 3320: The lock screen view module displays the lock screen wallpaper page.
[0537] For example, the displayed lock screen wallpaper page can be Figure 15 The lock screen wallpaper page 702 shown in Figure (b) or (d) has its main image of the wallpaper enlarged or reduced accordingly.
[0538] It should be noted that the process of moving the main image of the lock screen wallpaper is similar to the process of scaling the main image of the lock screen wallpaper as described above, and will not be repeated in this embodiment.
[0539] In this embodiment, the electronic device can respond to operations on the lock screen wallpaper page by generating position information of a third mapping area based on the position information of the third display image of the cutout layer, the first display area of the lock screen wallpaper page, and the position information of the clock frame. Based on the position information of the third mapping area and the foreground object of the third display image of the cutout layer, the visibility of the cutout layer is determined. When the cutout layer is visible, a depth-of-field effect can be displayed when the cutout layer and the clock layer are superimposed. In other words, during user operations on the lock screen wallpaper page, the electronic device can display a depth-of-field effect in real time based on user actions, thus improving the user experience.
[0540] It should be understood that embodiments of this application may include various types of wallpaper templates. For example, please refer again... Figure 4 One type of wallpaper template includes an original layer and a clock layer. Another type may include an original layer, a color background layer, a clock layer, and a cutout layer. Yet another type may include layers, a decoration layer 1, a clock layer, and a decoration layer 2. Of course, these are not the only examples; the number of layers in a wallpaper template can be flexibly configured according to actual needs.
[0541] User utilization Figure 33The flowchart shown allows users to move or zoom the main image in most wallpaper templates via the wallpaper editing interface and display a depth-of-field effect. In some embodiments, some types of wallpaper templates include multiple decorative layers that, when stacked, create a frame effect. To display a depth-of-field effect when moving or zooming the main image in a wallpaper template with a frame effect via the wallpaper editing interface, the following steps may be added after step 3304 above:
[0542] Step 3321: The main functional module obtains the position information of the security lines in multiple decorative layers, and the multiple decorative layers are displayed in a frame effect.
[0543] Step 3322: The main functional module sends the position information of multiple safety lines, the position information of the first display area of the lock screen wallpaper page, and the third display image of the cutout layer to the depth detection module.
[0544] Step 3323: After receiving the position information of multiple safety lines, the position information of the first display area of the lock screen wallpaper page, and the third display image of the cutout layer, the depth detection module determines the mapping of the first display area of the lock screen wallpaper page to the fourth mapping area of the third display image of the cutout layer based on the position information of the first display area of the lock screen wallpaper page and the third display image, and generates the position information of the fourth mapping area, which includes the foreground object in the third display image.
[0545] Step 3324: The depth detection module determines the target safety line that the multiple safety lines are mapped to the fourth mapping area based on the position information of the multiple safety lines and the position information of the fourth mapping area, and generates the position information of the target safety line.
[0546] Step 3225: The depth detection module determines the number of first pixels on the target safety line based on the position information of the target safety line.
[0547] Step 3226: The depth detection module determines that the number of the first pixel points is equal to the first threshold and sends the first detection result to the main functional module.
[0548] Step 3227: After receiving the first detection result and the third detection result, the depth detection module changes the depth effect switch status information in the currently used lock screen wallpaper file to the on state and sets the visibility of the cutout layer to visible.
[0549] Step 3328: The main functional module sends the layer identifier and third display image of the original layer, the layer identifier and third display image of the cut-out layer, and the visibility of the cut-out layer to the lock screen view module.
[0550] Step 3329: After receiving the layer identifier and third display image of the original layer, the layer identifier and third display image of the cutout layer, and the visibility of the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0551] Step 3330: The lock screen view module displays the lock screen wallpaper page.
[0552] Step 3331: The depth detection module determines that the number of first pixels is greater than the first threshold and sends the second detection result to the main functional module.
[0553] Step 3332: After receiving the second detection result, the depth detection module changes the depth effect switch status information in the currently used lock screen wallpaper file to the off state and sets the visibility of the cutout layer to invisible.
[0554] Step 3333: The main functional module sends the layer identifier and third display image of the original layer, the layer identifier and third display image of the cut-out layer, and the visibility of the cut-out layer to the lock screen view module.
[0555] Step 3334: After receiving the layer identifier and third display image of the original layer, the layer identifier and third display image of the cutout layer, and the visibility of the cutout layer, the lock screen view module updates the display information of the original layer and the display information of the cutout layer in the wallpaper display information.
[0556] Step 3335: The lock screen view module displays the lock screen wallpaper page.
[0557] Figure 34 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 34 The flowchart shown illustrates the specific process of a user setting their desktop wallpaper using the wallpaper editing interface. See also... Figure 34 The method may include the following steps:
[0558] Step 3401: The main functional module receives the click operation on the follow lock screen button.
[0559] In some cases, if a user wants the main image of their desktop wallpaper and lock screen wallpaper to be the same, then... Figure 18 As shown in Figure (b), the user can click the Follow Lock Screen button 76, and the main functional module will receive the click operation of the Follow Lock Screen button 76.
[0560] Step 3402: In response to a click on the follow lock screen button, the main function module generates a desktop wallpaper file.
[0561] This desktop wallpaper file contains basic layer information, offset information, scaling information, and blur information of the original layers in the currently edited lock screen wallpaper file. For example, this desktop wallpaper file can be a JSON file.
[0562] The main functional module can save the desktop wallpaper file as the currently edited desktop wallpaper file in memory, and subsequent editing processes will modify the currently edited desktop wallpaper file.
[0563] The main functional module can parse the desktop wallpaper file to obtain the display information of the original layers. The operation of the main functional module in parsing the desktop wallpaper file is similar to the operation of the main functional module in parsing the wallpaper module file in step 2407 above, and will not be described again in this embodiment.
[0564] Step 3403: The main functional module sends the display information of the original layer to the desktop view module.
[0565] Step 3404: After receiving the display information of the original layer, the desktop view module displays the desktop wallpaper page.
[0566] For example, the displayed desktop wallpaper page can be Figure 18 The desktop wallpaper page 703 shown in Figure (c) has the same main image as the wallpaper on the lock screen wallpaper page 702.
[0567] In some embodiments, after a user edits the desktop wallpaper by scaling or moving the main image, the user can also save the edited desktop wallpaper to make it effective. This process may include the following steps 3405 and 3407.
[0568] Step 3405: The main functional module receives click operations on the application button.
[0569] Step 3406: The main functional module sends a wallpaper data storage request to the file system.
[0570] This wallpaper data storage request is used to request the storage of desktop wallpaper file 1. Desktop wallpaper file 1 is the currently edited desktop wallpaper file, and in this embodiment, it is the desktop wallpaper file generated by the main module of the "Follow Lock Screen" function based on the lock screen wallpaper file.
[0571] Step 3407: After receiving the wallpaper data storage request, the file system updates the desktop wallpaper file.
[0572] For example, the file system can update the first file of the desktop wallpaper to desktop wallpaper file 1.
[0573] In some embodiments, when the desktop wallpaper is in the state of following the lock screen, the main functional module can synchronize the updated information to the desktop wallpaper file when the layer base information, offset information, scaling ratio information and blur information of the original layer in the lock screen wallpaper file are updated, and then display the desktop wallpaper on the desktop wallpaper page according to the desktop wallpaper file, so that the desktop wallpaper can be consistent with the main image of the lock screen wallpaper.
[0574] Figure 35 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 35 The flowchart shown illustrates the specific process of a user setting their desktop wallpaper using the wallpaper editing interface. See also... Figure 35 The method may include the following steps:
[0575] Step 3501: The main functional module receives the click operation on the color button.
[0576] In some cases, if a user wants to set a solid color wallpaper or a gradient wallpaper for their desktop, they can do so as follows: Figure 19 As shown in Figure (a), the user can click the color button 77, and the main functional module will receive the click operation of the color button 77.
[0577] Step 3502: In response to the click operation of the color button, the main function module displays the sixth pop-up window.
[0578] For example, such as Figure 19 As shown in Figure (b), the sixth pop-up window 7016 displays a gradient color switch and multiple color options.
[0579] Step 3503: The main functional module receives the selection operation for color option 1.
[0580] For example, such as Figure 19 As shown in Figure (b), the user can click on a color option (hereinafter referred to as color option 1) displayed in the sixth pop-up window 7016, and the main functional module will receive the selection operation for color option 1.
[0581] Step 3504: In response to the selection operation of color option 1, the main function module determines the color corresponding to color option 1.
[0582] Step 3505: When the gradient color switch is off, the main functional module generates a solid color image with the screen size and the color corresponding to color option 1 as the specified image; when the gradient color switch is on, it generates a gradient color image with the screen size and the color corresponding to color option 1 as the specified image.
[0583] Step 3506: The main functional module stores the specified image to the file system and obtains the storage path of the specified image.
[0584] Step 3507: The main functional module updates the image storage path in the layer basic information of the original layer in the desktop wallpaper file to the storage path of the specified image.
[0585] Step 3508: The main functional module parses the desktop wallpaper file to obtain the display information of the original layers.
[0586] Step 3509: The main function sends the display information of the original layer to the desktop view module.
[0587] Step 3510: After receiving the display information of the original layer, the desktop view module displays the desktop wallpaper page.
[0588] For example, the displayed desktop wallpaper page can be Figure 19 The desktop wallpaper page 703 shown in Figure (c) displays a solid color image set by the user.
[0589] In some embodiments, after a user edits the desktop wallpaper by setting a solid color wallpaper or a gradient wallpaper, the user can also save the edited desktop wallpaper to make it effective. This process may include the following steps 3511 and 3513.
[0590] Step 3511: The main functional module receives click operations on the application button.
[0591] Step 3512: The main functional module sends a wallpaper data storage request to the file system.
[0592] This wallpaper data storage request is used to request the storage of desktop wallpaper file 2. Desktop wallpaper file 2 is the currently edited desktop wallpaper file, which in this embodiment is the desktop wallpaper file updated by the main functional module according to the set wallpaper after the user sets a solid color wallpaper or a gradient wallpaper.
[0593] Step 3513: After receiving the wallpaper data storage request, the file system updates the desktop wallpaper file.
[0594] For example, the file system can update the first file of the desktop wallpaper to the second file of the desktop wallpaper.
[0595] In some embodiments, users can select an image as their desktop wallpaper using the "Select Wallpaper" button in the wallpaper editing interface. This process is similar to the process described above where users change the main image of their lock screen wallpaper using the "Change Image" button, and will not be repeated here.
[0596] In some embodiments, users can adjust the blur of the desktop wallpaper using the blur button in the wallpaper editing interface. This process is similar to the process described above where users adjust the blur of the main image of the lock screen wallpaper using the background blur control, and will not be repeated here.
[0597] In some embodiments, users can zoom or move the desktop wallpaper on the desktop wallpaper page. This process is similar to the process described above where users zoom or move the main image of the lock screen wallpaper on the lock screen wallpaper page, and will not be repeated here.
[0598] As an example, after editing the lock screen wallpaper and / or desktop wallpaper using one or more of the above editing functions, if a user does not wish to save the edited lock screen wallpaper and / or desktop wallpaper, they can click the back button in the wallpaper editing interface. In this case, the main function module can clear the currently edited lock screen wallpaper file and desktop wallpaper file from memory.
[0599] As another example, after users edit the lock screen wallpaper and / or desktop wallpaper using one or more of the above editing functions, they can also save the edited lock screen wallpaper and / or desktop wallpaper to make it effective.
[0600] In some embodiments, such as Figure 16 As shown in Figure (a), the main functional module can receive a click operation on the application button. In response to this click operation, the main functional module updates and stores the currently edited lock screen wallpaper file as the first file of the lock screen wallpaper to the file system, and updates and stores the currently edited desktop wallpaper file as the first file of the desktop wallpaper to the file system.
[0601] Furthermore, in response to this click operation, the main functional module can also generate a second lock screen wallpaper file based on the currently edited lock screen wallpaper file. This second lock screen wallpaper file includes a first wallpaper image, clock information, and a second wallpaper image. The first wallpaper image is composed of the superimposed target images of all layers below the clock layer in the lock screen wallpaper file. The clock information may include the layout, font, and color of the clock layer. The second wallpaper image is composed of the superimposed target images of all layers above the clock layer in the lock screen wallpaper file. The main functional module can update and store this second lock screen wallpaper file in the file system. Thus, when displaying the lock screen wallpaper, the lock screen application can retrieve the second lock screen wallpaper file from the file system and then sequentially overlay the first wallpaper image, the clock layer, and the second wallpaper image to display the lock screen wallpaper—simple and fast.
[0602] Similarly, in response to this click, the main functional module can also generate a second file of the desktop wallpaper based on the currently edited wallpaper file. This second file includes the target images of the original layers from the original wallpaper file. The main functional module can then update and store this second file of the wallpaper in the file system. In this way, when the desktop application displays the wallpaper, it can retrieve the second file of the wallpaper from the file system and then directly display the images from that second file—simple and fast.
[0603] The above text Figure 21 Examples to Figure 35 The example provides a detailed description of the specific implementation process for displaying the wallpaper editing interface when using the wallpaper editing function for the first time, and for editing the wallpaper based on the wallpaper editing interface. The following describes the specific implementation process for using the wallpaper editing function again.
[0604] Figure 36 This is a flowchart of a wallpaper editing method provided in an embodiment of this application. Figure 36 The flowchart shown illustrates the specific process of displaying the wallpaper editing interface when the wallpaper editing function is used again. See also... Figure 36 The method may include the following steps:
[0605] Step 3601: The desktop application receives the second gesture operation.
[0606] The second gesture operation can be a predefined gesture operation. For example, the second gesture operation can be a two-finger pinch operation, a long press operation, a double-tap operation, an S-shaped swipe operation, etc., and this application embodiment does not limit it.
[0607] For example, suppose the second gesture is a two-finger pinch gesture, such as Figure 9 As shown in Figure (a), when the electronic device displays desktop 900, the user can pinch two fingers on desktop 900. In this case, the desktop application can receive the pinch operation on desktop 900. The pinch operation triggered on desktop 900 is used to indicate entry into the desktop editing interface.
[0608] Step 3602: In response to the second gesture operation, the desktop application displays the desktop editing interface.
[0609] For example, such as Figure 9 As shown in Figure (b), the desktop editing interface can display relevant buttons for editing the desktop, such as wallpaper buttons, card buttons, effect switching buttons, desktop settings buttons, etc.
[0610] Step 3603: The desktop application receives the click action on the wallpaper button.
[0611] For example, such as Figure 9 As shown in Figure (b), users can click the wallpaper button in the desktop editing interface to enter the wallpaper editing function.
[0612] Step 3604: In response to the click on the wallpaper button, the desktop application sends a second message to the gallery application.
[0613] For example, the second message could be an intent message.
[0614] The second message can carry source information, which indicates which application the second message comes from. For example, the source information in the second message could be the application identifier of a desktop application.
[0615] In some implementations, the first message may also carry the storage path of the desktop wallpaper.
[0616] Since clicking the wallpaper button indicates access to the wallpaper editing function, the desktop application, upon receiving a click on the wallpaper button, can send a second message to the gallery application, instructing the gallery application to display the wallpaper editing interface.
[0617] Step 3605: After receiving the second message, the main functional module in the gallery application determines that the second message comes from the desktop application, and then displays the function button.
[0618] The main functional module can determine whether the second message comes from a desktop application based on the source information in the second message.
[0619] In some embodiments, if the main functional module determines that the second message originates from a desktop application, then the main functional module can determine that the display area of the desktop wallpaper page is a preset third display area within the screen, and the display area of the lock screen wallpaper page is a preset fourth display area, wherein the fourth display area is either partially within the screen or completely outside the screen. In this case, such as Figure 9 As shown in Figure (c), the main functional module can first display the main function button and the function button for editing the desktop wallpaper, while temporarily not displaying the function button for editing the lock screen wallpaper.
[0620] The third display area is the same size as the fourth display area. The aspect ratios of both the third and fourth display areas are the same as the screen ratio of the electronic device.
[0621] For example, such as Figure 37As shown, when the second message comes from the desktop application, the main functional module can determine that the display area of the desktop wallpaper page is the preset display area C within the screen, while the display area of the lock screen wallpaper page is the preset display area D. Only a very small portion of display area D is within the screen, with the majority located off-screen. In this case, the user can see the complete desktop wallpaper page, but only a very small portion of the lock screen wallpaper page.
[0622] In some embodiments, if the main functional module determines that the second message comes from a desktop application, it may also display a mask.
[0623] As an example, the main functional module can retrieve the corresponding image based on the storage path of the image carried in the second message (i.e., the desktop wallpaper mentioned above), or it can retrieve a preset image. Then, the main functional module can adjust the image according to the screen information to make its size match the screen size, blur the image to obtain the overlay, and then display the overlay.
[0624] Step 3606: The main functional module sends a wallpaper data retrieval request to the file system.
[0625] This wallpaper data retrieval request is used to request lock screen wallpaper files and desktop wallpaper files.
[0626] Step 3607: After receiving the wallpaper data retrieval request, the file system sends the lock screen wallpaper file and desktop wallpaper file to the main functional module.
[0627] After receiving a wallpaper data retrieval request from the main functional module of the gallery application, the file system can send the first file of the lock screen wallpaper as the lock screen wallpaper file to the main functional module, and also send the first file of the desktop wallpaper as the desktop wallpaper file to the main functional module.
[0628] Since the wallpaper editing function has already been used, the first file for the lock screen wallpaper contains layer set information, offset information, scaling information, blur information, and depth-of-field effect on / off status information, while the first file for the desktop wallpaper contains the original layer's basic information, offset information, scaling information, blur information, etc. For example, both the first file for the lock screen wallpaper and the first file for the desktop wallpaper are JSON files.
[0629] Step 3608: After receiving the lock screen wallpaper file and the desktop wallpaper file, the main functional module parses the lock screen wallpaper file to obtain the lock screen wallpaper display information, and parses the desktop wallpaper file to obtain the desktop wallpaper display information.
[0630] The operation of step 3608 is similar to that of step 2407 above, and will not be described again in this embodiment.
[0631] It should be noted that after the main functional module receives the lock screen wallpaper file and the desktop wallpaper file, it can save the lock screen wallpaper file as the currently edited lock screen wallpaper file in memory, and save the desktop wallpaper file as the currently edited desktop wallpaper file in memory. Subsequent editing processes will modify the currently edited lock screen wallpaper file and the currently edited desktop wallpaper file.
[0632] Step 3609: The main functional module sends a fourth display request to the lock screen view module and a fifth display request to the desktop view module.
[0633] The fourth display request is used to request the display of the lock screen wallpaper page. The fourth display request may carry lock screen wallpaper display information, and may further carry the location information of the display area of the lock screen wallpaper page.
[0634] The fifth display request is used to request the display of the desktop wallpaper page. The fifth display request may carry desktop wallpaper display information, and may further carry location information of the display area of the desktop wallpaper page.
[0635] Step 3610: After receiving the fourth display request, the lock screen view module displays the lock screen wallpaper page.
[0636] Step 3611: After receiving the fifth display request, the desktop view module displays the desktop wallpaper page.
[0637] After completing the steps outlined above to display the function buttons, lock screen wallpaper page, and desktop wallpaper page, the wallpaper editing interface is now complete. For example, the displayed wallpaper editing interface could be... Figure 9 The wallpaper editing interface 703 is shown in Figure (c).
[0638] After the wallpaper editing interface is displayed, users can edit the lock screen wallpaper or desktop wallpaper. The specific editing process has been described above. Figure 24 Examples to Figure 35 The embodiments are described in detail, and will not be repeated here.
[0639] It should be understood that the sequence number of each step in the above embodiments does not imply the order of execution. The execution order of each process should be determined by its function and internal logic, and should not constitute any limitation on the implementation process of the embodiments of this application.
[0640] In the above embodiments, the descriptions of each embodiment have different focuses. For parts that are not described in detail or recorded in a certain embodiment, please refer to the relevant descriptions of other embodiments.
[0641] This application also provides a computer-readable storage medium storing a computer program, which, when executed by a processor, can implement the steps in the above-described method embodiments.
[0642] This application also provides a computer program product that, when run on an electronic device, enables the electronic device to perform the steps described in the various method embodiments above.
[0643] This application also provides a chip system, which includes a processor coupled to a memory. The processor executes a computer program stored in the memory to implement the steps of any method embodiment of this application. The chip system can be a single chip or a chip module composed of multiple chips.
[0644] In the above embodiments, implementation can be achieved, in whole or in part, through software, hardware, firmware, or any combination thereof. When implemented in software, it can be implemented, in whole or in part, as a computer program product. The computer program product includes one or more computer instructions. When the computer instructions are loaded and executed on a computer, all or part of the processes or functions described in the embodiments of this application are generated. 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. For example, the computer instructions can be transmitted from one website, computer, server, or data center to another via wired (e.g., coaxial cable, fiber optic, Digital Subscriber Line, DSL) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium can be any available medium accessible to a computer, or a data storage device such as a server or data center that integrates one or more available media. The available media can be magnetic media (e.g., floppy disks, hard disks, magnetic tapes), optical media (e.g., Digital Versatile Discs (DVDs)), or semiconductor media (e.g., Solid State Disks (SSDs)).
[0645] The above-described embodiments are optional embodiments provided by this application and are not intended to limit this application. Any modifications, equivalent substitutions, improvements, etc., made within the technical scope disclosed in this application should be included within the protection scope of this application.
Claims
1. A wallpaper editing method, characterized in that, The method includes: Display a lock screen wallpaper page, which includes a "Change Picture" button; In response to the operation of the image change button, the position information of the candidate image and the first display area of the lock screen wallpaper page is obtained, wherein the candidate image includes a foreground object; Based on the location information of the first display area and the candidate image, the location information of the first area is obtained. The first area includes the foreground object, and the aspect ratio of the first area is the same as that of the first display area. Based on the location information of the first display area and the location information of the first area, the candidate image is adjusted to obtain the first display image corresponding to the candidate image; The first display image corresponding to the candidate image is displayed in the first display area; The method further includes: The candidate images are processed to generate the first cutout image; Based on the location information of the first display area and the location information of the first area, the first cutout image is adjusted to obtain the first display image corresponding to the first cutout image; The first display image corresponding to the first cutout image is displayed in the first display area; The currently used lock screen wallpaper file includes multiple decorative layers with frame effects, and the method further includes: Obtain the position information of the security lines on the images in multiple decorative layers; Based on the location information of the first display area and the first display image corresponding to the first cutout image, multiple security lines are determined to be mapped to the first mapping area as target security lines, and the location information of the target security lines is generated. Based on the position information of the target safety line, determine the number of first pixels on the target safety line, where the pixel value of the first pixel is zero; If the number of the first pixel is determined to be greater than the first threshold, the candidate image is adjusted based on the position information of the transparent areas on the images of the multiple decorative layers to obtain the second display image corresponding to the candidate image; A second display image corresponding to the candidate image is displayed in a transparent area on the images of the multiple decorative layers.
2. The method according to claim 1, characterized in that, The step of adjusting the candidate image based on the position information of the first display area and the position information of the first area to obtain the first display image corresponding to the candidate image includes: Based on the position information of the first display area and the position information of the first region, determine the offset information and scaling ratio information of the first region relative to the first display area; Based on the offset information and the scaling information, the candidate image is adjusted to obtain the first display image corresponding to the candidate image.
3. The method according to claim 1, characterized in that, The step of obtaining the location information of the first region based on the location information of the first display region and the candidate image includes: Obtain the position information of the clock frame in the clock layer; The location information of the first area is obtained based on the location information of the first display area, the candidate image, and the clock frame.
4. The method according to claim 1, characterized in that, The step of determining target safety lines mapped to the first mapping area based on the position information of the first display area and the first display image corresponding to the first cutout image, and generating the position information of the target safety lines, includes: Based on the location information of the first display area and the first display image corresponding to the first cutout image, a first mapping area is determined on the first display image corresponding to the first cutout image, and the location information of the first mapping area is generated. The first mapping area includes the foreground object in the first display image corresponding to the first cutout image. Based on the location information of the multiple security lines and the location information of the first mapping area, a target security line is determined that maps the multiple security lines to the first mapping area, and the location information of the target security line is generated.
5. The method according to claim 4, characterized in that, When the number of the first pixels is determined to be greater than a first threshold, adjusting the candidate image based on the position information of the transparent areas on the images of the multiple decorative layers to obtain the second display image corresponding to the candidate image includes: If the number of the first pixel points is greater than the first threshold, the position information of the second display area of the lock screen wallpaper page is determined based on the position information of the transparent areas on the images of the multiple decorative layers. Based on the second display area and the candidate image, the position information of the second area is obtained. The second area includes the foreground object of the candidate image, and the aspect ratio of the second area is the same as that of the second display area. Based on the location information of the second display area and the location information of the second area, the candidate image is adjusted to obtain the second display image corresponding to the candidate image; Displaying a second display image corresponding to the candidate image in a transparent area on the images of the multiple decorative layers includes: The second display area displays the second display image corresponding to the candidate image.
6. A wallpaper editing method, characterized in that, The method includes: Display the lock screen wallpaper page; In response to the operation on the lock screen wallpaper page, the third display image of the original layer, the third display image of the cut-out layer, the first position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame in the clock layer are obtained; Based on the third display image of the cutout layer, the position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame, the position information of the third mapping area is generated; The visibility of the cutout layer is determined based on the position information of the third mapping area and the foreground object of the third display image of the cutout layer; If the visibility of the cutout layer is visible, set the visibility of the cutout layer to visible; The third display image of the original layer and the third display image of the cut-out layer are displayed in the first display area of the lock screen wallpaper page.
7. The method according to claim 6, characterized in that, The step of generating the position information of the third mapping area based on the third display image of the cut-out layer, the position information of the first display area of the lock screen wallpaper page, and the position information of the clock frame includes: Based on the position information of the third display image of the cutout layer and the first display area of the lock screen wallpaper page, a second mapping area is determined on the third display image of the cutout layer, which is mapped from the first display area of the lock screen wallpaper page. Position information of the second mapping area is generated, and the foreground object of the third display image of the cutout layer is included in the second mapping area. Based on the position information of the clock frame and the position information of the second mapping area, the third mapping area to which the clock frame is mapped is determined, and the position information of the third mapping area is generated.
8. The method according to claim 6, characterized in that, The step of determining the visibility of the cutout layer based on the position information of the third mapping region and the foreground object of the third display image of the cutout layer includes: Based on the location information of the third mapping region, determine the location information of the line connecting the midpoints of the short sides of the third mapping region; Based on the position information of the line connecting the midpoints of the short sides of the third mapping region, the number of first pixels on the line connecting the midpoints of the short sides of the third mapping region is determined, and the pixel value of the first pixel is zero. If the number of the first pixel points is less than the second threshold, the visibility of the cutout layer is determined to be visible.
9. The method according to claim 8, characterized in that, The currently used lock screen wallpaper file includes multiple decorative layers with frame effects, and the method further includes: Obtain the position information of the security lines on the images in multiple decorative layers; Based on the position information of the first display area of the lock screen wallpaper page and the third display image of the cutout layer, the first display area of the lock screen wallpaper page is mapped to the fourth mapping area of the third display image of the cutout layer, and the position information of the fourth mapping area is generated. The fourth mapping area includes the foreground object in the third display image of the cutout layer. Based on the position information of the multiple security lines and the position information of the fourth mapping region, a target security line is determined to be mapped from the multiple security lines to the fourth mapping region, and the position information of the target security line is generated. Based on the position information of the target safety line, determine the number of the first pixels on the target safety line, where the pixel value of the first pixel is zero; If the number of the first pixel points is determined to be greater than the first threshold, the visibility of the cutout layer is determined to be visible, and the visibility of the cutout layer is set to visible. The third display image of the original layer and the third display image of the cut-out layer are displayed in the first display area of the lock screen wallpaper page.
10. An electronic device, characterized in that, The electronic device includes: one or more processors, and memory; The memory is coupled to the one or more processors, the memory being used to store computer program code, the computer program code including computer instructions, the one or more processors invoking the computer instructions to cause the electronic device to perform the method as described in any one of claims 1 to 9.
11. A chip system, characterized in that, The chip system is applied to an electronic device, the chip system including one or more processors, the one or more processors being used to invoke computer instructions to cause the electronic device to perform the method as described in any one of claims 1 to 9.
12. A computer-readable storage medium, characterized in that, The computer-readable storage medium includes instructions that, when executed on an electronic device, cause the electronic device to perform the method as described in any one of claims 1 to 9.
Citation Information
Patent Citations
Display method and electronic equipment
CN114911551A
Desktop wallpaper configuration method and device, electronic equipment and readable storage medium
CN115129410A
Method for generating theme wallpaper and electronic equipment
CN115658191A