CN107241637B - 基于hsb颜色模式的应用图标智能搭配背板色板的方法 - Google Patents

Abstract

本发明公开了一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，A、预制应用图标背景搭配：提前对上述应用预制默认、优先的应用图标背景搭配；B、非预制应用图标背景搭配，C、对步骤B中应用图标进行筛选和逻辑判断，D、将RGB颜色分布输入到HSB颜色模式算法中，E、将步骤D中根据HSB颜色模式算法所得到的新的HSB颜色背景色板转换成RGB颜色模式，并为步骤C3、步骤C6中的应用图标匹配或搭配出背板色板。本发明有效解决了Android智能电视应用图标与背景板的适配问题，提高了应用图标与应用背景板搭配的美观程度，准确的达到了应用图标和应用名称在背景色板上总是能突出显示的目的，减少了美学设计人员的工作量。

Description

基于HSB颜色模式的应用图标智能搭配背板色板的方法

技术领域

本发明涉及应用图标颜色搭配方案，尤其涉及一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，该方法能智能地计算出与应用图标合理美观搭配的背景色板，能提高设计美学，有效减少美学设计人员工作量。

背景技术

在Android智能电视上，安装的所有应用几乎都需要使用背景板对应用图标进行放大排布和显示，使得图标更大，在较远的距离用户可以方便的查看和选择，但是应用的图标色彩风格各不相同，如果使用固定的一套背景板去随机搭配的话，很有可能会造成应用图标不够显眼或者根本看不到应用图标的后果，会严重影响用户体验，如果全部依赖美学设计人员挨个进行搭配和设计的话，势必会产生非常大的工作量。

传统技术是先预制一套，比如十种颜色风格不同的纯色背景色板；在要为应用贴背景板的时候，直接用预制的色板中随机或按顺序选出一张，然后贴在应用图标后面；应用名称很多情况下是直接放在背景色板之上，与应用图标、背景色板共同组成一个新的图标，提供用户选择、点击或触摸。应用名称颜色根据预制色板的颜色而固定。

传统技术存在如下技术缺陷：

在上述流程中，发现有一些不合理的地方，分别是：

第一、如果仅仅是预制十种风格不同的背景图，一般情况下应该是适用的，但是如果应用一旦多起来，或者遇到很特殊的应用图标的时候，比如有这样一张图标，它是在透明图层上添加了一个纯白色填充的图形，那么如果预制有白色背景，就不能为此应用图标做背景色板，不然应用图标将完全看不到，更不用说突出显示了。如果我们预制更多的色板，或者为所有应用都设计属于该应用的背景色板，那么工作量将是十分巨大的，并且也不可能为所有应用都设计一个背景色板。

第二、如果直接用随机的方式或者顺序选择的方式，选出预制的背景色板来贴上，除了有白色图标贴上了白色背景色板的情况外，还有可能会出现这样的一些情况，比如主色调为黄色的图标贴一个灰色的背景板，主色调为红色的图标贴一个深蓝色的图标，或者图标大部分是透明时，又配上一个很浅色的背景板等，这些在搭配完成后，看起来都十分怪异，即色彩搭配十分不合理，显得十分丑陋，应用图标也可能变得不显眼。

第三、应用文字颜色如果要放在背景色板之上，那么应用文字颜色也必须要是十分显眼的，远距离观看电视的用户才能看清该应用的信息。这样的话，文字颜色就必须根据背景色调自动地调整，当使用少量预制背板时，是可以指定背板与文字颜色配套的，但是如果是大量预制背板，或者使用本说明提供的方法时，就不适用了，必须要计算得出显眼的彩色再贴到背景色板之上。

发明内容

针对现有技术存在的不足之处，本发明的目的在于提供一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，能够计算出与应用图标合理美观搭配的背景色板，提高了设计美学，有效地减少了美学设计人员工作量。

本发明的目的通过下述技术方案实现：

一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，其方法如下：

A、预制应用图标背景搭配：对于系统应用或/和已知的推荐应用，提前对上述应用预制默认、优先的应用图标背景搭配；系统中预制有若干套浅色调背景色板、若干套深色调背景色板；

B、非预制应用图标背景搭配，其方法如下：

B1、提取应用图标，然后对该图标进行缩放到固定大小，如果原应用图标本就小于该固定大小则不进行缩放；

