应用图标的绘制方法、电子设备以及相关装置与流程

本技术实施例涉及终端，尤其涉及一种应用图标的绘制方法、电子设备以及相关装置。

背景技术：

1、电子设备可根据环境光的亮度提供多种显示模式；例如，显示模式可包括浅色模式和深色模式。浅色模式可适用于较为明亮的环境中，例如，在白天或光线充足的环境中，用户可将电子设备的显示模式调整为浅色模式。深色模式可适用于昏暗的环境中，例如，在夜间或低光环境中，用户可将电子设备的显示模式调整为深色模式。

2、当电子设备切换到深色模式时，电子设备的桌面中可显示多个应用图标。但可能的实现中，深色模式的应用图标的绘制方式较为单一。例如，深色模式下的应用图标可以为针对浅色模式下的应用图标进行压暗或反色后得到的，用户的使用感不佳。

技术实现思路

1、本技术实施例提供一种应用图标的绘制方法、电子设备以及相关装置，电子设备可通过浅色模式的应用图标设置深色模式的前景图像，和使用深色模式的前景图像的颜色匹配相同或预设颜色的背景图像，以提升用户对深色模式的应用图标的感知度和沉浸度。

2、第一方面，本技术实施例提供一种应用图标的绘制方法，应用于电子设备，方法包括：

3、显示浅色模式的桌面；浅色模式的桌面中包括第一应用的第一图标；第一图标对应浅色模式，第一图标包括第一前景图像和第一背景图像，第一前景图像位于第一背景图像的上层；接收到用于切换显示模式的触发操作；显示模式包括浅色模式和深色模式；显示深色模式的桌面；深色模式的桌面中包括第一应用的第二图标，第二图标对应深色模式，第二图标包括第二前景图像和第二背景图像，第二前景图像位于第二背景图像的上层；第二前景图像的内容与第一前景图像的内容相同；第二背景图像的颜色与第一背景图像的颜色不同；其中，第二前景图像的颜色为第一前景图像的颜色或第一背景图像的颜色；第二背景图像是从多个预设背景图像中匹配得到的；预设背景图像包括深色图像和具有透明度的纯色蒙版，纯色蒙版位于深色图像的上层。

4、本技术实施例中，浅色模式的桌面可例如图2中的a所示界面；第一图标可以为浅色模式的应用图标。在切换到深色模式后，电子设备可显示深色模式的第二图标，如图2中的d所示界面中的应用图标。在深色模式下，第二前景图像的颜色可以为第一前景图像的颜色或第一背景图像的颜色，以延续浅色模式的应用图标的色彩搭配。

5、在使用深色模式时，电子设备可呈现从亮色的前景图像(例如延续浅色图标的色彩搭配)到暗色背景图像(例如纯色蒙版和深色图像叠合)，再到深色壁纸或深色桌面的过渡效果，减弱亮色前景图像与深色的背景图像的对比度。同时，同色系的第二前景图像和第二背景图像(例如纯色蒙版的颜色与深色模式前景图像的颜色相匹配)，可营造出光线照射在彩色物体(例如深色模式前景图像的内容)上后，光线被反射或透射到暗色平面(例如深色模式背景图像)的效果，提升深色模式前景图像的立体感，从而提升用户使用深色模式的沉浸式体验。

6、在一种可能的实现方式中，显示深色模式的桌面之前，还包括：识别第二前景图像的一个或多个颜色；根据第二前景图像的颜色在多个预设背景图像中匹配得到第二背景图像；第二背景图像中纯色蒙版的颜色与一个或多个颜色中的目标颜色相同；目标颜色为一个或多个颜色中画幅比例最高的颜色，且目标颜色不包括白色；将第二前景图像与第二背景图像合成为第二图标。

7、这样，电子设备使用深色模式前景图像的主要色系匹配背景图像，使得深色模式的背景图像与前景图像颜色相近，可营造出光线照射在彩色物体上后，光线被反射或透射到暗色平面的效果，提升深色模式的前景图像的立体感，从而提升用户使用深色模式的沉浸式体验。

8、在一种可能的实现方式中，根据第二前景图像的颜色在多个预设背景图像中匹配得到第二背景图像，包括：在第二前景图像的颜色数量为一，且第二前景图像的颜色为目标颜色的情况下，根据目标颜色在多个预设背景图像中匹配得到第二背景图像；第二背景图像中纯色蒙版的颜色与目标颜色相同。

9、这样，在深色模式的前景图像中包括一种颜色时，电子设备可将该颜色作为目标颜色，匹配深色模式的背景图像，使得深色模式的前景图像与背景图像颜色相同或相近，以提升深色模式的使用沉浸感。

10、在一种可能的实现方式中，根据第二前景图像的颜色在多个预设背景图像中匹配得到第二背景图像，还包括：在第二前景图像包括多种颜色的情况下，得到多个颜色中任一颜色在第二前景图像的画幅比例；其中，第二前景图像中包括目标颜色，目标颜色为多个颜色中在第二前景图像的画幅比例最高的颜色，且目标颜色的画幅比例与其他颜色的画幅比例的差值大于第一预设值；根据目标颜色在多个预设背景图像中匹配得到第二背景图像；第二背景图像中纯色蒙版的颜色与目标颜色相同。

11、这样，在深色模式的前景图像中包括多个颜色时，电子设备可将画幅比例最大的颜色作为目标颜色，匹配深色模式的背景图像，使得深色模式的前景图像与背景图像颜色相同或相近，以提升深色模式的使用沉浸感。

