本發(fā)明涉及應(yīng)用圖標(biāo)顏色搭配方案,尤其涉及一種基于hsb顏色模式的應(yīng)用圖標(biāo)智能搭配背板色板的方法,該方法能智能地計算出與應(yīng)用圖標(biāo)合理美觀搭配的背景色板,能提高設(shè)計美學(xué),有效減少美學(xué)設(shè)計人員工作量。
背景技術(shù):
在android智能電視上,安裝的所有應(yīng)用幾乎都需要使用背景板對應(yīng)用圖標(biāo)進行放大排布和顯示,使得圖標(biāo)更大,在較遠的距離用戶可以方便的查看和選擇,但是應(yīng)用的圖標(biāo)色彩風(fēng)格各不相同,如果使用固定的一套背景板去隨機搭配的話,很有可能會造成應(yīng)用圖標(biāo)不夠顯眼或者根本看不到應(yīng)用圖標(biāo)的后果,會嚴重影響用戶體驗,如果全部依賴美學(xué)設(shè)計人員挨個進行搭配和設(shè)計的話,勢必會產(chǎn)生非常大的工作量。
傳統(tǒng)技術(shù)是先預(yù)制一套,比如十種顏色風(fēng)格不同的純色背景色板;在要為應(yīng)用貼背景板的時候,直接用預(yù)制的色板中隨機或按順序選出一張,然后貼在應(yīng)用圖標(biāo)后面;應(yīng)用名稱很多情況下是直接放在背景色板之上,與應(yīng)用圖標(biāo)、背景色板共同組成一個新的圖標(biāo),提供用戶選擇、點擊或觸摸。應(yīng)用名稱顏色根據(jù)預(yù)制色板的顏色而固定。
傳統(tǒng)技術(shù)存在如下技術(shù)缺陷:
在上述流程中,發(fā)現(xiàn)有一些不合理的地方,分別是:
第一、如果僅僅是預(yù)制十種風(fēng)格不同的背景圖,一般情況下應(yīng)該是適用的,但是如果應(yīng)用一旦多起來,或者遇到很特殊的應(yīng)用圖標(biāo)的時候,比如有這樣一張圖標(biāo),它是在透明圖層上添加了一個純白色填充的圖形,那么如果預(yù)制有白色背景,就不能為此應(yīng)用圖標(biāo)做背景色板,不然應(yīng)用圖標(biāo)將完全看不到,更不用說突出顯示了。如果我們預(yù)制更多的色板,或者為所有應(yīng)用都設(shè)計屬于該應(yīng)用的背景色板,那么工作量將是十分巨大的,并且也不可能為所有應(yīng)用都設(shè)計一個背景色板。
第二、如果直接用隨機的方式或者順序選擇的方式,選出預(yù)制的背景色板來貼上,除了有白色圖標(biāo)貼上了白色背景色板的情況外,還有可能會出現(xiàn)這樣的一些情況,比如主色調(diào)為黃色的圖標(biāo)貼一個灰色的背景板,主色調(diào)為紅色的圖標(biāo)貼一個深藍色的圖標(biāo),或者圖標(biāo)大部分是透明時,又配上一個很淺色的背景板等,這些在搭配完成后,看起來都十分怪異,即色彩搭配十分不合理,顯得十分丑陋,應(yīng)用圖標(biāo)也可能變得不顯眼。
第三、應(yīng)用文字顏色如果要放在背景色板之上,那么應(yīng)用文字顏色也必須要是十分顯眼的,遠距離觀看電視的用戶才能看清該應(yīng)用的信息。這樣的話,文字顏色就必須根據(jù)背景色調(diào)自動地調(diào)整,當(dāng)使用少量預(yù)制背板時,是可以指定背板與文字顏色配套的,但是如果是大量預(yù)制背板,或者使用本說明提供的方法時,就不適用了,必須要計算得出顯眼的彩色再貼到背景色板之上。
技術(shù)實現(xiàn)要素:
針對現(xiàn)有技術(shù)存在的不足之處,本發(fā)明的目的在于提供一種基于hsb顏色模式的應(yīng)用圖標(biāo)智能搭配背板色板的方法,能夠計算出與應(yīng)用圖標(biāo)合理美觀搭配的背景色板,提高了設(shè)計美學(xué),有效地減少了美學(xué)設(shè)計人員工作量。
本發(fā)明的目的通過下述技術(shù)方案實現(xiàn):
一種基于hsb顏色模式的應(yīng)用圖標(biāo)智能搭配背板色板的方法,其方法如下:
a、預(yù)制應(yīng)用圖標(biāo)背景搭配:對于系統(tǒng)應(yīng)用或/和已知的推薦應(yīng)用,提前對上述應(yīng)用預(yù)制默認、優(yōu)先的應(yīng)用圖標(biāo)背景搭配;系統(tǒng)中預(yù)制有若干套淺色調(diào)背景色板、若干套深色調(diào)背景色板;
b、非預(yù)制應(yīng)用圖標(biāo)背景搭配,其方法如下:
b1、提取應(yīng)用圖標(biāo),然后對該圖標(biāo)進行縮放到固定大小,如果原應(yīng)用圖標(biāo)本就小于該固定大小則不進行縮放;
b2、提取固定大小下應(yīng)用圖標(biāo)的每個像素,剔除應(yīng)用圖標(biāo)四角的透明色并得到該應(yīng)用圖標(biāo)的所有rgb顏色分布,通過使用排序算法,對提取到的顏色數(shù)量從多到少進行排序,之后使用改進的加權(quán)歐氏距離算法計算該rgb顏色分布中相似的顏色,把相似的顏色歸位一組,然后重新得到一個新的rgb顏色分布,再次進行排序后并得到該應(yīng)用圖標(biāo)的主要顏色、次要顏色、第三種顏色…第n種顏色;
c、對步驟b中應(yīng)用圖標(biāo)進行篩選和邏輯判斷,其方法如下:
c1、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近白色或者沒有次要顏色或者次要顏色有較多的透明度,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c2、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c3、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且有第三種顏色的,那么使用第三種顏色進行hsb顏色模式算法進行計算出背景色板進行匹配;
c4、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且沒有第三種顏色的,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c5、如果應(yīng)用圖標(biāo)的主要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c6、除c1~c5之外的其他情況,則使用hsb顏色模式算法進行計算出背景色板進行匹配;
d、將rgb顏色分布輸入到hsb顏色模式算法中,將主要非透明顏色、次要非透明顏色、第三種非透明顏色…第n種非透明顏色轉(zhuǎn)換成hsb顏色模式,其中,h表示色相,s表示飽和度,b表示亮度;所述hsb顏色模式算法的計算方法如下:
d1、使用s飽和度值來對主要顏色進行分類;
d11、80<s≤100時,表示色彩比較鮮艷,大部分圖標(biāo)都在這個范圍,則直接使用h不變、s=68、b=93作為背景色板進行應(yīng)用圖標(biāo)匹配;
d12、30<s≤80,表示色彩比較平均,則直接使用h不變、s=s+10、b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d13、10<s≤30,表示色彩偏灰,則直接使用h不變、s=s-10、b=b+10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d14、0≤s≤10,表示灰色,則直接使用h不變、s=0,b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
e、將步驟d中根據(jù)hsb顏色模式算法所得到的新的hsb顏色背景色板轉(zhuǎn)換成rgb顏色模式,并為步驟c3、步驟c6中的應(yīng)用圖標(biāo)匹配或搭配出背板色板。
本發(fā)明較現(xiàn)有技術(shù)相比,具有以下優(yōu)點及有益效果:
(1)本發(fā)明能夠計算出與應(yīng)用圖標(biāo)合理美觀搭配的背景色板,提高了設(shè)計美學(xué),有效地減少了美學(xué)設(shè)計人員工作量。
(2)本發(fā)明有效解決了android智能電視應(yīng)用圖標(biāo)與背景板的適配問題,提高了應(yīng)用圖標(biāo)與應(yīng)用背景板搭配的美觀程度,準(zhǔn)確的達到了應(yīng)用圖標(biāo)和應(yīng)用名稱在背景色板上總是能突出顯示的目的,減少了美學(xué)設(shè)計人員的工作量。
附圖說明
圖1為本發(fā)明實施例二計算應(yīng)用圖標(biāo)推薦背景色板的流程圖;
圖2為本發(fā)明實施例二hsb顏色模式算法的流程示意圖。
具體實施方式
下面結(jié)合實施例對本發(fā)明作進一步地詳細說明:
實施例一
如圖1、圖2所示,一種基于hsb顏色模式的應(yīng)用圖標(biāo)智能搭配背板色板的方法,其方法如下:
a、預(yù)制應(yīng)用圖標(biāo)背景搭配:對于系統(tǒng)應(yīng)用或/和已知的推薦應(yīng)用,提前對上述應(yīng)用預(yù)制默認、優(yōu)先的應(yīng)用圖標(biāo)背景搭配;系統(tǒng)中預(yù)制有若干套淺色調(diào)背景色板、若干套深色調(diào)背景色板;
b、非預(yù)制應(yīng)用圖標(biāo)背景搭配,其方法如下:
b1、提取應(yīng)用圖標(biāo),然后對該圖標(biāo)進行縮放到固定大小,如果原應(yīng)用圖標(biāo)本就小于該固定大小則不進行縮放;
b2、提取固定大小下應(yīng)用圖標(biāo)的每個像素,剔除應(yīng)用圖標(biāo)四角的透明色并得到該應(yīng)用圖標(biāo)的所有rgb顏色分布,通過使用排序算法,對提取到的顏色數(shù)量從多到少進行排序,之后使用改進的加權(quán)歐氏距離算法計算該rgb顏色分布中相似的顏色,把相似的顏色歸位一組,然后重新得到一個新的rgb顏色分布,再次進行排序后并得到該應(yīng)用圖標(biāo)的主要顏色、次要顏色、第三種顏色…第n種顏色;
c、對步驟b中應(yīng)用圖標(biāo)進行篩選和邏輯判斷,其方法如下:
c1、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近白色或者沒有次要顏色或者次要顏色有較多的透明度,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c2、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c3、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且有第三種顏色的,那么使用第三種顏色進行hsb顏色模式算法進行計算出背景色板進行匹配;
c4、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且沒有第三種顏色的,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c5、如果應(yīng)用圖標(biāo)的主要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c6、除c1~c5之外的其他情況,則使用hsb顏色模式算法進行計算出背景色板進行匹配;
d、將rgb顏色分布輸入到hsb顏色模式算法中,將主要非透明顏色、次要非透明顏色、第三種非透明顏色…第n種非透明顏色轉(zhuǎn)換成hsb顏色模式,其中,h表示色相,s表示飽和度,b表示亮度;所述hsb顏色模式算法的計算方法如下:
d1、使用s飽和度值來對主要顏色進行分類;
d11、80<s≤100時,表示色彩比較鮮艷,大部分圖標(biāo)都在這個范圍,則直接使用h不變、s=68、b=93作為背景色板進行應(yīng)用圖標(biāo)匹配;
d12、30<s≤80,表示色彩比較平均,則直接使用h不變、s=s+10、b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d13、10<s≤30,表示色彩偏灰,則直接使用h不變、s=s-10、b=b+10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d14、0≤s≤10,表示灰色,則直接使用h不變、s=0,b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
e、將步驟d中根據(jù)hsb顏色模式算法所得到的新的hsb顏色背景色板(即步驟d1所確定的hsb顏色模式下背景色板)轉(zhuǎn)換成rgb顏色模式,并為步驟c3、步驟c6中的應(yīng)用圖標(biāo)匹配或搭配出背板色板。
實施例二
如圖1、圖2所示,一種基于hsb顏色模式的應(yīng)用圖標(biāo)智能搭配背板色板的方法,其方法如下:
a、預(yù)制應(yīng)用圖標(biāo)背景搭配:對于系統(tǒng)應(yīng)用或/和已知的推薦應(yīng)用,提前對上述應(yīng)用預(yù)制默認、優(yōu)先的應(yīng)用圖標(biāo)背景搭配;系統(tǒng)中預(yù)制有若干套淺色調(diào)背景色板、若干套深色調(diào)背景色板;
b、非預(yù)制應(yīng)用圖標(biāo)背景搭配,其方法如下:
b1、提取應(yīng)用圖標(biāo),然后對該圖標(biāo)進行縮放到固定大小,如果原應(yīng)用圖標(biāo)本就小于該固定大小則不進行縮放;
b2、提取固定大小下應(yīng)用圖標(biāo)的每個像素,剔除應(yīng)用圖標(biāo)四角的透明色并得到該應(yīng)用圖標(biāo)的所有rgb顏色分布,通過使用排序算法,對提取到的顏色數(shù)量從多到少進行排序,之后使用改進的加權(quán)歐氏距離算法計算該rgb顏色分布中相似的顏色,把相似的顏色歸位一組,然后重新得到一個新的rgb顏色分布,再次進行排序后并得到該應(yīng)用圖標(biāo)的主要顏色、次要顏色、第三種顏色…第n種顏色;
c、對步驟b中應(yīng)用圖標(biāo)進行篩選和邏輯判斷,其方法如下:
c1、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近白色或者沒有次要顏色或者次要顏色有較多的透明度,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c2、如果應(yīng)用圖標(biāo)的主要顏色是透明色,并且次要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c3、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且有第三種顏色的,那么使用第三種顏色進行hsb顏色模式算法進行計算出背景色板進行匹配;
c4、如果應(yīng)用圖標(biāo)的主要顏色接近白色,并且次要顏色是透明色的,并且沒有第三種顏色的,那么隨機使用預(yù)制的一套淺色調(diào)的背景色板之一進行匹配;
c5、如果應(yīng)用圖標(biāo)的主要顏色接近黑色,那么隨機使用預(yù)制的一套深色調(diào)的背景色板之一進行匹配;
c6、除c1~c5之外的其他情況,則使用hsb顏色模式算法進行計算出背景色板進行匹配;
d、將rgb顏色分布輸入到hsb顏色模式算法中,將主要非透明顏色、次要非透明顏色、第三種非透明顏色…第n種非透明顏色轉(zhuǎn)換成hsb顏色模式,其中,h表示色相,s表示飽和度,b表示亮度;所述hsb顏色模式算法的計算方法如下:
d1、使用s飽和度值來對主要顏色進行分類;
d11、80<s≤100時,表示色彩比較鮮艷,大部分圖標(biāo)都在這個范圍,則直接使用h不變、s=68、b=93作為背景色板進行應(yīng)用圖標(biāo)匹配;
d12、30<s≤80,表示色彩比較平均,則直接使用h不變、s=s+10、b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d13、10<s≤30,表示色彩偏灰,則直接使用h不變、s=s-10、b=b+10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d14、0≤s≤10,表示灰色,則直接使用h不變、s=0,b=b-10作為背景色板進行應(yīng)用圖標(biāo)匹配;
d2、當(dāng)背景色板需求不僅僅只是一種顏色時,就需要其他顏色配色,這時候就需要對次要非透明顏色或再之后的非透明顏色(再之后的非透明顏色依次為第三種非透明顏色…第n種非透明顏色)進行步驟d1的計算,并得到次要非透明顏色或再之后的非透明顏色的應(yīng)用圖標(biāo)匹配方案;
d3、將步驟d中根據(jù)hsb顏色模式算法分別得到主要顏色、次要非透明顏色或再之后的非透明顏色的hsb顏色背景色板(即主要顏色對應(yīng)得到一個hsb顏色背景色板,次要非透明顏色對應(yīng)得到一個hsb顏色背景色板,再之后的非透明顏色分別對應(yīng)得到hsb顏色背景色板),然后分別將上述hsb顏色背景色板依次轉(zhuǎn)換成rgb顏色模式,并輸出一個有順序的背景色板rgb顏色列表,該背景色板rgb顏色列表按照主要顏色的rgb顏色背景色板、次要非透明顏色的rgb顏色背景色板、再之后的非透明顏色的rgb顏色背景色板依次順序排列。
e、當(dāng)背景色板只需要純色搭配時,那么直接按照步驟d1中主要顏色的hsb顏色背景色板轉(zhuǎn)換成rgb顏色模式下進行應(yīng)用圖標(biāo)匹配或搭配出背板色板;當(dāng)背景色板需要多種顏色混合的時候,那么按照步驟d3中所提供的背景色板列表中排列靠前的背景色板進行應(yīng)用圖標(biāo)匹配或搭配出背板色板,例如需要三種顏色應(yīng)用圖標(biāo)匹配或搭配出背板色板時,則直接選擇背景色板列表中的主要顏色的rgb顏色背景色板、次要非透明顏色的rgb顏色背景色板、第三種非透明顏色的rgb顏色背景色板三種顏色混合進行應(yīng)用圖標(biāo)匹配或搭配出背板色板;
f、得到步驟e輸出的新的rgb顏色列表后,需要創(chuàng)建一個位圖,或者修改一個已有形狀的位圖,然后遍歷該位圖的所有像素點,每一個像素點都填充為計算出的推薦色(背景色板rgb顏色列表所確定的rgb顏色背景色板),或者填充為經(jīng)過hsb顏色模式算法計算出的一套混合多種顏色的混合色塊(背景色板rgb顏色列表所確定的rgb顏色背景色板)。在得到推薦背景板顏色的時候,計算出該顏色的反色,或者多種顏色的混合色的反色,作為應(yīng)用圖標(biāo)名稱的顏色。
以上所述僅為本發(fā)明的較佳實施例而已,并不用以限制本發(fā)明,凡在本發(fā)明的精神和原則之內(nèi)所作的任何修改、等同替換和改進等,均應(yīng)包含在本發(fā)明的保護范圍之內(nèi)。