B2、提取固定大小下应用图标的每个像素，剔除应用图标四角的透明色并得到该应用图标的所有RGB颜色分布，通过使用排序算法，对提取到的颜色数量从多到少进行排序，之后使用改进的加权欧氏距离算法计算该RGB颜色分布中相似的颜色，把相似的颜色归为一组，然后重新得到一个新的RGB颜色分布，再次进行排序后并得到该应用图标的主要颜色、次要颜色、第三种颜色…第N种颜色；

C、对步骤B中应用图标进行筛选和逻辑判断，其方法如下：

C1、如果应用图标的主要颜色是透明色，并且次要颜色接近白色或者没有次要颜色或者次要颜色有较多的透明度，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C2、如果应用图标的主要颜色是透明色，并且次要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C3、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且有第三种颜色的，那么使用第三种颜色进行HSB颜色模式算法进行计算出背景色板进行匹配；

C4、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且没有第三种颜色的，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C5、如果应用图标的主要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C6、除C1～C5之外的其他情况，则使用HSB颜色模式算法进行计算出背景色板进行匹配；

D、将RGB颜色分布输入到HSB颜色模式算法中，将主要非透明颜色、次要非透明颜色、第三种非透明颜色…第N种非透明颜色转换成HSB颜色模式，其中，H表示色相，S表示饱和度，B表示亮度；所述HSB颜色模式算法的计算方法如下：

D1、使用S饱和度值来对主要颜色进行分类；

D11、80<S≤100时，表示色彩比较鲜艳，大部分图标都在这个范围，则直接使用H不变、S＝68、B＝93作为背景色板进行应用图标匹配；

D12、30<S≤80，表示色彩比较平均，则直接使用H不变、S＝S+10、B＝B-10作为背景色板进行应用图标匹配；

D13、10<S≤30，表示色彩偏灰，则直接使用H不变、S＝S-10、B＝B+10作为背景色板进行应用图标匹配；

D14、0≤S≤10，表示灰色，则直接使用H不变、S＝0，B＝B-10作为背景色板进行应用图标匹配；

E、将步骤D中根据HSB颜色模式算法所得到的新的HSB颜色背景色板转换成RGB颜色模式，并为步骤C3、步骤C6中的应用图标匹配或搭配出背板色板。

本发明较现有技术相比，具有以下优点及有益效果：

(1)本发明能够计算出与应用图标合理美观搭配的背景色板，提高了设计美学，有效地减少了美学设计人员工作量。

(2)本发明有效解决了Android智能电视应用图标与背景板的适配问题，提高了应用图标与应用背景板搭配的美观程度，准确的达到了应用图标和应用名称在背景色板上总是能突出显示的目的，减少了美学设计人员的工作量。

附图说明

图1为本发明实施例二计算应用图标推荐背景色板的流程图；

图2为本发明实施例二HSB颜色模式算法的流程示意图。

具体实施方式

下面结合实施例对本发明作进一步地详细说明：

实施例一

如图1、图2所示，一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，其方法如下：

A、预制应用图标背景搭配：对于系统应用或/和已知的推荐应用，提前对上述应用预制默认、优先的应用图标背景搭配；系统中预制有若干套浅色调背景色板、若干套深色调背景色板；

B、非预制应用图标背景搭配，其方法如下：

B1、提取应用图标，然后对该图标进行缩放到固定大小，如果原应用图标本就小于该固定大小则不进行缩放；

B2、提取固定大小下应用图标的每个像素，剔除应用图标四角的透明色并得到该应用图标的所有RGB颜色分布，通过使用排序算法，对提取到的颜色数量从多到少进行排序，之后使用改进的加权欧氏距离算法计算该RGB颜色分布中相似的颜色，把相似的颜色归为一组，然后重新得到一个新的RGB颜色分布，再次进行排序后并得到该应用图标的主要颜色、次要颜色、第三种颜色…第N种颜色；

C、对步骤B中应用图标进行筛选和逻辑判断，其方法如下：

C1、如果应用图标的主要颜色是透明色，并且次要颜色接近白色或者没有次要颜色或者次要颜色有较多的透明度，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C2、如果应用图标的主要颜色是透明色，并且次要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C3、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且有第三种颜色的，那么使用第三种颜色进行HSB颜色模式算法进行计算出背景色板进行匹配；

C4、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且没有第三种颜色的，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C5、如果应用图标的主要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C6、除C1～C5之外的其他情况，则使用HSB颜色模式算法进行计算出背景色板进行匹配；

D、将RGB颜色分布输入到HSB颜色模式算法中，将主要非透明颜色、次要非透明颜色、第三种非透明颜色…第N种非透明颜色转换成HSB颜色模式，其中，H表示色相，S表示饱和度，B表示亮度；所述HSB颜色模式算法的计算方法如下：