12、在一种可能的实现方式中，根据第二前景图像的颜色在多个预设背景图像中匹配得到第二背景图像，还包括：在第二前景图像包括多种颜色的情况下，得到多个颜色中任一颜色在第二前景图像的画幅比例；第二前景图像中包括目标颜色和第一颜色，第一颜色为白色；目标颜色的画幅比例与第一颜色的画幅比例的差值小于第二预设值，且目标颜色的画幅比例和第一颜色的画幅比例均大于其他颜色的画幅比例；根据目标颜色在多个预设背景图像中匹配得到第二背景图像；第二背景图像中纯色蒙版的颜色与目标颜色相同。

13、这样，在深色模式的前景图像中包括多个颜色和白色，且白色和彩色的画幅比例相近时，电子设备可将除白色外画幅比例最大的彩色作为目标颜色，匹配深色模式的背景图像，使得深色模式的前景图像与背景图像颜色相同或相近，以提升深色模式的使用沉浸感。

14、在一种可能的实现方式中，显示深色模式的桌面之前，还包括：识别第二前景图像的多个颜色；在无法识别到目标颜色的情况下，根据预设颜色在多个预设背景图像中匹配得到第二背景图像；预设颜色用于表征多个颜色混合后的颜色，第二背景图像中纯色蒙版的颜色与预设颜色相同；将第二前景图像与第二背景图像合成为第二图标。

15、这样，在第二前景图像中色彩较为丰富时，电子设备无法确定第二前景图像的主要色系；电子设备可使用中性色调(例如灰色)的预设背景图像，营造出多个颜色的光线混合投影在暗色平面的效果，提升第二前景图像的立体感，从而提升用户使用深色模式的沉浸式体验；此外，中性色调的预设背景图像可使得前景图像中的不同颜色均得到衬托，为用户提供统一纯净,简洁大方的视觉感受。

16、在一种可能的实现方式中，根据预设颜色在多个预设背景图像中匹配得到第二背景图像，包括：得到多个颜色中任一颜色在第二前景图像的画幅比例；在多个颜色的画幅比例相同或接近的情况下，根据预设颜色在多个预设背景图像中匹配得到第二背景图像。

17、这样，在多个颜色的画幅比例相同或接近的情况下，电子设备无法确定深色模式前景图像的主要色系，电子设备可使用中性色调的预设颜色匹配深色模式的背景图像，使得深色模式前景图像中多个颜色均得到衬托，提升深色模式应用图标的纯净感。

18、在一种可能的实现方式中，根据预设颜色在多个预设背景图像中匹配得到第二背景图像，还包括：在第二前景图像包括多个半透明图层，且多个半透明图层具有透视关系的情况下，根据预设颜色在多个预设背景图像中匹配得到第二背景图像。

19、这样，在深色模式前景图像中包括半透明的具有透视关系的多个图层时，电子设备可使用灰色的预设背景图像作为深色模式的背景图像，以通过灰色与彩色的对比度，更清晰的体现半透明图层的边缘，以及更清晰的呈现多个颜色图层之间的透视效果，从而提升深色模式下应用图标的纯净感。

20、在一种可能的实现方式中，在第一前景图像包括一种颜色，且第一前景图像的颜色为白色的情况下，第二前景图像的颜色为第一背景图像的颜色；或者，在第一前景图像包括一种颜色，且第一前景图像的颜色不为白色的情况下，第二前景图像的颜色为第一前景图像的颜色；或者，在第一前景图像包括多种颜色的情况下，第二前景图像的颜色为第一前景图像的颜色。

21、这样，电子设备可保留浅色模式下应用图标的配色方案，以保留前景图像或背景图像的色彩效果，保持深色模式和浅色模式下应用图标配色的一致性，为用户提供一致性的视觉体验。

22、在一种可能的实现方式中，第一应用包括系统应用和/或三方应用；系统应用的第一前景图像和第二前景图像均为预设图像；三方应用的第一前景图像为预设图像，三方应用的第二前景图像为预设图像，或者，三方应用的第二前景图像为基于第一前景图像的可缩放矢量图形文件得到的前景图像。

23、这样，电子设备可为系统应用和三方应用提供一种简洁、轻量的应用图标的绘制方式，以提升深色模式下应用图标的可识别度和美观度。

24、第二方面，本技术实施例提供一种电子设备，包括处理器和存储器，存储器用于存储代码指令，处理器用于运行代码指令，以执行第一方面或第一方面的任意一种可能的实现方式中描述的方法。

25、第三方面，本技术实施例提供一种计算机可读存储介质，计算机可读存储介质中存储有计算机程序或指令，当计算机程序或指令在计算机上运行时，使得计算机执行第一方面或第一方面的任意一种可能的实现方式中描述的方法。

26、第四方面，本技术实施例提供一种包括计算机程序的计算机程序产品，当计算机程序在计算机上运行时，使得计算机执行第一方面或第一方面的任意一种可能的实现方式中描述的方法。

27、第五方面，本技术提供一种芯片或者芯片系统，该芯片或者芯片系统包括至少一个处理器和通信接口，通信接口和至少一个处理器通过线路互联，至少一个处理器用于运行计算机程序或指令，以执行第一方面或第一方面的任意一种可能的实现方式中描述的方法。其中，芯片中的通信接口可以为输入/输出接口、管脚或电路等。

28、在一种可能的实现中，本技术中上述描述的芯片或者芯片系统还包括至少一个存储器，该至少一个存储器中存储有指令。该存储器可以为芯片内部的存储单元，例如，寄存器、缓存等，也可以是该芯片的存储单元(例如，只读存储器、随机存取存储器等)。

29、应当理解的是，本技术的第二方面至第五方面与本技术的第一方面的技术方案相对应，各方面及对应的可行实施方式所取得的有益效果相似，不再赘述。