An image processing method and apparatus
By acquiring and analyzing the color information of images, HSV spatial clustering is used to identify white-background icons and perform color inversion processing, which solves the problem that white-background icons appear abrupt in dark mode and improves the user experience.
Patent Information
- Application Number
- CN202011049469.6
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2020-09-29
- Publication Date
- 2026-03-17
- Estimated Expiration
- 2040-09-29
AI Technical Summary
The existing dark mode has difficulty correctly recognizing and processing non-standard white background icons, causing the icons to appear out of place against the dark background and affecting the user experience.
By acquiring the color information of the image to be rendered, including color types, color values of the four corners, proportion of non-transparent pixels, and proportion of white pixels, HSV spatial clustering analysis and preset conditions are used to identify white-background icons and then invert their colors.
It improves the recognition accuracy and processing efficiency of white-background icons, enhances the natural display effect of the interface in dark mode, and improves the user experience.
Smart Images

Figure CN114332331B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of image processing technology, and in particular to an image processing method and apparatus. Background Technology
[0002] Users can set their electronic devices to dark mode to save battery power and protect their eyes. Dark mode refers to converting the graphical user interface (GUI) of an electronic device to a darker color scheme. Applications in dark mode typically feature a dark background and a light foreground.
[0003] Existing dark mode methods typically use algorithms to identify application interface elements and process resources and colors accordingly during rendering to achieve a dark effect. However, existing dark mode methods struggle to correctly identify and handle non-standard white-background icons, making them appear particularly jarring against a dark background and resulting in a poor user experience. Summary of the Invention
[0004] This application provides an image processing method and apparatus that can identify and process white-background icons, thereby improving the user experience.
[0005] To achieve the above objectives, the embodiments of this application adopt the following technical solutions:
[0006] A first aspect of this application provides an image processing method, comprising: acquiring color information of an image to be rendered; the color information of the image to be rendered includes the color type of the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered; based on the color information of the image to be rendered, if it is determined that the image to be rendered is a white-background icon, the image to be rendered is inverted. Based on this solution, by determining whether an image to be rendered is a white-background icon based on the color type of the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered, this method for determining white-background icons has high accuracy and low latency, balancing recognition accuracy and latency. Furthermore, by inverting the colors of the identified white-background icons, the application interface display effect becomes more natural, the user's visual effect is better, and the user experience is improved.
[0007] In conjunction with the first aspect, in one possible implementation, determining that the image to be rendered is a white-background icon includes: determining that the image to be rendered is a white-background icon when the number of colors in the image to be rendered is less than a first preset threshold, the color values of the four corners of the image to be rendered meet a first preset condition, the proportion of non-transparent pixels in the image to be rendered is greater than or equal to a second preset threshold, and the proportion of white pixels in the image to be rendered is greater than or equal to a third preset threshold. Based on this solution, by determining that the image to be rendered is a white-background icon when the number of colors in the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered each meet preset conditions, this method for identifying white-background icons considers multiple factors, thus achieving high accuracy.
[0008] Combining the first aspect and the aforementioned possible implementations, in another possible implementation, the color information of the image to be rendered refers to the color category of the image to be rendered. Obtaining the color information of the image to be rendered includes: obtaining the saturation (s), brightness (v), and hue (h) of each color in a color bucket; the color bucket includes the color values of multiple colors in the image to be rendered, and the quantity of each color; and performing cluster analysis based on the color value, quantity, saturation, brightness (v), and hue (h) of each color in the color bucket to determine the color category of the image to be rendered. Based on this scheme, the color category of the image to be rendered can be obtained by performing cluster analysis on multiple colors in the color bucket in the HSV space, which can accurately identify the color category of the image to be rendered with high efficiency and low latency.
[0009] Combining the first aspect and the above possible implementations, in another possible implementation, the above-mentioned cluster analysis based on the color value of each color in the color bucket, the quantity of each color, the saturation, brightness v, and hue h of each color to determine the color categories of the image to be rendered includes the following steps: Step a: If the saturation s1 of the first color in the color bucket is less than v1 / 100*λ, store the first color in the first container; v1 is the brightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket; Step b: If the saturation s1 of the first color is greater than or equal to v1 / 100*λ, traverse each color in the second container. If it is determined that a second color exists in the second container, update the quantity of the second color to the sum of the quantity of the first color and the quantity of the second color, and update the color value of the second color to the hue of the first color. The average of the color values of the second and third colors; wherein the difference between the hue h2 of the second color and the hue h1 of the first color is less than the fourth preset threshold, and the sum of the difference between the brightness v2 of the second color and the brightness v1 of the first color and the difference between the saturation s2 of the second color and the saturation s1 of the first color is less than the fifth preset threshold; step c, if the second color does not exist in the second container, store the color value of the first color and the quantity of the first color in the second container; step d, traverse each color in the color bucket in sequence according to steps a to c; step e, divide the colors in the first container into three color categories according to brightness: low brightness, medium brightness and high brightness; step f, determine the color categories in the first and second containers other than white whose number of color categories is greater than or equal to the sixth preset threshold as the color categories of the above-mentioned image to be rendered. Based on this scheme, by clustering colors with similar hues in the HSV color space, the color categories of the image to be rendered can be obtained. This scheme, which determines color similarity in the HSV space compared to the RGB space, significantly reduces the computational load, thus lowering the latency of resource image processing during the dark mode rendering stage. Furthermore, this scheme only requires traversing the colors in the color buckets once to cluster the colors of the image to be rendered, making this clustering method highly efficient and further reducing latency during resource image processing in the dark mode rendering stage. In essence, this scheme categorizes low-saturation colors in the color buckets using brightness thresholds, and for high-saturation colors, it obtains the clustered color categories through cluster analysis. The color categories of the image to be rendered only require traversing the colors in the color buckets once.
[0010] Combining the first aspect and the aforementioned possible implementations, in another possible implementation, the color information of the image to be rendered is the color values of the four corners of the image. Obtaining the color information of the image to be rendered includes: when n*D is less than min(W,H)*k, obtaining the color values of the vertices of the four isosceles right triangles with side length n*D at the four corners of the image to be rendered, and the centroid of each isosceles right triangle; where W is the width of the image to be rendered, H is the height of the image to be rendered, D is the pixel density of the electronic device, n is an integer greater than 1, and k is greater than 0 and less than 1; when n*D is greater than or equal to min(W,H)*k, obtaining the color values of the vertices of the four isosceles right triangles with side length min(W,H)*k at the four corners of the image to be rendered, and the centroid of each isosceles right triangle. Based on this solution, by obtaining the pixel values of the vertex and centroid of an isosceles right triangle corresponding to each corner of the image to be rendered, the color values of the four corners of the image to be rendered can be obtained. This determination method can cover most cases.
[0011] Combining the first aspect and the aforementioned possible implementations, in another possible implementation, the color values of the four corners of the image to be rendered satisfy the first preset condition, including: the difference between the color value of the vertices of the four isosceles right triangles and the centroid of each isosceles right triangle in the alpha channel and 255 is less than the seventh preset threshold; and the Euclidean distance between the color values of the vertices of the four isosceles right triangles and the centroid of each isosceles right triangle in the RGB space and the color value of pure white is less than the eighth preset threshold. Based on this scheme, a characteristic of a white background icon is that the color values of the four corners of the image to be rendered are close to white and have high opacity; therefore, the accuracy of white background icons determined by combining this characteristic is high.
[0012] Combining the first aspect and the aforementioned possible implementations, in another possible implementation, the color information of the image to be rendered is the proportion of non-transparent pixels in the image. Obtaining the color information of the image to be rendered includes: based on the color values of multiple colors in the image to be rendered, determining the proportion of non-transparent pixels in the image to be rendered by the quotient of the quantity of a third color among the multiple colors and the quantity of the multiple colors; the third color is a color whose color value in the alpha channel is greater than a ninth preset threshold. Based on this scheme, a characteristic of a white-background icon is that the proportion of non-transparent pixels in the image to be rendered is relatively high; that is, when the image to be rendered is a non-transparent image, the image to be rendered may be a white-background icon. It is understood that color values can also be represented using RGBA, where A represents the color value in the alpha channel. This value is used to describe the transparency of the three primary colors; the smaller the alpha value, the closer to transparency, and the larger the alpha value, the less transparent. Optionally, a white-background icon can be an image with no transparent pixels or very few transparent pixels. Therefore, if the proportion of non-transparent pixels in the image to be rendered is very high, it can be determined that the image to be rendered may be a white-background icon.
[0013] Combining the first aspect and the aforementioned possible implementations, in another possible implementation, the color information of the image to be rendered is the proportion of white pixels in the image to be rendered. Obtaining the color information of the image to be rendered includes: based on the color values of multiple colors in the image to be rendered, determining the proportion of white pixels in the image to be rendered by the quotient of the quantity of a fourth color among the multiple colors and the quantity of the multiple colors; the fourth color is a color whose difference between its alpha channel color value and 255 is less than a seventh preset threshold, and whose Euclidean distance from the pure white color value in the RGB space is less than an eighth preset threshold. Based on this scheme, a characteristic of a white-background icon is that the proportion of white pixels in the image to be rendered is relatively high; that is, when the proportion of white pixels is high, the image to be rendered may be a white-background icon. Optionally, the pure white color value can be (255, 255, 255).
[0014] A second aspect of this application provides an image processing apparatus, comprising: a processing unit and a storage unit; wherein the processing unit is configured to acquire color information of an image to be rendered; the color information of the image to be rendered includes the color type of the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered; the processing unit is further configured to, based on the color information of the image to be rendered, if it is determined that the image to be rendered is a white-background icon, perform color inversion processing on the image to be rendered.
[0015] In conjunction with the second aspect, in one possible implementation, the aforementioned processing unit is specifically used to determine that the image to be rendered is a white-background icon when the number of colors in the image to be rendered is less than a first preset threshold, the color values of the four corners of the image to be rendered satisfy a first preset condition, the proportion of non-transparent pixels in the image to be rendered is greater than or equal to a second preset threshold, and the proportion of white pixels in the image to be rendered is greater than or equal to a third preset threshold.
[0016] In conjunction with the second aspect and the above possible implementations, in another possible implementation, the processing unit is specifically used to: obtain the saturation s, brightness v, and hue h of each color in the color bucket; the color bucket includes the color values of multiple colors in the image to be rendered, as well as the quantity of each color among the multiple colors; and perform cluster analysis based on the color value of each color in the color bucket, the quantity of each color, the saturation, brightness v, and hue h of each color to determine the color types of the image to be rendered.
[0017] In conjunction with the second aspect and the above possible implementations, in another possible implementation, the processing unit is specifically used to perform the following steps: Step a: If the saturation s1 of the first color in the color bucket is less than v1 / 100*λ, store the first color in the first container; v1 is the brightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket; Step b: If the saturation s1 of the first color is greater than or equal to v1 / 100*λ, traverse each color in the second container. If it is determined that a second color exists in the second container, update the quantity of the second color to the sum of the quantity of the first color and the quantity of the second color, and update the color value of the second color to the average of the color values of the first color and the second color; wherein, the hue h of the second color... 2. The difference between the hue h1 of the second color and the first color is less than the fourth preset threshold, and the sum of the difference between the brightness v2 of the second color and the brightness v1 of the first color and the difference between the saturation s2 of the second color and the saturation s1 of the first color is less than the fifth preset threshold; Step c: If the second color does not exist in the second container, store the color value of the first color and the quantity of the first color into the second container; Step d: Iterate through each color in the color bucket in sequence according to steps a to c; Step e: Divide the colors in the first container into three color categories according to brightness: low brightness, medium brightness and high brightness; Step f: Determine the color categories in the first container and the second container, excluding white, whose number of color categories is greater than or equal to the sixth preset threshold as the color categories of the above-mentioned image to be rendered.
[0018] In conjunction with the second aspect and the above possible implementations, in another possible implementation, the processing unit is specifically used to: when n*D is less than min(W,H)*k, obtain the color values of the vertices of the four isosceles right triangles with side length n*D in the four corners of the image to be rendered, and the centroid of each isosceles right triangle; where W is the width of the image to be rendered, H is the height of the image to be rendered, D is the pixel density of the electronic device, n is an integer greater than 1, and k is greater than 0 and less than 1; when n*D is greater than or equal to min(W,H)*k, obtain the color values of the vertices of the four isosceles right triangles with side length min(W,H)*k in the four corners of the image to be rendered, and the centroid of each isosceles right triangle.
[0019] Combining the second aspect and the above possible implementations, in another possible implementation, the color values of the four corners of the above-mentioned image to be rendered satisfy the first preset condition including: the difference between the color value of the vertices of the four isosceles right triangles and the centroid of each isosceles right triangle in the alpha channel and 255 is less than the seventh preset threshold, and the Euclidean distance between the color value of the vertices of the four isosceles right triangles and the centroid of each isosceles right triangle in the RGB space and the color value of pure white is less than the eighth preset threshold.
[0020] In combination with the second aspect and the above possible implementations, in another possible implementation, the above processing unit is specifically used to determine the proportion of non-transparent pixels in the image to be rendered by the quotient of the number of the third color among the multiple colors and the number of the multiple colors, based on the color values of the multiple colors in the image to be rendered; the third color is the color whose color value in the alpha channel is greater than the ninth preset threshold.
[0021] In combination with the second aspect and the above possible implementations, in another possible implementation, the above processing unit is specifically used to determine the proportion of white pixels in the image to be rendered by the quotient of the number of the fourth color among the multiple colors and the number of the multiple colors based on the color values of the multiple colors in the image to be rendered; the fourth color is a color whose difference between the color value in the alpha channel and 255 is less than a seventh preset threshold, and whose Euclidean distance from the color value of pure white in the RGB space is less than an eighth preset threshold.
[0022] A third aspect of this application provides an image processing method, which includes a processing unit and a storage unit. The processing unit is configured to perform the following steps: Step a: Obtain the saturation s1, brightness v1, and hue h1 of a first color in a color bucket; the color bucket includes the color values of multiple colors in the image to be rendered, and the quantity of each of the multiple colors; Step b: Based on the saturation s1, brightness v1, and hue h1 of the first color, traverse each color in a second container; if it is determined that a second color exists in the second container, update the quantity of the second color to the sum of the quantity of the first color and the quantity of the second color, and update the color value of the second color to the average of the color values of the first color and the second color; wherein the difference between the hue h2 of the second color and the hue h1 of the first color is less than a fourth preset threshold, and the sum of the difference between the brightness v2 of the second color and the brightness v1 of the first color and the difference between the saturation s2 of the second color and the saturation s1 of the first color is less than a fifth preset threshold; Step c: Traverse each color in the color bucket sequentially according to steps a to b. Based on this scheme, by clustering colors that are similar in the HSV color space, the color categories of the image to be rendered can be obtained. Determining color similarity in the HSV space significantly reduces computational load compared to determining similarity in the RGB space, thus lowering latency during resource image processing in dark mode rendering. Furthermore, this scheme only requires traversing the colors in the color buckets once to cluster the color categories of the image to be rendered, resulting in high clustering efficiency.
[0023] Combining the third aspect and the above possible implementations, in another possible implementation, the saturation s1 of the first color is greater than or equal to v1 / 100*λ; where v1 is the brightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket. Based on this scheme, the high-saturation colors in the color bucket can be clustered to obtain the clustered color categories. The clustering efficiency is high, which can reduce the latency of dark mode when processing resource images during the interface rendering stage.
[0024] A fourth aspect of this application provides an image processing apparatus, which includes a processing unit configured to perform the following steps: Step a, obtaining the saturation s1, brightness v1, and hue h1 of a first color in a color bucket; the color bucket includes color values of multiple colors in an image to be rendered, and the quantity of each of the multiple colors; Step b, based on the saturation s1, brightness v1, and hue h1 of the first color, traversing each color in a second container, if it is determined that a second color exists in the second container, updating the quantity of the second color to the sum of the quantity of the first color and the quantity of the second color, and updating the color value of the second color to the average of the color values of the first color and the second color; wherein the difference between the hue h2 of the second color and the hue h1 of the first color is less than a fourth preset threshold, and the sum of the difference between the brightness v2 of the second color and the brightness v1 of the first color and the difference between the saturation s2 of the second color and the saturation s1 of the first color is less than a fifth preset threshold; Step c, traversing each color in the color bucket sequentially according to steps a to b.
[0025] In combination with the fourth aspect and the above possible implementations, in another possible implementation, the saturation s1 of the first color is greater than or equal to v1 / 100*λ; v1 is the brightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket.
[0026] The description of the effects in the second aspect above can refer to the description of the corresponding effects in the first aspect, and the description of the effects in the fourth aspect can refer to the description of the corresponding effects in the third aspect, and will not be repeated here.
[0027] A fifth aspect of this application provides an electronic device capable of implementing the image processing method described in the first aspect. This device can implement the method through software, hardware, or hardware executing corresponding software. In one possible design, the electronic device may include a processor and a memory. The processor is configured to support the electronic device in performing the corresponding functions of the methods described in the first or third aspects. The memory is coupled to the processor and stores necessary program instructions and data for the electronic device.
[0028] A sixth aspect of this application provides a computer-readable storage medium including computer instructions that, when executed on an electronic device, cause the electronic device to perform the image processing method as described in the first or third aspect and its possible implementations.
[0029] A seventh aspect of this application provides a computer program product that, when run on a computer, causes the computer to perform the image processing method as described in the first or third aspect and its possible implementations. Attached Figure Description
[0030] Figure 1 A schematic diagram of an electronic device application interface provided in an embodiment of this application;
[0031] Figure 2 A schematic diagram of an application interface for an electronic device in dark mode, provided as an embodiment of this application;
[0032] Figure 3 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application;
[0033] Figure 4 A schematic flowchart of an image processing method provided in an embodiment of this application;
[0034] Figure 5 A flowchart illustrating another image processing method provided in an embodiment of this application;
[0035] Figure 6 A flowchart illustrating another image processing method provided in an embodiment of this application;
[0036] Figure 7 A flowchart illustrating another image processing method provided in an embodiment of this application;
[0037] Figure 8 This application provides an schematic diagram illustrating how to obtain the color values of the four corners of an image to be rendered, as shown in an embodiment of this application.
[0038] Figure 9 A schematic diagram of another application interface for an electronic device in dark mode provided in an embodiment of this application;
[0039] Figure 10 This is a schematic diagram of the composition of an electronic device provided in an embodiment of this application. Detailed Implementation
[0040] The technical solutions in the embodiments of this application will be described below with reference to the accompanying drawings. In this application, "at least one" means one or more, and "more than one" means two or more. "And / or" describes the relationship between related objects, indicating that there can be three relationships. For example, A and / or B can mean: A exists alone, A and B exist simultaneously, or B exists alone, where A and B can be singular or plural. The character " / " generally indicates that the related objects before and after are in an "or" relationship. "At least one of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one of a, b, or c can mean: a, b, c, a and b, a and c, b and c, or a and b and c, where a, b, and c can be single or multiple. Furthermore, to facilitate a clear description of the technical solutions in the embodiments of this application, the terms "first" and "second" are used in the embodiments of this application 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. For example, the "first" in the first preset threshold and the "second" in the second preset threshold in the embodiments of this application are only used to distinguish different preset thresholds. The descriptions of "first" and "second" appearing in the embodiments of this application are only for illustration and to distinguish the described objects, and have no order, nor do they indicate a special limitation on the number of devices in the embodiments of this application, and cannot constitute any limitation on the embodiments of this application.
[0041] It should be noted that, in this application, the terms "exemplary" or "for example" are used to indicate that something is being described as an example, illustration, or illustration. Any embodiment or design described as "exemplary" or "for example" in this application should not be construed as being more preferred or advantageous than other embodiments or design solutions. Specifically, the use of terms such as "exemplary" or "for example" is intended to present the relevant concepts in a concrete manner.
[0042] Dark mode refers to converting the graphical user interface (GUI) of an electronic device to a darker mode. In dark mode, applications typically display a dark background and a light foreground. Users can save battery power and protect their eyes by setting their electronic devices to dark mode. Optionally, third-party applications on the electronic device may or may not be compatible with dark mode.
[0043] For example, third-party applications on electronic devices can be adapted by third-party developers according to certain design specifications, and the operating system of the electronic device can change the GUI interface by switching theme resources. For instance, if a third-party application developer has developed two sets of theme resources: one for dark mode and one for non-dark mode, when a user turns on dark mode on the electronic device, the operating system can switch the non-dark mode theme resources to the dark mode theme resources, thus displaying a dark background and a light foreground in the GUI interface of the third-party application. Optionally, the operating system of the electronic device can include operating systems that support dark mode, such as Android, iOS, and Windows.
[0044] For example, if a third-party application is not compatible with dark mode, a global dark mode can be used to enable it to display a dark effect. A global dark mode uses algorithms to identify the application's UI elements and processes resources and colors accordingly during rendering, thus enabling the third-party application to display a dark effect.
[0045] However, existing dark mode processing methods struggle to correctly identify and handle irregular white-background icons, making them appear particularly jarring against a dark background. Furthermore, global dark mode requires processing all resource images individually during the interface rendering phase. To ensure smooth interface operation, this places high demands on algorithm latency and performance, making general image processing algorithms unsuitable for icon recognition.
[0046] For example, when the user has not set a dark mode, the display interface of a certain application on the electronic device looks like this: Figure 1 As shown in (a), when the user sets dark mode, the application's display interface looks like this. Figure 2 As shown in (a) in the figure, Figure 2 In the interface shown in (a), the icons for "Pocket Money", "Balance Management", "My Wallet" and "My Favorites" appear out of place in dark mode, resulting in a poor user experience.
[0047] For example, when the user has not set a dark mode, the display interface of a certain application on the electronic device may look like this: Figure 1 As shown in (b), when the user sets dark mode, the application's display interface looks like this. Figure 2 As shown in (b) in the figure, Figure 2 In the interface shown in (b), the "Home," "Categories," "Discounts," "Bulk," and "Events" icons appear jarring in dark mode, resulting in a poor user experience. It should be noted that the accompanying diagrams in the instruction manual are intended to be shown in black and white. Figure 2Other icons in the interface shown in (b) are illustrated as white icons in the attached diagram, but in the actual application interface of the electronic device, the color of the icon may be colored.
[0048] To address the problem that white icons on a background appear jarring in dark mode and negatively impact user experience in existing technologies, this application proposes an image processing method that improves user experience by recognizing and processing white icons.
[0049] The electronic device in this application embodiment can be a mobile phone, tablet computer, desktop computer, laptop computer, handheld computer, notebook computer, ultra-mobile personal computer (UMPC), netbook, as well as cellular phone, personal digital assistant (PDA), augmented reality (AR) / virtual reality (VR) device, etc., including a display screen. This application embodiment does not impose any special restrictions on the specific form of the electronic device.
[0050] Please refer to Figure 3 This is a schematic diagram of the structure of an electronic device 100 provided in an embodiment of this application. Figure 3 As shown, 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.
[0051] It is understood that the structures illustrated in the embodiments of the present invention 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.
[0052] 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.
[0053] 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.
[0054] 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 the memory. This avoids repeated accesses, reduces the waiting time of the processor 110, and thus improves the efficiency of the system.
[0055] In some embodiments, the processor 110 may include one or more interfaces. Interfaces may include an inter-integrated circuit (I2C) interface, an inter-integrated circuit sound (I2S) interface, a pulse code modulation (PCM) interface, a universal asynchronous receiver / transmitter (UART) interface, a mobile industry processor interface (MIPI), a general-purpose input / output (GPIO) interface, a subscriber identity module (SIM) interface, and / or a universal serial bus (USB) interface, etc.
[0056] The I2C interface is a bidirectional synchronous serial bus, including a serial data line (SDA) and a serial clock line (SCL). In some embodiments, the processor 110 may include multiple I2C buses. The processor 110 can couple to the touch sensor 180K, charger, flash, camera 193, etc., through different I2C bus interfaces. For example, the processor 110 can couple to the touch sensor 180K through the I2C interface, enabling the processor 110 and the touch sensor 180K to communicate through the I2C bus interface, thereby realizing the touch function of the electronic device 100.
[0057] The I2S interface can be used for audio communication. In some embodiments, the processor 110 may include multiple I2S buses. The processor 110 can be coupled to the audio module 170 via the I2S bus to enable communication between the processor 110 and the audio module 170. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the I2S interface to enable the function of answering phone calls through a Bluetooth headset.
[0058] The PCM interface can also be used for audio communication, sampling, quantizing, and encoding analog signals. In some embodiments, the audio module 170 and the wireless communication module 160 can be coupled via the PCM bus interface. In some embodiments, the audio module 170 can also transmit audio signals to the wireless communication module 160 via the PCM interface, enabling the function of answering phone calls through a Bluetooth headset. Both the I2S interface and the PCM interface can be used for audio communication.
[0059] The UART interface is a universal serial data bus used for asynchronous communication. This bus can be a bidirectional communication bus. It converts the data to be transmitted between serial and parallel communication. In some embodiments, the UART interface is typically used to connect the processor 110 and the wireless communication module 160. For example, the processor 110 communicates with the Bluetooth module in the wireless communication module 160 via the UART interface to implement Bluetooth functionality. In some embodiments, the audio module 170 can transmit audio signals to the wireless communication module 160 via the UART interface to enable music playback through Bluetooth headphones.
[0060] The MIPI interface can be used to connect the processor 110 to peripheral devices such as the display screen 194 and the camera 193. The MIPI interface includes a camera serial interface (CSI) and a display serial interface (DSI). In some embodiments, the processor 110 and the camera 193 communicate via the CSI interface to enable the electronic device 100 to capture images. The processor 110 and the display screen 194 communicate via the DSI interface to enable the electronic device 100 to display images.
[0061] The GPIO interface can be configured via software. It can be configured as a control signal or a data signal. In some embodiments, the GPIO interface can be used to connect the processor 110 to a camera 193, a display screen 194, a wireless communication module 160, an audio module 170, a sensor module 180, etc. The GPIO interface can also be configured as an I2C interface, an I2S interface, a UART interface, a MIPI interface, etc.
[0062] USB port 130 is a USB standard compliant interface, specifically a Mini USB port, Micro USB port, USB Type-C port, etc. USB port 130 can be used to connect a charger to charge electronic device 100, and can also be used for data transfer between electronic device 100 and peripheral devices. It can also be used to connect headphones for audio playback. This interface can also be used to connect other electronic devices, such as AR devices.
[0063] It is understood that the interface connection relationships between the modules illustrated in this embodiment are merely illustrative and do not constitute a structural limitation on the electronic device 100. In other embodiments, the electronic device 100 may also employ different interface connection methods or combinations of multiple interface connection methods as described in the above embodiments.
[0064] The charging management module 140 receives charging input from a charger. The charger can be a wireless charger or a wired charger. In some wired charging embodiments, the charging management module 140 receives charging input from the wired charger via the USB interface 130. In some wireless charging embodiments, the charging management module 140 receives wireless charging input via the wireless charging coil of the electronic device 100. While charging the battery 142, the charging management module 140 can also supply power to the electronic device via the power management module 141.
[0065] The power management module 141 connects the battery 142, the charging management module 140, and the processor 110. The power management module 141 receives input from the battery 142 and / or the charging management module 140, providing power to the processor 110, internal memory 121, external memory, display screen 194, camera 193, and wireless communication module 160, etc. The power management module 141 can also monitor parameters such as battery capacity, battery cycle count, and battery health status (leakage current, impedance). In some other embodiments, the power management module 141 may also be located within the processor 110. In other embodiments, the power management module 141 and the charging management module 140 may be located in the same device.
[0066] 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.
[0067] Antenna 1 and antenna 2 are used to transmit and receive electromagnetic wave signals. Each antenna in electronic device 100 can be used to cover one or more communication frequency bands. Different antennas can also be multiplexed to improve antenna utilization. For example, antenna 1 can be multiplexed as a diversity antenna for a wireless local area network. In some other embodiments, the antennas can be used in conjunction with tuning switches.
[0068] The mobile communication module 150 can provide solutions for wireless communication, including 2G / 3G / 4G / 5G, applied to the electronic device 100. The mobile communication module 150 may include at least one filter, switch, power amplifier, low noise amplifier (LNA), etc. The mobile communication module 150 can receive electromagnetic waves via antenna 1, and perform filtering, amplification, and other processing on the received electromagnetic waves before transmitting them to a modem processor for demodulation. The mobile communication module 150 can also amplify the signal modulated by the modem processor and convert it into electromagnetic waves for radiation via antenna 1. In some embodiments, at least some functional modules of the mobile communication module 150 may be housed in the processor 110. In some embodiments, at least some functional modules of the mobile communication module 150 and at least some modules of the processor 110 may be housed in the same device.
[0069] The modem processor may include a modulator and a demodulator. The modulator modulates the low-frequency baseband signal to be transmitted into a mid-to-high frequency signal. The demodulator demodulates the received electromagnetic wave signal into a low-frequency baseband signal. The demodulator then transmits the demodulated low-frequency baseband signal to the baseband processor for processing. After processing by the baseband processor, the low-frequency baseband signal is transmitted to the application processor. The application processor outputs sound signals through an audio device (not limited to speaker 170A, receiver 170B, etc.) or displays images or videos through the display screen 194. In some embodiments, the modem processor may be a separate device. In other embodiments, the modem processor may be independent of the processor 110 and may be housed in the same device as the mobile communication module 150 or other functional modules.
[0070] The wireless communication module 160 can provide solutions for wireless communication applications on the electronic device 100, including wireless local area networks (WLANs) (such as wireless fidelity (Wi-Fi) networks), Bluetooth (BT), global navigation satellite system (GNSS), frequency modulation (FM), near field communication (NFC), and infrared (IR) technologies. The wireless communication module 160 can be one or more devices integrating at least one communication processing module. The wireless communication module 160 receives electromagnetic waves via antenna 2, performs frequency modulation and filtering of the electromagnetic wave signals, and sends the processed signal to processor 110. The wireless communication module 160 can also receive signals to be transmitted from processor 110, perform frequency modulation and amplification, and convert them into electromagnetic waves for radiation via antenna 2.
[0071] In some embodiments, antenna 1 of electronic device 100 is coupled to mobile communication module 150, and antenna 2 is coupled to wireless communication module 160, enabling electronic device 100 to communicate with networks and other devices via wireless communication technology. The wireless communication technology may include Global System for Mobile Communications (GSM), General Packet Radio Service (GPRS), Code Division Multiple Access (CDMA), Wideband Code Division Multiple Access (WCDMA), Time Division Code Division Multiple Access (TD-SCDMA), Long Term Evolution (LTE), BT, GNSS, WLAN, NFC, FM, and / or IR technologies, etc. The GNSS may include the Global Positioning System (GPS), the Global Navigation Satellite System (GLONASS), the BeiDou Navigation Satellite System (BDS), the Quasi-Zenith Satellite System (QZSS), and / or satellite-based augmentation systems (SBAS).
[0072] Electronic device 100 implements display functions through a GPU, a display screen 194, and an application processor. The GPU is a microprocessor for image processing, connected to the display screen 194 and the application processor. The GPU is used to perform mathematical and geometric calculations and for graphics rendering. Processor 110 may include one or more GPUs, which execute program instructions to generate or modify display information.
[0073] Display screen 194 is used to display images, videos, etc. Display screen 194 includes a display panel. The display panel may be a liquid crystal display (LCD), an organic light-emitting diode (OLED), an active-matrix organic light-emitting diode (AMOLED), a flexible light-emitting diode (FLED), a miniature LED, a microLED, a quantum dot light-emitting diode (QLED), etc. In some embodiments, electronic device 100 may include one or N displays 194, where N is a positive integer greater than 1.
[0074] In this embodiment of the application, the display screen 194 can be used to display the interface of an electronic device. For example... Figure 1 and Figure 2 As shown, the display screen 194 can be used to display the interface of an electronic device's application.
[0075] Electronic device 100 can perform shooting functions through ISP, camera 193, video codec, GPU, display 194 and application processor.
[0076] The ISP (Image Signal Processor) is used to process data fed back from the camera 193. For example, when taking a picture, the shutter is opened, and light is transmitted through the lens to the camera's photosensitive element. The light signal is converted into an electrical signal, and the camera's photosensitive element transmits the electrical signal to the ISP for processing, transforming it into an image visible to the naked eye. The ISP can also perform algorithmic optimization of image noise, brightness, and skin tone. The ISP can also optimize parameters such as exposure and color temperature of the shooting scene. In some embodiments, the ISP can be set in the camera 193.
[0077] Camera 193 is used to capture still images or videos. An object is projected onto a photosensitive element by generating an optical image through the lens. The photosensitive element can be a charge-coupled device (CCD) or a complementary metal-oxide-semiconductor (CMOS) phototransistor. The photosensitive element converts the light signal into an electrical signal, which is then passed to an ISP for conversion into a digital image signal. The ISP outputs the digital image signal to a DSP for processing. The DSP converts the digital image signal into image signals in standard RGB, YUV, or other formats. In some embodiments, the electronic device 100 may include one or N cameras 193, where N is a positive integer greater than 1.
[0078] Digital signal processors (DSPs) are used to process digital signals. Besides digital image signals, they can also process other digital signals. For example, when electronic device 100 selects a frequency, the DSP can perform Fourier transforms on the frequency energy.
[0079] Video codecs are used to compress or decompress digital video. Electronic device 100 may support one or more video codecs. Thus, electronic device 100 can play or record videos in various encoding formats, such as Moving Picture Experts Group (MPEG) 1, MPEG2, MPEG3, MPEG4, etc.
[0080] An NPU (Neural Processing Unit) is a computational processor for neural networks (NNs). By borrowing the structure of biological neural networks, such as the transmission patterns between neurons in the human brain, it can rapidly process input information and continuously learn on its own. NPUs enable intelligent cognitive applications in electronic devices, such as image recognition, facial recognition, speech recognition, and text understanding.
[0081] In this embodiment of the application, the NPU can identify the first interface of the first application through an image recognition algorithm and determine the countdown duration of the countdown icon in the first interface of the first application.
[0082] 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. For example, music, video, and other files can be saved on the external memory card.
[0083] 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 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.
[0084] 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.
[0085] Audio module 170 is used to convert digital audio information into analog audio signal output, and also to convert analog audio input into digital audio signal. Audio module 170 can also be used for encoding and decoding audio signals. In some embodiments, audio module 170 may be located in processor 110, or some functional modules of audio module 170 may be located in processor 110. Speaker 170A, also called a "loudspeaker," is used to convert audio electrical signals into sound signals. Electronic device 100 can listen to music or hands-free calls through speaker 170A. Receiver 170B, also called a "handpiece," is used to convert audio electrical signals into sound signals. When electronic device 100 answers a phone call or voice message, it can listen to the voice by bringing receiver 170B close to the user's ear. Microphone 170C, also called a "microphone" or "voice transducer," is used to convert sound signals into electrical signals. When making a phone call or sending a voice message, the user can speak by bringing their mouth close to microphone 170C, inputting sound signals into microphone 170C. Electronic device 100 may have at least one microphone 170C. In some embodiments, the electronic device 100 may be equipped with two microphones 170C, which, in addition to collecting sound signals, can also perform noise reduction. In other embodiments, the electronic device 100 may also be equipped with three, four or more microphones 170C, which can collect sound signals, reduce noise, identify the sound source, and perform directional recording, etc.
[0086] The 170D headphone jack is used to connect wired headphones. The 170D headphone jack can be a USB 130 interface or a 3.5mm Open Mobile Terminal Platform (OMTP) standard interface, a CTIA (Cellular Telecommunications Industry Association of the USA) standard interface.
[0087] Pressure sensor 180A is used to sense pressure signals and convert them into electrical signals. In some embodiments, pressure sensor 180A can be disposed on display screen 194. There are many types of pressure sensors 180A, such as resistive pressure sensors, inductive pressure sensors, and capacitive pressure sensors. A capacitive pressure sensor may include at least two parallel plates with conductive material. When force is applied to pressure sensor 180A, the capacitance between the electrodes changes. Electronic device 100 determines the pressure intensity based on the change in capacitance. When a touch operation is applied to display screen 194, electronic device 100 detects the intensity of the touch operation based on pressure sensor 180A. Electronic device 100 can also calculate the touch position based on the detection signal from pressure sensor 180A. In some embodiments, touch operations applied to the same touch position but with different touch operation intensities can correspond to different operation commands. For example, when a touch operation with an intensity less than a first pressure threshold is applied to the SMS application icon, a command to view an SMS is executed. When a touch operation with an intensity greater than or equal to the first pressure threshold is applied to the SMS application icon, a command to create a new SMS is executed.
[0088] The gyroscope sensor 180B can be used to determine the motion attitude of the electronic device 100. In some embodiments, the gyroscope sensor 180B can determine the angular velocity of the electronic device 100 about three axes (i.e., the x, y, and z axes). The gyroscope sensor 180B can be used for image stabilization. For example, when the shutter is pressed, the gyroscope sensor 180B detects the angle of the shake of the electronic device 100, calculates the distance that the lens module needs to compensate based on the angle, and allows the lens to counteract the shake of the electronic device 100 by moving in the opposite direction, thus achieving image stabilization. The gyroscope sensor 180B can also be used in navigation and motion-sensing game scenarios.
[0089] The barometric pressure sensor 180C is used to measure air pressure. In some embodiments, the electronic device 100 calculates altitude using the air pressure value measured by the barometric pressure sensor 180C to assist in positioning and navigation.
[0090] The magnetic sensor 180D includes a Hall sensor. The electronic device 100 can use the magnetic sensor 180D to detect the opening and closing of the flip cover. In some embodiments, when the electronic device 100 is a flip phone, the electronic device 100 can detect the opening and closing of the flip cover using the magnetic sensor 180D. Then, based on the detected opening and closing state of the cover or the flip cover, features such as automatic flip unlocking can be set.
[0091] The 180E accelerometer can detect the magnitude of acceleration of electronic device 100 in various directions (typically three axes). When electronic device 100 is stationary, it can detect the magnitude and direction of gravity. It can also be used to identify the posture of electronic devices and applied to applications such as screen orientation switching and pedometers.
[0092] A distance sensor 180F is used to measure distance. Electronic device 100 can measure distance via infrared or laser. In some embodiments, during a shooting scene, electronic device 100 can utilize the distance sensor 180F to measure distance for rapid focusing.
[0093] The proximity sensor 180G may include, for example, a light-emitting diode (LED) and a light detector, such as a photodiode. The LED may be an infrared LED. The electronic device 100 emits infrared light outward through the LED. The electronic device 100 uses the photodiode to detect infrared reflected light from nearby objects. When sufficient reflected light is detected, it can be determined that there is an object near the electronic device 100. When insufficient reflected light is detected, the electronic device 100 can determine that there is no object near the electronic device 100. The electronic device 100 may use the proximity sensor 180G to detect when a user holds the electronic device 100 close to their ear for a call, so as to automatically turn off the screen to save power. The proximity sensor 180G can also be used in holster mode and pocket mode for automatic unlocking and locking of the screen.
[0094] The ambient light sensor 180L is used to sense the brightness of ambient light. The electronic device 100 can adaptively adjust the brightness of the display screen 194 based on the sensed ambient light brightness. The ambient light sensor 180L can also be used to automatically adjust the white balance when taking pictures. The ambient light sensor 180L can also work with the proximity sensor 180G to detect whether the electronic device 100 is in a pocket to prevent accidental touches.
[0095] The fingerprint sensor 180H is used to collect fingerprints. The electronic device 100 can utilize the characteristics of the collected fingerprints to achieve fingerprint unlocking, accessing application locks, taking photos with fingerprints, answering calls with fingerprints, etc.
[0096] Temperature sensor 180J is used to detect temperature. In some embodiments, electronic device 100 uses the temperature detected by temperature sensor 180J to execute a temperature handling strategy. For example, when the temperature reported by temperature sensor 180J exceeds a threshold, electronic device 100 performs thermal protection by reducing the performance of a processor located near temperature sensor 180J to reduce power consumption. In other embodiments, when the temperature is below another threshold, electronic device 100 heats battery 142 to prevent abnormal shutdown of electronic device 100 due to low temperature. In still other embodiments, when the temperature is below yet another threshold, electronic device 100 boosts the output voltage of battery 142 to prevent abnormal shutdown due to low temperature.
[0097] 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 screen." Touch sensor 180K detects touch operations applied to or near it. The touch sensor 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.
[0098] The bone conduction sensor 180M can acquire vibration signals. In some embodiments, the bone conduction sensor 180M can acquire vibration signals from the vibrating bone segments of the human vocal cords. The bone conduction sensor 180M can also contact the human pulse to receive blood pressure signals. In some embodiments, the bone conduction sensor 180M can also be incorporated into headphones to form bone conduction headphones. The audio module 170 can parse the voice signals from the vibrating bone segments of the vocal cords acquired by the bone conduction sensor 180M to realize voice functionality. The application processor can parse heart rate information from the blood pressure signals acquired by the bone conduction sensor 180M to realize heart rate detection functionality.
[0099] Buttons 190 include a power button, volume buttons, etc. Buttons 190 can be mechanical buttons or touch-sensitive buttons. Electronic device 100 can receive button input and generate key signal inputs related to user settings and function control of electronic device 100.
[0100] Motor 191 can generate vibration alerts. Motor 191 can be used for incoming call vibration alerts or for touch vibration feedback. For example, different vibration feedback effects can correspond to touch operations performed on different applications (such as taking photos, playing audio, etc.). Motor 191 can also correspond to different vibration feedback effects for touch operations performed on different areas of the display screen 194. Different application scenarios (such as time reminders, receiving messages, alarm clocks, games, etc.) can also correspond to different vibration feedback effects. The touch vibration feedback effect can also be customized.
[0101] Indicator 192 can be an indicator light, used to indicate charging status, power changes, or to indicate messages, missed calls, notifications, etc.
[0102] The SIM card interface 195 is used to connect a SIM card. The SIM card can be inserted into or removed from the SIM card interface 195 to make contact with and separate from the electronic device 100. The electronic device 100 can support one or N SIM card interfaces, where N is a positive integer greater than 1. The SIM card interface 195 can support Nano SIM cards, Micro SIM cards, SIM cards, etc. Multiple cards can be inserted into the same SIM card interface 195 simultaneously. The multiple cards can be of the same or different types. The SIM card interface 195 is also compatible with different types of SIM cards. The SIM card interface 195 is also compatible with external memory cards. The electronic device 100 interacts with the network through the SIM card to realize functions such as calls and data communication. In some embodiments, the electronic device 100 uses an eSIM, i.e., an embedded SIM card. The eSIM card can be embedded in the electronic device 100 and cannot be separated from the electronic device 100.
[0103] The methods described in the following embodiments can all be implemented in the electronic device 100 having the above-described hardware structure.
[0104] The following will use a mobile phone as an example to specifically illustrate the technical solution provided in the embodiments of this application. Combined with... Figure 3 ,like Figure 4 As shown, the image processing method may include the following steps:
[0105] S401. Obtain the color information of the image to be rendered.
[0106] Optionally, the application interface of an electronic device may include multiple images to be rendered. These images, after rendering processing, can be displayed in dark mode within the application interface. Unrendered resource images within the application interface can be referred to as images to be rendered. For example, Figure 2 The application interface shown in (a) may include multiple images to be rendered, such as the "Pocket Money" icon, the "Savings" icon, the "Balance Management" icon, the "My Wallet" icon, and the "My Favorites" icon. It should be noted that the image to be rendered in step S401 is... Figure 2 The unrendered image in the application interface shown in (a) is different from the image in the image above. Figure 2 The brightness of the images displayed in the application interface shown in (a) may not be the same.
[0107] For example, the color information of the image to be rendered may include the color type of the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered.
[0108] For example, when the color information of the image to be rendered is the color type of the image to be rendered, such as... Figure 5 As shown, obtaining the color information of the image to be rendered in step S401 can include steps S4011-S4013.
[0109] S4011. Store the color values of multiple colors in the image to be rendered, as well as the quantity of each color, into a color bucket.
[0110] Multiple colors in the image to be rendered can be the colors of multiple sampling points in the image. For example, taking an image with a width of W and a height of H as an example, N*N sampling points can be sampled at even intervals, and the color value of each color in the N*N sampling points and the corresponding quantity of that color can be stored in a color bucket. Optionally, the color values can be represented using color values in the red-green-blue (RGB) color space, for example, using three colors: red, green, and blue.
[0111] For example, if there are N*N sampling points with a total of M colors, the color value of each of the M colors and the quantity of each color can be stored in a color bucket. Understandably, the sum of the quantities of these M colors is N*N.
[0112] S4012. Obtain the saturation (s), brightness (v), and hue (h) of each color in the color bucket.
[0113] For example, the saturation (s), lightness (v), and hue (h) of each color in the color bucket can be obtained by converting each color from the RGB color space to the hue-saturation-value (HSV) color space. This application does not limit the specific method of conversion from the RGB color space to the HSV color space; however, specific conversion methods can be found in existing technologies.
[0114] S4013. Based on the color value of each color in the color bucket, the quantity of each color, the saturation, brightness (v), and hue (h) of each color, perform cluster analysis to determine the color categories of the image to be rendered.
[0115] For example, Figure 6 (a) in the diagram is a flowchart of a color clustering method, such as... Figure 6 As shown in (a), cluster analysis is performed based on the color value of each color in the color bucket, the quantity of each color, the saturation, brightness (v), and hue (h) of each color to determine the color categories of the image to be rendered. This may include the following steps:
[0116] Step a: If the saturation s1 of the first color in the color bucket is less than v1 / 100*λ, store the first color in the first container.
[0117] Where, v1 is the lightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket.
[0118] Exemplarily, taking the case where there are M colors in the color bucket, the first color can be any one of the M colors. The maximum saturation of all colors in the above color bucket is the saturation value of the color with the maximum saturation among the M colors. It should be noted that the multiple colors in the embodiments of the present application can indicate that there are multiple types of colors, and the color values of different types of colors can be different. For example, including M colors in the color bucket means that there are M types of colors included in the color bucket, and the color values of different colors among the M colors can be different.
[0119] As Figure 6 shown in (b) of, in the HSV color space, by comparing the saturation of each color in the color bucket with v1 / 100*λ, the colors with lower saturation in the color bucket can be separated from other colors, and the colors with lower saturation can be stored in the first container.
[0120] Optionally, when comparing the saturation of different colors in the color bucket with v1 / 100*λ, the value of λ can be the same.
[0121] Step b: If the saturation s1 of the first color is greater than or equal to v1 / 100*λ, traverse each color in the second container. If it is determined that there is a second color in the second container, update the quantity of the second color to the sum of the quantity of the first color and the quantity of the second color, and update the color value of the second color to the average value of the color value of the first color and the color value of the second color.
[0122] Where, the difference between the hue h2 of the second color and the hue h1 of the first color is less than the fourth preset threshold, and the sum of the difference between the lightness v2 of the second color and the lightness v1 of the first color and the difference between the saturation s2 of the second color and the saturation s1 of the first color is less than the fifth preset threshold. For example, taking the fourth preset threshold as k1 and the fifth preset threshold as k2, the difference between the hue h2 of the second color and the hue h1 of the first color is △h, the difference between the lightness v2 of the second color and the lightness v1 of the first color is △v, and the difference between the saturation s2 of the second color and the saturation s1 of the first color is △s. When △h is less than k1 (△h < k1), and the sum of △v and △s is less than k2 (△v + △s < k2), it is determined that there is a second color in the second container, that is, the second color is close to the first color, and the second color and the first color can be clustered. Optionally, the above differences can be positive or negative. When the difference is negative, the absolute value of the difference can be taken and compared with k1 or k2.
[0123] Optionally, the second container may contain one or more second colors. That is, the second container may contain one or more colors that are close to the color of the first color. When multiple colors in the second container are close to the color of the first color, these multiple second colors can be clustered with the first color.
[0124] For example, the second container is initially empty, meaning it does not store any color. If the first color in step a is the first color traversed in the color bucket, and the saturation s1 of this first color is greater than or equal to v1 / 100*λ, since the second container does not store any color, the second color does not exist when traversing each color in the second container in step b. The first color can be stored in the second container through step c, so that when traversing the second color in the color bucket, it can be determined whether the second color exists in the second container during step b.
[0125] For example, let's say the color value of the first color is y, the quantity of the first color in the color bucket is Ny, the color value of the second color is c, and the quantity of the second color in the second container is Nc. In step b above, when the second color exists in the second container, the quantity of the first color Ny is added to the quantity of the second color c in the second container, Nc. That is, the quantity of the second color c in the second container is updated to Nc plus Ny, and the color value of the second color is updated to (y*Ny+c*Nc) / (Ny+Nc). In other words, when the second color exists in the second container, the second color and the first color can be clustered.
[0126] like Figure 6 As shown in (b), step b above involves clustering colors with high saturation and similar hues from the color buckets in the HSV color space into a second container. This clustering method, which determines color similarity in the HSV space compared to the RGB space, significantly reduces computational load, thus lowering latency during resource image processing in dark mode rendering. Furthermore, this clustering method only requires traversing the colors in the color buckets once to obtain the color types of the image to be rendered, resulting in high clustering efficiency and reduced latency in image processing.
[0127] Step c: If the second color does not exist in the second container, store the color value of the first color and the quantity of the first color into the second container.
[0128] Step d: Iterate through each color in the color bucket in sequence, following steps a through c.
[0129] Optionally, when the M colors in the color bucket are traversed sequentially according to steps a to c, they can be traversed in order of decreasing quantity of each color in the color bucket, in order of increasing quantity of each color, or in order of decreasing darkness of each color. In this embodiment of the application, the specific traversal order of multiple colors in the color bucket according to steps a to c is not limited, and is only an example here.
[0130] If it is determined that all colors in the color bucket have been traversed, continue to steps e through f.
[0131] Step e: Divide the colors in the first container into three categories based on brightness: low brightness, medium brightness, and high brightness.
[0132] For example, low-saturation colors in the color bucket can be simply classified using brightness thresholds. For instance, by setting brightness thresholds L1 and L2, colors with a brightness less than L1 are classified as low brightness, colors with a brightness between L1 and L2 are classified as medium brightness, and colors with a brightness greater than L2 are classified as high brightness.
[0133] Understandably, in this application embodiment, low-saturation colors in the color bucket are classified into color categories by brightness threshold, and high-saturation colors are clustered to obtain the clustered color categories.
[0134] Step f: Determine the color types in the first and second containers that have a number of color types other than white that are greater than or equal to a sixth preset threshold as the color types of the image to be rendered.
[0135] Understandably, since there are very few colors for white background icons, the color range of the image to be rendered can be used as a basis for determining whether the image to be rendered is a white background icon.
[0136] For example, to reduce the influence of interfering factors, the color types with a larger number of colors (excluding white) in the first and second containers can be determined as the color types of the image to be rendered. In other words, white and other colors are removed when calculating the number of color types, and the remaining color types are determined as the color types of the image to be rendered.
[0137] Understandable. Figure 6 The color clustering method shown can cluster the colors of the image to be rendered by traversing the colors in the color buckets. This clustering method is highly efficient, thus reducing the latency of resource image processing during the interface rendering stage in dark mode.
[0138] For example, when the color information of the image to be rendered is the color value of the four corners of the image, such as... Figure 7As shown, obtaining the color information of the image to be rendered in step S401 may include steps S4014-S4015.
[0139] S4014. When n*D is less than min(W,H)*k, obtain the vertices of the four isosceles right triangles with side length n*D in the four corners of the image to be rendered, as well as the color value of the centroid of each isosceles right triangle.
[0140] Where W is the width of the image to be rendered, H is the height of the image to be rendered, D is the pixel density of the electronic device, n is an integer greater than 1, and k is greater than 0 and less than 1. min(W,H) represents taking the smaller value between W and H. The pixel density of the electronic device refers to the pixel density of the electronic device displaying the application interface, that is, the number of pixels per inch of the screen of the electronic device.
[0141] For example, such as Figure 8 As shown, taking a corner of the image to be rendered as an example, the size of n*D is compared with that of min(W,H)*k. If n*D is less than min(W,H)*k, the color values of the three vertices and the centroid of the isosceles right triangle are obtained, with n*D as the side length L. Optionally, two sides of the isosceles right triangle can coincide with two sides of the image to be rendered. Figure 8 This example uses a rectangle as the image to be rendered. Optionally, the image can be other shapes, such as a circle. If the image is of another shape, the color values of the vertices of an isosceles right triangle that lie on the image to be rendered can be obtained.
[0142] Optionally, obtaining the color values of the four corners of the image to be rendered may include obtaining the color values of the vertices and centroids of the isosceles right triangles corresponding to each corner of the image to be rendered.
[0143] S4015. If n*D is greater than or equal to min(W,H)*k, obtain the color value of the vertices of the four isosceles right triangles with side length min(W,H)*k in the four corners of the image to be rendered, as well as the color value of the centroid of each isosceles right triangle.
[0144] For example, such as Figure 8 As shown, taking a corner of the image to be rendered as an example, the size of n*D is compared with that of min(W,H)*k. If n*D is greater than or equal to min(W,H)*k, the color values of the three vertices and the centroid of the isosceles right triangle are obtained, with min(W,H)*k as the side length L. Optionally, two sides of the isosceles right triangle can coincide with two sides of the image to be rendered.
[0145] Understandably, since the four corners of a white background icon are white, the color values of the four corners of the image to be rendered can be used as the basis for determining whether the image to be rendered is a white background icon.
[0146] For example, when the color information of the image to be rendered is the proportion of non-transparent pixels in the image to be rendered, obtaining the color information of the image to be rendered in step S401 above may include: determining the proportion of the number of a third color in the total number of colors based on the color values of multiple colors in the image to be rendered as the proportion of non-transparent pixels in the image to be rendered. This third color is the color whose color value in the alpha channel is greater than a ninth preset threshold.
[0147] Optionally, the multiple colors in the image to be rendered can be the colors of multiple sampling points in the image to be rendered. Please refer to the relevant description in step S4011 for details.
[0148] For example, the proportion of non-transparent pixels is the quotient of the number of colors with alpha channel values greater than the ninth preset threshold in multiple sampling points of the image to be rendered, and the sum of the numbers of all colors in multiple sampling points of the image to be rendered. For instance, if the number of colors with alpha channel values greater than the ninth preset threshold in multiple sampling points of the image to be rendered is n1, and the sum of the numbers of all colors in multiple sampling points of the image to be rendered is n2, then the proportion of non-transparent pixels in the image to be rendered is n1 / n2.
[0149] Understandably, white background icons can be images with no transparent pixels or very few transparent pixels. Therefore, the proportion of non-transparent pixels in the image to be rendered can be used as the basis for determining whether the image to be rendered is a white background icon.
[0150] For example, when the color information of the image to be rendered is the proportion of white pixels in the image, obtaining the color information of the image to be rendered in step S401 above may include: determining the proportion of white pixels in the image to be rendered by dividing the quantity of the fourth color among the multiple colors by the quantity of the multiple colors. The fourth color is a color whose difference between its alpha channel color value and 255 is less than a seventh preset threshold, and whose Euclidean distance from the pure white color value in the RGB space is less than an eighth preset threshold.
[0151] Optionally, the color value of pure white can be (255, 255, 255). When the Euclidean distance between the color values of the four corners and the pure white color value is small, the color of the four corners is close to white. Optionally, the color value can also be represented by RGBA, where A represents the color value in the alpha channel. This value is used to describe the transparency of the three primary colors. The smaller the alpha value, the more transparent; the larger the alpha value, the more opaque.
[0152] Understandably, the fourth color can be white or close to white, and it has high opacity. The proportion of white pixels is the quotient of the number of this fourth color and the sum of the number of colors in multiple sampling points.
[0153] It is understandable that white pixels make up a high percentage of white icons, so the percentage of white pixels in the image to be rendered can be used as a basis for determining whether the image to be rendered is a white icon.
[0154] Optionally, the preset threshold in this application embodiment can be an empirical value.
[0155] S402. Based on the color information of the image to be rendered, if it is determined that the image to be rendered is a white background icon, the image to be rendered is inverted.
[0156] For example, determining that the image to be rendered is a white-background icon based on the color information of the image to be rendered includes: determining that the image to be rendered is a white-background icon when the number of colors in the image to be rendered is less than a first preset threshold, the color values of the four corners of the image to be rendered meet a first preset condition, the proportion of non-transparent pixels in the image to be rendered is greater than or equal to a second preset threshold, and the proportion of white pixels in the image to be rendered is greater than or equal to a third preset threshold.
[0157] Optionally, the color values of the four corners of the image to be rendered satisfying the first preset condition includes: the difference between the color value of the vertices of the four isosceles right triangles at the four corners of the image and the centroid of each isosceles right triangle in the alpha channel and 255 is less than the seventh preset threshold; and the Euclidean distance between the color values of the vertices of the four isosceles right triangles and the centroid of each isosceles right triangle in the RGB space and the color value of pure white is less than the eighth preset threshold. Optionally, the color value of pure white can be (255, 255, 255). When the Euclidean distance between the color values of the four corners and the color value of pure white is small, the color of the four corners is close to white. Optionally, the color value can also be represented by RGBA, where A represents the color value in the alpha channel. This value is used to describe the transparency of the three primary colors. The smaller the alpha value, the closer to transparency; the larger the alpha value, the less transparent.
[0158] Understandably, an image can be identified as a white-background icon when its color information meets four characteristics. These characteristics are: first, a limited number of color types; second, color values at the four corners of the image are close to white pixels; third, a high proportion of non-transparent pixels; and fourth, a high proportion of white pixels. When an image simultaneously meets all four characteristics, it can be identified as a white-background icon, allowing for color inversion and making the white-background icon less obtrusive in the application interface, thus improving the user experience.
[0159] For example, white-background icons have fewer color options. Therefore, if the image to be rendered has fewer color options, it meets the first characteristic and is likely a white-background icon. White-background icons have four corners that are white pixels or nearly white pixels. Therefore, if the four corners of the image to be rendered are nearly white, it meets the second characteristic and is likely a white-background icon. White-background icons can be images with no transparent pixels or very few transparent pixels. Therefore, if the proportion of non-transparent pixels in the image to be rendered is very high, it meets the third characteristic and is likely a white-background icon. White-background icons have a high proportion of white pixels. Therefore, when the proportion of white pixels in the image to be rendered is high, it meets the fourth characteristic and is likely a white-background icon. If all four characteristics of the image to be rendered are met, the image to be rendered is determined to be a white-background icon.
[0160] Optionally, the above-mentioned inversion of white background icons can be performed by inverting the brightness of the white background icons during rendering. This results in the icons no longer being presented as white backgrounds, but as dark backgrounds with light foregrounds. Therefore, the white background icons after inversion are more compatible with dark mode, making the application interface display effect more natural, improving the user's visual experience, and enhancing the user experience.
[0161] For example, combining Figure 2 (a) and Figure 9 In (a), the image to be rendered is... Figure 2 Taking the "change" icon shown in (a) as an example, if based on the color information of the image to be rendered, it is determined that the image has few color types, the color values of the four corners are close to white pixels, and the proportion of non-transparent pixels and white pixels is high, then the image to be rendered can be determined to be a white background icon. Therefore, the "change" icon can be inverted, such as... Figure 9 As shown in (a), the "coin" icon has been inverted. This inversion makes the white background icon on the application interface less obtrusive and improves the user experience.
[0162] For example, combining Figure 2 (a) and Figure 9 In (a), the image to be rendered is... Figure 2 Taking the "Balance Management" icon shown in (a) as an example, if the color information of the image to be rendered determines that the image is a white background icon, then the "Balance Management" icon can be inverted, such as... Figure 9 As shown in (a), this is the "Balance Management" icon after color inversion. This color inversion makes the white background icon on the application interface less jarring, improving the user experience. Optional, Figure 2The “My Card Pack” icon and “My Collection” icon shown in (a) can also be determined to be white background icons by the methods of steps S401-S402 above. During rendering, the two white background icons are inverted, so that the application interface displays more naturally, the user’s visual effect is better, and the user experience is improved.
[0163] For example, combining Figure 2 (b) and Figure 9 In (b), the image to be rendered is used as... Figure 2 Taking the "Home" icon shown in (b) as an example, if the color information of the image to be rendered determines that the image is a white background icon, then the "Home" icon can be inverted, such as... Figure 9 As shown in (b), the "Home" icon has been inverted. This inversion makes the white background of the "Home" icon less jarring and improves the user experience. Optional, Figure 2 The “Category” icon, “Discount” icon, “Bulk Purchase” icon and “Event” icon shown in (b) can also be determined by the above steps S401-S402, which determine that the image to be rendered is a white background icon, and the white background icon is inverted during rendering, so that the application interface display effect is more natural, the user’s visual effect is better, and the user experience is improved.
[0164] Understandably, because the accompanying diagrams in the instruction manual require black and white illustrations, therefore... Figure 2 Other icons in the interface shown in (b) of this application, such as the "Seasonal Fresh" icon, are shown as white icons in the accompanying drawings, but in the actual application interface of the electronic device, the color of the icon is colored. The method of this application embodiment determines that the image to be rendered does not meet the four characteristics of a white icon, so it is not inverted.
[0165] It should be noted that the image processing method provided in this application determines whether an image to be rendered is a white-background icon by considering the color type of the image to be rendered, the color values of the four corners of the image to be rendered, the proportion of non-transparent pixels in the image to be rendered, and the proportion of white pixels in the image to be rendered. This method can quickly and accurately identify multiple images to be rendered in the application interface, balancing recognition accuracy and latency. Moreover, by inverting the colors of the white-background icons, the application interface displays more naturally, providing a better visual experience for the user and enhancing the user experience.
[0166] The foregoing mainly describes the solutions provided by the embodiments of the present invention from the perspective of method steps. It is understood that, in order to implement the above functions, a computer includes corresponding hardware structures and / or software modules for executing each function. Those skilled in the art should readily recognize that, in conjunction with the units and algorithm steps of the various examples described in the embodiments disclosed herein, this application can be implemented in a combination of hardware and computer software. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementations should not be considered beyond the scope of the present invention.
[0167] This application embodiment can divide the above-described electronic device into functional modules based on the method example described above. For example, each function can be divided into its own functional modules, or two or more functions can be integrated into one processing module. The integrated modules can be implemented in hardware or as software functional modules. It should be noted that the module division in this application embodiment is illustrative and only represents one logical functional division; other division methods may be used in actual implementation.
[0168] When using integrated units, Figure 10 A schematic diagram of a possible structure of the electronic device involved in the above embodiments is shown. The electronic device 1000 includes a processing unit 1001 and a storage unit 1002.
[0169] The processing unit 1001 is used to control and manage the operations of the electronic device 1000. For example, it can be used to execute... Figure 4 In the process steps S401-S402; or, it can be used to execute Figure 5 In the process steps S4011-S4013; or, it can be used to execute Figure 6 The processing steps shown in (a) are described below; or, they can be used to perform... Figure 7 The processing steps S4014-S4015; and / or other processes used in the techniques described herein.
[0170] Storage unit 1002 is used to store program code and data of electronic device 1000.
[0171] Of course, the unit modules in the electronic device 1000 include, but are not limited to, the processing unit 1001 and the storage unit 1002. For example, the electronic device 1000 may also include a display unit, a communication unit, etc. The display unit is used to display the application interface of the electronic device. The communication unit is used to support communication between the electronic device 1000 and other devices.
[0172] The processing unit 1001 may be a processor or controller, such as a central processing unit (CPU), a digital signal processor (DSP), an application-specific integrated circuit (ASIC), a field-programmable gate array (FPGA), or other programmable logic devices, transistor logic devices, hardware components, or any combination thereof. The processor may include an application processor and a baseband processor. It can implement or execute various exemplary logic blocks, modules, and circuits described in conjunction with the disclosure of this application. The processor may also be a combination that implements computing functions, such as a combination of one or more microprocessors, a combination of a DSP and a microprocessor, etc. The storage unit 1002 may be a memory. The display unit may include a display screen. The communication unit may be a transceiver, transceiver circuitry, or a communication interface, etc.
[0173] For example, processing unit 1001 is a processor (such as...) Figure 3 The processor 110 shown can be a memory (such as a storage unit 1002). Figure 3 The internal memory 121 shown). The display unit may include a display screen (such as...). Figure 3 The display screen 194 shown is an example. The communication unit includes a wireless communication module (such as...). Figure 3 The wireless communication module 160 shown is a wireless communication module, which can be collectively referred to as a communication interface. The electronic device 1000 provided in this embodiment can be... Figure 3 The electronic device 100 shown. The aforementioned processor, memory, and communication interface can be coupled together, for example, connected via a bus.
[0174] This application embodiment also provides a computer-readable storage medium storing computer program code. When the processor executes the computer program code, the electronic device performs... Figure 4 , Figure 5 , Figure 6 (a) or Figure 7 The relevant method steps in the above embodiments implement the method.
[0175] This application also provides a computer program product that, when run on a computer, causes the computer to perform... Figure 4 , Figure 5 , Figure 6 (a) or Figure 7 The relevant method steps in the above embodiments implement the method.
[0176] In this application, the electronic device 1000, computer-readable storage medium, or computer program product provided in the embodiments are all used to execute the corresponding methods provided above. Therefore, the beneficial effects that can be achieved can be referred to the beneficial effects in the corresponding methods provided above, and will not be repeated here.
[0177] Through the above description of the embodiments, those skilled in the art can clearly understand that, for the sake of convenience and brevity, only the division of the above functional modules is used as an example. In actual applications, the above functions can be assigned to different functional modules as needed, that is, the internal structure of the device can be divided into different functional modules to complete all or part of the functions described above.
[0178] In the several embodiments provided in this application, it should be understood that the disclosed apparatus and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of modules or units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another device, or some features may be ignored or not executed. Furthermore, the mutual coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between devices or units may be electrical, mechanical, or other forms.
[0179] The units described as separate components may or may not be physically separate. A component shown as a unit can be one or more physical units; that is, it can be located in one place or distributed in multiple different locations. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0180] Furthermore, the functional units in the various embodiments of this application can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit described above can be implemented in hardware or as a software functional unit.
[0181] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a readable storage medium. Based on this understanding, the technical solutions of the embodiments of this application, essentially, or the parts that contribute to the prior art, or all or part of the technical solutions, can be embodied in the form of a software product. This software product is stored in a storage medium and includes several instructions to cause a device (which may be a microcontroller, chip, etc.) or processor to execute all or part of the steps of the methods described in the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, ROM, RAM, magnetic disks, or optical disks.
[0182] The above description is merely a specific embodiment of this application, but the scope of protection of this application is not limited thereto. Any changes or substitutions within the technical scope disclosed in this application should be included within the scope of protection of this application. Therefore, the scope of protection of this application should be determined by the scope of the claims.
Claims
1. An image processing method, characterized by, The method comprises: acquiring color information of a picture to be rendered; the color information of the picture to be rendered comprises color categories of the picture to be rendered, color values of four corners of the picture to be rendered, a proportion of non-transparent pixels in the picture to be rendered, and a proportion of white pixels in the picture to be rendered; based on the color information of the picture to be rendered, if it is determined that the picture to be rendered is a white-bottom icon, performing inverse color processing on the picture to be rendered; wherein, when the color information of the picture to be rendered is the color values of the four corners of the picture to be rendered, the acquiring of the color information of the picture to be rendered comprises: acquiring color values of vertices and centers of gravity of isosceles right triangles corresponding to each corner of the picture to be rendered.
2. The method of claim 1, wherein, The determining of the picture to be rendered as a white-bottom icon comprises: in a case where the color categories of the picture to be rendered are less than a first preset threshold, the color values of the four corners of the picture to be rendered satisfy a first preset condition, the proportion of non-transparent pixels in the picture to be rendered is greater than or equal to a second preset threshold, and the proportion of white pixels in the picture to be rendered is greater than or equal to a third preset threshold, the picture to be rendered is determined as a white-bottom icon.
3. The method according to claim 1 or 2, characterized in that, The color information of the picture to be rendered is the color categories of the picture to be rendered, and the acquiring of the color information of the picture to be rendered comprises: acquiring saturation s, lightness v and hue h of each color in a color bucket; the color bucket comprises color values of a plurality of colors in the picture to be rendered, and a quantity of each color in the plurality of colors; performing clustering analysis based on the color values of each color in the color bucket, the quantity of each color, the saturation s, the lightness v and the hue h of each color to determine the color categories of the picture to be rendered.
4. The method of claim 3, wherein, The performing of the clustering analysis based on the color values of each color in the color bucket, the quantity of each color, the saturation s, the lightness v and the hue h of each color to determine the color categories of the picture to be rendered comprises the following steps: step a, if the saturation s1 of a first color in the color bucket is less than v1 / 100*λ, the first color is stored in a first container; the v1 is the lightness of the first color, and the λ is greater than 0 and less than the maximum saturation of all colors in the color bucket; step b, if the saturation s1 of the first color is greater than or equal to v1 / 100*λ, each color in a second container is traversed, if it is determined that a second color exists in the second container, the quantity of the second color is updated as a sum of the quantity of the first color and the quantity of the second color, and the color value of the second color is updated as an average of the color value of the first color and the color value of the second color; wherein, a difference between the hue h2 of the second color and the hue h1 of the first color is less than a fourth preset threshold, and a sum of a difference between the lightness v2 of the second color and the lightness v1 of the first color and a difference between the saturation s2 of the second color and the saturation s1 of the first color is less than a fifth preset threshold. Step c, if the second container does not exist, the color value of the first color and the number of the first color are stored in the second container; Step d, according to steps a to c, each color in the color bucket is traversed in turn; Step e, the colors in the first container are divided into three color categories of low brightness, medium brightness and high brightness according to brightness; Step f, among the colors in the first container and the second container except white, the color category whose number is greater than or equal to the sixth preset threshold is determined as the color category of the picture to be rendered.
5. The method of claim 1, wherein, The color values of the vertices and the center of gravity of the isosceles right triangle corresponding to each corner of the picture to be rendered are obtained, including: In the case of n*D being less than min(W,H)*k, the color values of the vertices of the four isosceles right triangles with n*D as the side length and the center of gravity of each isosceles right triangle are obtained among the four corners of the picture to be rendered; wherein, the W is the width of the picture to be rendered, the H is the height of the picture to be rendered, the D is the pixel density of the electronic device, the n is an integer greater than 1, and the k is greater than 0 and less than 1; In the case of n*D being greater than or equal to min(W,H)*k, the color values of the vertices of the four isosceles right triangles with min(W,H)*k as the side length and the center of gravity of each isosceles right triangle are obtained among the four corners of the picture to be rendered.
6. The method of claim 2, wherein, The color values of the four corners of the picture to be rendered satisfy the first preset condition, including: the difference between the color value of the vertices of the four isosceles right triangles and the center of gravity of each isosceles right triangle in the alpha channel and 255 is less than the seventh preset threshold, and the color value of the vertices of the four isosceles right triangles and the center of gravity of each isosceles right triangle in the RGB space and the color value of the pure white color has a Euclidean distance less than the eighth preset threshold.
7. The method according to claim 1 or 2, characterized in that, The color information of the picture to be rendered is the proportion of non-transparent pixels in the picture to be rendered, and the color information of the picture to be rendered includes: Based on the color values of the plurality of colors in the picture to be rendered, the quotient of the number of the third color in the plurality of colors and the number of the plurality of colors is determined as the proportion of non-transparent pixels in the picture to be rendered; the third color is a color whose color value in the alpha channel is greater than the ninth preset threshold.
8. The method of claim 1 or 2, wherein, The color information of the picture to be rendered is the proportion of white pixels in the picture to be rendered, and the color information of the picture to be rendered includes: Based on the color values of the plurality of colors in the picture to be rendered, the quotient of the number of the fourth color in the plurality of colors and the number of the plurality of colors is determined as the proportion of white pixels in the picture to be rendered; the fourth color is a color whose difference between the color value in the alpha channel and 255 is less than the seventh preset threshold, and whose Euclidean distance in the RGB space and the color value of the pure white color is less than the eighth preset threshold.
9. An image processing apparatus characterized by comprising: The device includes a processing unit and a storage unit; wherein, The processing unit is configured to obtain color information of a picture to be rendered; the color information of the picture to be rendered comprises a color category of the picture to be rendered, color values of four corners of the picture to be rendered, a proportion of non-transparent pixels in the picture to be rendered, and a proportion of white pixels in the picture to be rendered. The processing unit is further configured to, based on the color information of the picture to be rendered, if it is determined that the picture to be rendered is a white-background icon, perform inverse color processing on the picture to be rendered. When the color information of the picture to be rendered is the color values of the four corners of the picture to be rendered, the processing unit is specifically configured to obtain color values of vertices and centers of gravity of isosceles right triangles corresponding to each corner of the picture to be rendered.
10. The apparatus of claim 9, wherein, The processing unit is specifically configured to determine that the picture to be rendered is a white-background icon in a case where the color category of the picture to be rendered is less than a first preset threshold, the color values of the four corners of the picture to be rendered satisfy a first preset condition, the proportion of non-transparent pixels in the picture to be rendered is greater than or equal to a second preset threshold, and the proportion of white pixels in the picture to be rendered is greater than or equal to a third preset threshold.
11. The apparatus of claim 9 or 10, wherein, The processing unit is specifically configured to: obtain saturation s, lightness v, and hue h of each color in the color bucket; the color bucket comprises color values of a plurality of colors in the picture to be rendered, and a quantity of each color in the plurality of colors; perform clustering analysis based on the color values of each color in the color bucket, the quantity of each color, the saturation s, the lightness v, and the hue h of each color, to determine the color category of the picture to be rendered.
12. The apparatus of claim 11, wherein, The processing unit is specifically configured to perform the following steps: Step a: if the saturation s1 of a first color in the color bucket is less than v1 / 100*λ, the first color is stored in a first container; v1 is the lightness of the first color, and λ is greater than 0 and less than the maximum saturation of all colors in the color bucket; Step b: if the saturation s1 of the first color is greater than or equal to v1 / 100*λ, each color in a second container is traversed, if it is determined that a second color exists in the second container, the quantity of the second color is updated to a sum of the quantity of the first color and the quantity of the second color, and the color value of the second color is updated to an average of the color value of the first color and the color value of the second color; wherein, a difference between the hue h2 of the second color and the hue h1 of the first color is less than a fourth preset threshold, and a sum of a difference between the lightness v2 of the second color and the lightness v1 of the first color and a difference between the saturation s2 of the second color and the saturation s1 of the first color is less than a fifth preset threshold; Step c: if the second color does not exist in the second container, the color value of the first color and the quantity of the first color are stored in the second container; Step d: each color in the color bucket is traversed in sequence according to steps a to c; Step e: colors in the first container are divided into three color categories of low brightness, medium brightness, and high brightness according to brightness. Step f, determining the color categories of colors other than white in the first container and the second container as the color categories of the picture to be rendered, if the number of color categories of the colors is greater than or equal to a sixth preset threshold.
13. The apparatus of claim 9, wherein, The processing unit is specifically configured to: In the case of n*D being less than min(W, H)*k, color values of vertices of four isosceles right triangles with n*D as a side length and a barycenter of each of the isosceles right triangles are obtained from four corners of the picture to be rendered; wherein the W is a width of the picture to be rendered, the H is a height of the picture to be rendered, the D is a pixel density of an electronic device, the n is an integer greater than 1, and the k is greater than 0 and less than 1. In the case of n*D being greater than or equal to min(W, H)*k, color values of vertices of four isosceles right triangles with min(W, H)*k as a side length and a barycenter of each of the isosceles right triangles are obtained from four corners of the picture to be rendered.
14. The apparatus of claim 10, wherein, The color values of the four corners of the picture to be rendered satisfy a first preset condition, including that a difference between the color values of the vertices of the four isosceles right triangles and the barycenters of each of the isosceles right triangles in an alpha channel is less than a seventh preset threshold, and a Euclidean distance between the color values of the vertices of the four isosceles right triangles and the barycenters of each of the isosceles right triangles in an RGB space and a color value of pure white is less than an eighth preset threshold.
15. The apparatus of claim 9 or 10, wherein, The processing unit is specifically configured to determine a quotient of a number of third colors in a plurality of colors in the picture to be rendered and a number of the plurality of colors as a proportion of non-transparent pixels in the picture to be rendered based on color values of the plurality of colors in the picture to be rendered. The third color is a color with a color value in the alpha channel greater than a ninth preset threshold.
16. The apparatus of claim 9 or 10, wherein, The processing unit is specifically configured to determine a quotient of a number of fourth colors in a plurality of colors in the picture to be rendered and a number of the plurality of colors as a proportion of white pixels in the picture to be rendered based on color values of the plurality of colors in the picture to be rendered. The fourth color is a color with a difference between a color value in the alpha channel and 255 less than the seventh preset threshold, and a Euclidean distance between a color value in an RGB space and a color value of pure white less than the eighth preset threshold.
17. An electronic device, comprising: The electronic device includes a processor and a memory; the memory is coupled with the processor; the memory is configured to store computer program code; the computer program code includes computer instructions, when the processor executes the computer instructions, causes the electronic device to perform the method in any one of claims 1-8.
18. A computer-readable storage medium, characterized in that, The computer readable storage medium includes computer instructions, when the computer instructions run on an electronic device, causes the electronic device to perform the method in any one of claims 1-8.
19. A computer program product, characterised in that, When the computer program product runs on a computer, causes the computer to perform the method in any one of claims 1-8.
Citation Information
Patent Citations
Display control method and device, computer readable medium and terminal equipment
CN111552451A