D1、使用S饱和度值来对主要颜色进行分类；

D11、80<S≤100时，表示色彩比较鲜艳，大部分图标都在这个范围，则直接使用H不变、S＝68、B＝93作为背景色板进行应用图标匹配；

D12、30<S≤80，表示色彩比较平均，则直接使用H不变、S＝S+10、B＝B-10作为背景色板进行应用图标匹配；

D13、10<S≤30，表示色彩偏灰，则直接使用H不变、S＝S-10、B＝B+10作为背景色板进行应用图标匹配；

D14、0≤S≤10，表示灰色，则直接使用H不变、S＝0，B＝B-10作为背景色板进行应用图标匹配；

E、将步骤D中根据HSB颜色模式算法所得到的新的HSB颜色背景色板(即步骤D1所确定的HSB颜色模式下背景色板)转换成RGB颜色模式，并为步骤C3、步骤C6中的应用图标匹配或搭配出背板色板。

实施例二

如图1、图2所示，一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，其方法如下：

A、预制应用图标背景搭配：对于系统应用或/和已知的推荐应用，提前对上述应用预制默认、优先的应用图标背景搭配；系统中预制有若干套浅色调背景色板、若干套深色调背景色板；

B、非预制应用图标背景搭配，其方法如下：

B1、提取应用图标，然后对该图标进行缩放到固定大小，如果原应用图标本就小于该固定大小则不进行缩放；

B2、提取固定大小下应用图标的每个像素，剔除应用图标四角的透明色并得到该应用图标的所有RGB颜色分布，通过使用排序算法，对提取到的颜色数量从多到少进行排序，之后使用改进的加权欧氏距离算法计算该RGB颜色分布中相似的颜色，把相似的颜色归为一组，然后重新得到一个新的RGB颜色分布，再次进行排序后并得到该应用图标的主要颜色、次要颜色、第三种颜色…第N种颜色；

C、对步骤B中应用图标进行筛选和逻辑判断，其方法如下：

C1、如果应用图标的主要颜色是透明色，并且次要颜色接近白色或者没有次要颜色或者次要颜色有较多的透明度，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C2、如果应用图标的主要颜色是透明色，并且次要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C3、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且有第三种颜色的，那么使用第三种颜色进行HSB颜色模式算法进行计算出背景色板进行匹配；

C4、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且没有第三种颜色的，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C5、如果应用图标的主要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C6、除C1～C5之外的其他情况，则使用HSB颜色模式算法进行计算出背景色板进行匹配；

D、将RGB颜色分布输入到HSB颜色模式算法中，将主要非透明颜色、次要非透明颜色、第三种非透明颜色…第N种非透明颜色转换成HSB颜色模式，其中，H表示色相，S表示饱和度，B表示亮度；所述HSB颜色模式算法的计算方法如下：

D1、使用S饱和度值来对主要颜色进行分类；

D11、80<S≤100时，表示色彩比较鲜艳，大部分图标都在这个范围，则直接使用H不变、S＝68、B＝93作为背景色板进行应用图标匹配；

D12、30<S≤80，表示色彩比较平均，则直接使用H不变、S＝S+10、B＝B-10作为背景色板进行应用图标匹配；

D13、10<S≤30，表示色彩偏灰，则直接使用H不变、S＝S-10、B＝B+10作为背景色板进行应用图标匹配；

D14、0≤S≤10，表示灰色，则直接使用H不变、S＝0，B＝B-10作为背景色板进行应用图标匹配；

D2、当背景色板需求不仅仅只是一种颜色时，就需要其他颜色配色，这时候就需要对次要非透明颜色或再之后的非透明颜色(再之后的非透明颜色依次为第三种非透明颜色…第N种非透明颜色)进行步骤D1的计算，并得到次要非透明颜色或再之后的非透明颜色的应用图标匹配方案；

D3、将步骤D中根据HSB颜色模式算法分别得到主要颜色、次要非透明颜色或再之后的非透明颜色的HSB颜色背景色板(即主要颜色对应得到一个HSB颜色背景色板，次要非透明颜色对应得到一个HSB颜色背景色板，再之后的非透明颜色分别对应得到HSB颜色背景色板)，然后分别将上述HSB颜色背景色板依次转换成RGB颜色模式，并输出一个有顺序的背景色板RGB颜色列表，该背景色板RGB颜色列表按照主要颜色的RGB颜色背景色板、次要非透明颜色的RGB颜色背景色板、再之后的非透明颜色的RGB颜色背景色板依次顺序排列。

E、当背景色板只需要纯色搭配时，那么直接按照步骤D1中主要颜色的HSB颜色背景色板转换成RGB颜色模式下进行应用图标匹配或搭配出背板色板；当背景色板需要多种颜色混合的时候，那么按照步骤D3中所提供的背景色板列表中排列靠前的背景色板进行应用图标匹配或搭配出背板色板，例如需要三种颜色应用图标匹配或搭配出背板色板时，则直接选择背景色板列表中的主要颜色的RGB颜色背景色板、次要非透明颜色的RGB颜色背景色板、第三种非透明颜色的RGB颜色背景色板三种颜色混合进行应用图标匹配或搭配出背板色板；

F、得到步骤E输出的新的RGB颜色列表后，需要创建一个位图，或者修改一个已有形状的位图，然后遍历该位图的所有像素点，每一个像素点都填充为计算出的推荐色(背景色板RGB颜色列表所确定的RGB颜色背景色板)，或者填充为经过HSB颜色模式算法计算出的一套混合多种颜色的混合色块(背景色板RGB颜色列表所确定的RGB颜色背景色板)。在得到推荐背景板颜色的时候，计算出该颜色的反色，或者多种颜色的混合色的反色，作为应用图标名称的颜色。

以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等，均应包含在本发明的保护范围之内。

Claims (1)

1.一种基于HSB颜色模式的应用图标智能搭配背板色板的方法，其特征在于：其方法如下：

A、预制应用图标背景搭配：对于系统应用或/和已知的推荐应用，提前对上述应用预制默认、优先的应用图标背景搭配；系统中预制有若干套浅色调背景色板、若干套深色调背景色板；

B、非预制应用图标背景搭配，其方法如下：

B1、提取应用图标，然后对该图标进行缩放到固定大小，如果原应用图标本就小于该固定大小则不进行缩放；

B2、提取固定大小下应用图标的每个像素，剔除应用图标四角的透明色并得到该应用图标的所有RGB颜色分布，通过使用排序算法，对提取到的颜色数量从多到少进行排序，之后使用改进的加权欧氏距离算法计算该RGB颜色分布中相似的颜色，把相似的颜色归为一组，然后重新得到一个新的RGB颜色分布，再次进行排序后并得到该应用图标的主要颜色、次要颜色、第三种颜色…第N种颜色；

C、对步骤B中应用图标进行筛选和逻辑判断，其方法如下：

C1、如果应用图标的主要颜色是透明色，并且次要颜色接近白色或者没有次要颜色或者次要颜色有较多的透明度，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C2、如果应用图标的主要颜色是透明色，并且次要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C3、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且有第三种颜色的，那么使用第三种颜色进行HSB颜色模式算法进行计算出背景色板进行匹配；

C4、如果应用图标的主要颜色接近白色，并且次要颜色是透明色的，并且没有第三种颜色的，那么随机使用预制的一套浅色调的背景色板之一进行匹配；

C5、如果应用图标的主要颜色接近黑色，那么随机使用预制的一套深色调的背景色板之一进行匹配；

C6、除C1～C5之外的其他情况，则使用HSB颜色模式算法进行计算出背景色板进行匹配；

D、将RGB颜色分布输入到HSB颜色模式算法中，将主要非透明颜色、次要非透明颜色、第三种非透明颜色…第N种非透明颜色转换成HSB颜色模式，其中，H表示色相，S表示饱和度，B表示亮度；所述HSB颜色模式算法的计算方法如下：

D1、使用S饱和度值来对主要颜色进行分类；

D11、80<S≤100时，表示色彩比较鲜艳，大部分图标都在这个范围，则直接使用H不变、S＝68、B＝93作为背景色板进行应用图标匹配；

D12、30<S≤80，表示色彩比较平均，则直接使用H不变、S＝S+10、B＝B-10作为背景色板进行应用图标匹配；

D13、10<S≤30，表示色彩偏灰，则直接使用H不变、S＝S-10、B＝B+10作为背景色板进行应用图标匹配；

D14、0≤S≤10，表示灰色，则直接使用H不变、S＝0，B＝B-10作为背景色板进行应用图标匹配；

E、将步骤D中根据HSB颜色模式算法所得到的新的HSB颜色背景色板转换成RGB颜色模式，并为步骤C3、步骤C6中的应用图标匹配或搭配出背板色板。

Images