一種動態(tài)顯示顏色的實現(xiàn)方法和裝置制造方法
【專利摘要】本發(fā)明實施例公開了一種動態(tài)顯示顏色的實現(xiàn)方法和裝置，用于在以HTML/CSS搭建用戶界面的應(yīng)用或網(wǎng)頁中，避免界面背景中各種圖形的運動或顏色的變化在視覺上對主界面的影響，提升用戶體驗。本發(fā)明實施例方法包括：在以HTML/CSS搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面，為該圖形界面添加模糊半徑不小于1像素的模糊濾鏡，該模糊濾鏡會在該圖形界面上形成一層半透明的磨砂玻璃層的效果。
【專利說明】—種動態(tài)顯示顏色的實現(xiàn)方法和裝置

【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及圖像處理領(lǐng)域，尤其涉及一種動態(tài)顯示顏色的實現(xiàn)方法和裝置。

【背景技術(shù)】
[0002]隨著計算機界面顯示技術(shù)的發(fā)展，各種不同種類的背景畫面被應(yīng)用到各種顯示界面中。
[0003]由于動態(tài)背景相對于靜態(tài)背景具有更為突出的視覺呈現(xiàn)能力和更加豐富的展示內(nèi)容，使得動態(tài)背景被廣泛的應(yīng)用。
[0004]然而，在實際應(yīng)用中，采用動態(tài)背景往往會因為動態(tài)背景的畫面中各種圖形的運動或顏色的變化而分散用戶對主界面的注意力，反而形成了干擾。


【發(fā)明內(nèi)容】

[0005]本發(fā)明實施例提供了一種動態(tài)顯示顏色的實現(xiàn)方法和裝置，用于以超文本標記語言級聯(lián)樣式表033搭建用戶界面的應(yīng)用或網(wǎng)頁中，避免界面背景中各種圖形的運動或顏色的變化在視覺上對主界面的影響，提升用戶的使用體驗。
[0006]一種動態(tài)顯示顏色的實現(xiàn)方法，包括:
[0007]在以超文本標記語言級聯(lián)樣式表￠33搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0008]為所述圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于1像素。
[0009]一種裝置，包括:
[0010]生成模塊，用于在以0111/(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0011]渲染模塊，用于為所述生成模塊生成的圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于1像素。
[0012]從以上技術(shù)方案可以看出，本發(fā)明實施例具有以下優(yōu)點:在以!1111/(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面，為該圖形界面添加模糊半徑不小于1像素的模糊濾鏡，該模糊濾鏡會在該圖形界面上形成一層半透明的磨砂玻璃層的效果，從而使透過該磨砂玻璃層看到的圖形界面中所有運動的圖形或變換的顏色的輪廓變得模糊，從視覺上產(chǎn)生一種相互交融的顏色在緩慢流動的效果，整個流動過程十分自然，而這種顏色緩慢流動的效果不會分散用戶對主界面的注意力，既保持了動態(tài)背景圖形界面的絢麗效果，又避免了界面背景中各種圖形的運動或顏色的變化在視覺上對主界面的影響，提升了用戶的使用體驗。

【專利附圖】

【附圖說明】
[0013]圖1為本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法的一個流程示意圖；
[0014]圖2為本發(fā)明實施例中圖形界面與主界面一個示意圖；
[0015]圖3為本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法的另一個流程示意圖；
[0016]圖4為本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法的另一個流程示意圖；
[0017]圖5為本發(fā)明實施例中生成的圖形一個實例示意圖；
[0018]圖6為本發(fā)明實施例中裝置的一個結(jié)構(gòu)示意圖；
[0019]圖7為本發(fā)明實施例中裝置的另一個結(jié)構(gòu)示意圖；
[0020]圖8為本發(fā)明實施例中裝置的另一個結(jié)構(gòu)示意圖。

【具體實施方式】
[0021]下面將結(jié)合本發(fā)明實施例中的附圖，對本發(fā)明實施例中的技術(shù)方案進行清楚、完整地描述，顯然，所描述的實施例僅僅是本發(fā)明的一部分實施例，而不是全部的實施例。基于本發(fā)明中的實施例，本領(lǐng)域技術(shù)人員在沒有做出創(chuàng)造性勞動前提下所獲得的所有其他實施例，都屬于本發(fā)明保護的范圍。
[0022]請參閱圖1，本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法一個實施例包括:
[0023]101、在以!1111/(:33搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0024]運行著以搭建用戶界面的應(yīng)用或網(wǎng)頁的裝置在該應(yīng)用或網(wǎng)頁中生成動態(tài)的圖形界面。
[0025]該動態(tài)的圖形界面上存在圖形的運動或顏色的變換，且該動態(tài)的圖形界面在該應(yīng)用或網(wǎng)頁的主界面之下，作為該主界面的背景界面，該主界面為該應(yīng)用或網(wǎng)頁的主要界面，包括用于接收用戶輸入信息的界面或顯示信息給用戶的界面。
[0026]102、為所述圖形界面添加模糊濾鏡。
[0027]該裝置生成動態(tài)的圖形界面后，為該圖形界面添加模糊濾鏡，該模糊濾鏡的模糊半徑不小于1像素。
[0028]可以理解的是，圖形界面上添加模糊濾鏡，會產(chǎn)生磨砂玻璃效果，透過該磨砂玻璃效果觀察該圖形界面上的圖形，會發(fā)現(xiàn)該圖形界面上圖形的界限不再分明，而使得各個圖形的顏色相互交融，模糊半徑越大，該圖形與顏色相互交融的效果越強，當模糊半徑足夠大時，甚至不再能觀察到圖形的確切形狀，而只能觀察到區(qū)域性的顏色的緩慢變換與流動。
[0029]本發(fā)明實施例在以0111/(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面，為該圖形界面添加模糊半徑不小于1像素的模糊濾鏡，該模糊濾鏡會在該圖形界面上形成一層半透明的磨砂玻璃層的效果，從而使透過該磨砂玻璃層看到的圖形界面中所有運動的圖形或變換的顏色的輪廓變得模糊，從視覺上產(chǎn)生一種相互交融的顏色在緩慢流動的效果，整個流動過程十分自然，而這種顏色緩慢流動的效果不會分散用戶對主界面的注意力，既保持了動態(tài)背景圖形界面的絢麗效果，又避免了界面背景中各種圖形的運動或顏色的變化在視覺上對主界面的影響，提升了用戶的使用體驗。其中本實施例中圖形界面與主界面的關(guān)系可以如圖2所示，圖2所示為一個以!11117(^3搭建用戶界面的應(yīng)用，其中201所示部分為主界面，供用戶輸入信息，202所示部分位于主界面201之下，作為該主界面201的背景界面，顯示有動態(tài)的顏色變換。
[0030]上面實施例中，為圖形界面添加模糊半徑不小于1像素的模糊濾鏡。在實際應(yīng)用中，可以根據(jù)多個因素來確定一個最優(yōu)的模糊半徑再進行模糊濾鏡的添加，請參閱圖3，本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法另一個實施例包括:
[0031]301、在以！II祖7(:33搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0032]運行著以!1111/(:33搭建用戶界面的應(yīng)用或網(wǎng)頁的裝置在該應(yīng)用或網(wǎng)頁中生成動態(tài)的圖形界面。
[0033]該動態(tài)的圖形界面上存在圖形的運動或顏色的變換，且該動態(tài)的圖形界面在該應(yīng)用或網(wǎng)頁的主界面之下，作為該主界面的背景界面，該主界面為該應(yīng)用或網(wǎng)頁的主要界面，包括用于接收用戶輸入信息的界面或顯示信息給用戶的界面。
[0034]該裝置可以為任意能夠運行該以!搭建用戶界面的應(yīng)用或網(wǎng)頁的設(shè)備，例如計算機，服務(wù)器，智能終端等。
[0035]302、根據(jù)所述圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑；
[0036]裝置生成動態(tài)的圖形界面后，根據(jù)該圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定該模糊濾鏡的模糊半徑為第一模糊半徑。
[0037]渲染該圖形界面的設(shè)備可以為該生成動態(tài)圖形界面的裝置，也可以為單獨對圖形界面進行渲染的部件，此處不作限定。
[0038]可以理解的是，該模糊半徑的取值范圍為1到正無窮，圖形界面中圖形的復雜度越高，要產(chǎn)生較好的交融效果，則該模糊半徑就需要越大，因為模糊半徑越大，圖形的邊緣顯示越不明顯，給人的感覺為該磨砂玻璃越“厚”;而模糊半徑越大，對渲染該圖形界面的設(shè)備的性能要求越高，所以，綜合考慮圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，可以確定一個最優(yōu)的模糊半徑，即本實施例中的第一模糊半徑，使得既能實現(xiàn)較好的交融效果，觀察不到圖形的輪廓，又不占用過多的系統(tǒng)資源而導致設(shè)備不能承受。
[0039]303、按照所述第一模糊半徑為所述圖形界面添加模糊濾鏡。
[0040]裝置確定所述模糊濾鏡的模糊半徑為第一模糊半徑后，按照該第一模糊半徑為該圖形界面添加模糊濾鏡。
[0041]可以理解的是，為了支撐該模糊濾鏡的視覺效果，節(jié)省系統(tǒng)資源，在對添加了模糊濾鏡后的圖形界面進行渲染時，可以開啟硬件加速，使得設(shè)備的圖形處理器？1~006881118 1)1111:, 6^11)能發(fā)揮功能，而不單單依靠軟件渲染引擎。
[0042]可選的，按照該第一模糊半徑為該圖形界面添加模糊濾鏡后，還可以設(shè)置調(diào)整該模糊半徑的接口，使得用戶可以隨時根據(jù)實際情況對該模糊半徑進行調(diào)整，具體的顯示該接口的方式可以有很多種，例如可以顯示為滑塊，也可以顯示為百分比框，此處不作限定。
[0043]本發(fā)明實施例中，根據(jù)圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定該模糊濾鏡的模糊半徑為第一模糊半徑，使得按照該第一模糊半徑添加模糊濾鏡后的圖形界面取得展示效果與系統(tǒng)資源的平衡，在獲得足夠的展示效果的同時，避免消耗過多的系統(tǒng)資源而導致界面的卡頓，使得該顏色動態(tài)流動的效果得以流暢的呈現(xiàn)。
[0044]上面實施例中，生成動態(tài)的圖形界面，在實際應(yīng)用中，在以搭建用戶界面的應(yīng)用或網(wǎng)頁中生成動態(tài)的圖形界面的具體實現(xiàn)方式有很多種，例如可以采用原生的088和01乂，也可以由可縮放矢量圖形37(}生成，還可以采用第五代超文本標記語言的元素生成，此處不作限定。下面以采用原生的(:33和0^為例，對本發(fā)明實施例中的動態(tài)顯示顏色的實現(xiàn)方法進行具體描述，請參閱圖4，本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法另一個實施例包括:
[0045]401、在以肌祖7(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成用于展示圖形的層；
[0046]運行著以搭建用戶界面的應(yīng)用或網(wǎng)頁的裝置在該應(yīng)用或網(wǎng)頁中生成用于展示圖形的層。
[0047]可選的，該層可以為!1111文件中一個獨立的層次017元素，該層只用于視覺效果的實現(xiàn)，從而不會與其它界面元素互相干擾，該層作為主界面的背景界面，該主界面為該應(yīng)用或網(wǎng)頁的主要界面，包括用于接收用戶輸入信息的界面或顯示信息給用戶的界面。
[0048]該裝置可以為任意能夠運行該以!搭建用戶界面的應(yīng)用或網(wǎng)頁的設(shè)備，例如計算機，服務(wù)器，智能終端等。
[0049]可選的，以!1111/(:33搭建用戶界面的網(wǎng)頁可以為瀏覽器中顯示的網(wǎng)頁，而以搭建用戶界面的應(yīng)用可以為以網(wǎng)頁方式展示內(nèi)容的應(yīng)用程序。
[0050]402、在所述層上生成用于展示顏色的圖形；
[0051]裝置生成用于展示圖形的層后，在該層上生成用于展示顏色的圖形。
[0052]具體在該層上生成圖形的方式有很多種，可選的，以采用0^和(:33為例包括:先采用0^和(:33在該層上生成(:33圖形，再為該(:33圖形設(shè)置隨時間改變的顏色、大小或透明度。
[0053]生成的該圖形的數(shù)量可以為多個，圖形的形狀也可以是多種多樣的，例如圓形，矩形、三角形以及其他復雜的或簡單的，規(guī)則或不規(guī)則的幾何圖形等，或者它們的組合等，此處不作限定。
[0054]403、為所述圖形添加位移動畫并設(shè)置動畫屬性，該層與圖形組合為動態(tài)的圖形界面；
[0055]在該層生成圖形后，為該圖形添加位移動畫并設(shè)置動畫屬性，該層與圖形組合為動態(tài)的圖形界面。
[0056]圖形的位移動畫的路徑可以為直線，也可以為曲線或者任意不規(guī)則路徑，而每個圖形位移動畫的位移方向都可以單獨進行設(shè)置，任一個圖形的位移方向可以與其他圖形的位移方向相同，也可以不同，此處不作限定。
[0057]其中，(:％圖形的動畫屬性包括:位移加速度，循環(huán)次數(shù)，播放時間等，再配合(:33圖形本身設(shè)置的隨時間改變的顏色、大小或透明度，這樣多種多樣的組合方式組合出的圖形的動態(tài)效果也可以多種多樣。
[0058]該(:33圖形的位移動畫除了使用(:33來實現(xiàn)，也可以利用腳本來實現(xiàn)，此處不作限定。
[0059]404、根據(jù)所述圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑；
[0060]裝置生成動態(tài)的圖形界面后，根據(jù)該圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定該模糊濾鏡的模糊半徑為第一模糊半徑。
[0061]渲染該圖形界面的設(shè)備可以為該生成動態(tài)圖形界面的裝置，也可以為單獨對圖形界面進行渲染的部件，此處不作限定。
[0062]可以理解的是，該模糊半徑的取值范圍為1到正無窮，圖形界面中圖形的復雜度越高，要產(chǎn)生較好的交融效果，則該模糊半徑就需要越大，因為模糊半徑越大，圖形的邊緣顯示越不明顯，給人的感覺為該磨砂玻璃越“厚”;而模糊半徑越大，對渲染該圖形界面的設(shè)備的性能要求越高，所以，綜合考慮圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，可以確定一個最優(yōu)的模糊半徑，即本實施例中的第一模糊半徑，使得既能實現(xiàn)較好的交融效果，觀察不到圖形的輪廓，又不占用過多的系統(tǒng)資源而導致設(shè)備不能承受。
[0063]405、按照所述第一模糊半徑為所述圖形界面添加模糊濾鏡。
[0064]裝置確定所述模糊濾鏡的模糊半徑為第一模糊半徑后，按照該第一模糊半徑為該圖形界面添加模糊濾鏡。
[0065]可以理解的是，為了支撐該模糊濾鏡的視覺效果，節(jié)省系統(tǒng)資源，在對添加了模糊濾鏡后的圖形界面進行渲染時，可以開啟硬件加速，使得設(shè)備的圖形處理器？1~006881118 1)1111:, 6^11)能發(fā)揮功能，而不單單依靠軟件渲染引擎。
[0066]可選的，按照該第一模糊半徑為該圖形界面添加模糊濾鏡后，還可以設(shè)置調(diào)整該模糊半徑的接口，使得用戶可以隨時根據(jù)實際情況對該模糊半徑進行調(diào)整，具體的顯示該接口的方式可以有很多種，例如可以顯示為滑塊，也可以顯示為百分比框，此處不作限定。
[0067]本發(fā)明實施例中，通過為層上的圖形添加位移動畫，可以使得視覺效果始終保存動態(tài)，讓用戶感覺圖形界面中的顏色一直在流動。
[0068]為便于理解，下面以一具體應(yīng)用場景對本發(fā)明實施例中動態(tài)顯示顏色的實現(xiàn)方法進行具體描述:
[0069]在一個以搭建用戶界面的應(yīng)用中，利用文件中一個獨立的01乂元素生成用于展示圖形的0^層，該層作為應(yīng)用主界面的背景圖形界面，位于主界面之下，只用于視覺效果的實現(xiàn)，不與其他界面元素相互干擾；
[0070]如圖5所示，在該017層上采用0^和(:33生成多個033圖形，并為該0^層統(tǒng)一添加(:33的圓角屬性，生成圓形圖形，并為各圓形(:33圖形設(shè)置不同的隨時間改變的顏色、大小或透明度，例如，設(shè)定其中一個為在2秒內(nèi)從紅色變化為黃色，從半徑20像素變化為50像素，設(shè)定另一個為在5秒內(nèi)從綠色變化為藍色，從半徑30像素變化為5像素等；
[0071]在該017層上生成各033圖形后，為各033圖形添加位移動畫，每一個圖形的位移動畫可以不同，例如圖5的3個圖形中每個圖形的位移方向都不相同，并設(shè)置為各圖形設(shè)置動畫屬性，例如可以設(shè)置為循環(huán)播放，則各圖形循環(huán)的按照位移動畫進行播放，如此便由該01乂層與各運動的(:33圖形構(gòu)成了動態(tài)的圖形界面；
[0072]根據(jù)該圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定當模糊半徑為100像素時，滿足各圖形的邊緣顯示不明顯且各圖形中顏色的交融效果好，并且對系統(tǒng)資源的消耗不會對設(shè)備運行造成影響的條件，則確定模糊半徑100像素為第一模糊半徑；
[0073]使用161^11:內(nèi)核特有的濾鏡為該圖形界面添加模糊半徑為100像素的模糊濾鏡，同時通過將0，0)語句加入到0^層中開啟硬件加速，利用設(shè)備的對該圖形界面進行渲染；
[0074]設(shè)置調(diào)整該模糊半徑的接口為滑塊形式，滑塊的起點為模糊半徑1像素，滑塊的終端為模糊半徑500像素，通過拖動滑塊可以實時改變模糊濾鏡的模糊半徑，可以理解的是，該滑塊起點與終點的模糊半徑可以根據(jù)實際情況設(shè)定，此處僅為一個示例。
[0075]下面對本發(fā)明實施例中的裝置進行描述，請參閱圖6，本發(fā)明實施例中裝置一個實施例包括:
[0076]生成模塊601，用于在以0111/(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0077]渲染模塊602，用于為所述生成模塊601生成的圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于1像素。
[0078]本發(fā)明實施例中在以搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成模塊601生成動態(tài)的圖形界面，渲染模塊602為該圖形界面添加模糊半徑不小于1像素的模糊濾鏡，該模糊濾鏡會在該圖形界面上形成一層半透明的磨砂玻璃層的效果，從而使透過該磨砂玻璃層看到的圖形界面中所有運動的圖形或變換的顏色的輪廓變得模糊，從視覺上產(chǎn)生一種相互交融的顏色在緩慢流動的效果，并且整個流動過程十分自然，而這種顏色緩慢流動的效果不會分散用戶對主界面的注意力，既保持了圖形界面的絢麗效果，給人以賞心悅目的感覺，又避免了界面背景中各種圖形的運動或顏色的變化在視覺上對主界面的影響，提升了用戶體驗。
[0079]上面實施例中，渲染模塊602為圖形界面添加模糊半徑不小于1像素的模糊濾鏡，在實際應(yīng)用中，渲染模塊602可以根據(jù)多個因素來確定一個最優(yōu)的模糊半徑再進行模糊濾鏡的添加，請參閱圖7，本發(fā)明實施例中裝置另一個實施例包括:
[0080]生成模塊701，用于在以搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0081]渲染模塊702，用于為所述生成模塊701生成的圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于1像素；
[0082]本實施例中，該渲染模塊702具體包括:
[0083]確定單元7021，用于根據(jù)所述生成模塊701生成的圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑；
[0084]添加單元7022，用于按照所述確定單元7021確定的第一模糊半徑為所述圖形界面添加模糊濾鏡；
[0085]可選的，該裝置還可以包括:
[0086]設(shè)置模塊703，用于設(shè)置調(diào)整所述模糊半徑的接口。
[0087]本發(fā)明實施例中，確定單元7021根據(jù)圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定該模糊濾鏡的模糊半徑為第一模糊半徑，使得添加單元7022按照該第一模糊半徑添加模糊濾鏡后的圖形界面取得展示效果與系統(tǒng)資源的平衡，在獲得足夠的展示效果的同時，避免消耗過多的系統(tǒng)資源而導致界面卡頓，使得該顏色動態(tài)流動的效果得以流暢的呈現(xiàn)。
[0088]上面實施例中，生成模塊701生成動態(tài)的圖形界面，在實際應(yīng)用中，生成模塊701在以11111/(:33搭建用戶界面的應(yīng)用或網(wǎng)頁中生成動態(tài)的圖形界面的具體實現(xiàn)方式有很多種，例如可以采用原生的033和01乂，也可以由可縮放矢量圖形37(}生成，還可以采用第五代超文本標記語言肌祖^5的元素生成，此處不作限定。下面以生成模塊701采用原生的(:％和0^為例對本發(fā)明實施例中的裝置進行具體描述，請參閱圖8，本發(fā)明實施例中裝置另一個實施例包括:
[0089]生成模塊801，用于在以肌祖7(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；
[0090]渲染模塊802，用于為所述生成模塊801生成的圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于1像素；
[0091〕 該渲染模塊802具體包括:
[0092]確定單元8021，用于根據(jù)所述生成模塊801生成的圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑；
[0093]添加單元8022，用于按照所述確定單元8021確定的第一模糊半徑為所述圖形界面添加模糊濾鏡；
[0094]可選的，該裝置還可以包括:
[0095]設(shè)置模塊803，用于設(shè)置調(diào)整所述模糊半徑的接口 ；
[0096]本實施例中，該生成模塊801具體包括:
[0097]層生成單元8011，用于在以肌祖7(^3搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成用于展示圖形的層；
[0098]圖形生成單元8012，用于在所述層生成單元8011生成的層上生成用于展示顏色的圖形；
[0099]動畫設(shè)置單元8013，用于為所述圖形生成單元8012生成的圖形添加位移動畫并設(shè)置動畫屬性；
[0100]可選的，所述層生成單元8011生成的層為！1111^文件中一個獨立的層次017元素；
[0101]所述圖形生成單元8012具體包括:
[0102]圖形生成子單元80121，用于采用0^和(:33在所述層上生成(:33圖形；
[0103]設(shè)置子單元80122，用于為所述圖形生成子單元80121生成的(:33圖形設(shè)置隨時間改變的顏色、大小或透明度。
[0104]本發(fā)明實施例中，通過動畫設(shè)置單元8013為層上的圖形添加位移動畫，可以使得視覺效果始終保存動態(tài)，讓用戶感覺圖形界面中的顏色一直在流動。
[0105]為了便于理解上述實施例，下面以上述裝置各個單元在一個具體應(yīng)用場景中的交互過程進行說明:
[0106]在一個以搭建用戶界面的應(yīng)用中，層生成單元8011利用文件中一個獨立的017元素生成用于展示圖形的017層，該層作為應(yīng)用主界面的背景圖形界面，位于主界面之下，只用于視覺效果的實現(xiàn)，不與其他界面元素相互干擾；
[0107]如圖5所示，圖形生成子單元80121在該01乂層上采用01乂和(:33生成多個033圖形，并為該0^層統(tǒng)一添加(:33的圓角屬性，生成圓形圖形，設(shè)置子單元80122為各圓形088圖形設(shè)置不同的隨時間改變的顏色、大小或透明度，例如，設(shè)定其中一個圖形的顏色變化為在2秒內(nèi)從紅色變化為黃色，大小變化為從半徑20像素變化為50像素，設(shè)定另一個圖形的顏色變化為在5秒內(nèi)從綠色變化為藍色，大小變化為從半徑30像素變化為5像素等；
[0108]圖形生成單元8012在該0^層上生成各(:33圖形后，動畫設(shè)置單元8013為各033圖形添加位移動畫，每一個圖形的位移動畫可以不同，例如圖5的3個圖形中每個圖形的位移方向都不相同，并為各圖形設(shè)置動畫屬性，例如可以設(shè)置為循環(huán)播放，則各圖形循環(huán)的按照位移動畫進行播放，如此便由該0^層與各運動的(:33圖形構(gòu)成了動態(tài)的圖形界面；
[0109]確定單元8021根據(jù)該圖形界面中圖形的復雜度以及渲染該圖形界面的設(shè)備的性能，確定當模糊半徑為100像素時，滿足各圖形的邊緣顯示不明顯且各圖形中顏色的交融效果好，并且對系統(tǒng)資源的消耗不會對設(shè)備運行造成影響的條件，則確定模糊半徑100像素為第一模糊半徑；
[0110]添加單元8022 使用 161^11:內(nèi)核特有的濾鏡為該圖形界面添加模糊半徑為100像素的模糊濾鏡，同時通過將-冊1^11:-1:1^118？0；011:63(1(0,0,0)語句加入到0^層中開啟硬件加速，利用設(shè)備的對該圖形界面進行渲染；
[0111]設(shè)置模塊803設(shè)置調(diào)整該模糊半徑的接口為滑塊形式，滑塊的起點為模糊半徑1像素，滑塊的終點為模糊半徑500像素，通過拖動滑塊可以實時改變模糊濾鏡的模糊半徑，可以理解的是，該滑塊起點與終點的模糊半徑可以根據(jù)實際情況設(shè)定，此處僅為一個示例。
[0112]所屬領(lǐng)域的技術(shù)人員可以清楚地了解到，為描述的方便和簡潔，上述描述的系統(tǒng)，裝置和單元的具體工作過程，可以參考前述方法實施例中的對應(yīng)過程，在此不再贅述。
[0113]在本申請所提供的幾個實施例中，應(yīng)該理解到，所揭露的系統(tǒng)，裝置和方法，可以通過其它的方式實現(xiàn)。例如，以上所描述的裝置實施例僅僅是示意性的，例如，所述單元的劃分，僅僅為一種邏輯功能劃分，實際實現(xiàn)時可以有另外的劃分方式，例如多個單元或組件可以結(jié)合或者可以集成到另一個系統(tǒng)，或一些特征可以忽略，或不執(zhí)行。
[0114]所述作為分離部件說明的單元可以是或者也可以不是物理上分開的，作為單元顯示的部件可以是或者也可以不是物理單元，即可以位于一個地方，或者也可以分布到多個網(wǎng)絡(luò)單元上。可以根據(jù)實際的需要選擇其中的部分或者全部單元來實現(xiàn)本實施例方案的目的。
[0115]另外，在本發(fā)明各個實施例中的各功能單元可以集成在一個處理單元中，也可以是各個單元單獨物理存在，也可以兩個或兩個以上單元集成在一個單元中。上述集成的單元既可以采用硬件的形式實現(xiàn)，也可以采用軟件功能單元的形式實現(xiàn)。
[0116]所述集成的單元如果以軟件功能單元的形式實現(xiàn)并作為獨立的產(chǎn)品銷售或使用時，可以存儲在一個計算機可讀取存儲介質(zhì)中。基于這樣的理解，本發(fā)明的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻的部分或者該技術(shù)方案的全部或部分可以以軟件產(chǎn)品的形式體現(xiàn)出來，該計算機軟件產(chǎn)品存儲在一個存儲介質(zhì)中，包括若干指令用以使得一臺計算機設(shè)備(可以是個人計算機，服務(wù)器，或者智能終端等)執(zhí)行本發(fā)明各個實施例所述方法的全部或部分步驟。而前述的存儲介質(zhì)包括山盤、移動硬盤、只讀存儲器
、隨機存取存儲器^00688、磁碟或者光盤等各種可以存儲程序代碼的介質(zhì)。
[0117]以上所述，以上實施例僅用以說明本發(fā)明的技術(shù)方案，而非對其限制；盡管參照前述實施例對本發(fā)明進行了詳細的說明，本領(lǐng)域的普通技術(shù)人員應(yīng)當理解:其依然可以對前述各實施例所記載的技術(shù)方案進行修改，或者對其中部分技術(shù)特征進行等同替換；而這些修改或者替換，并不使相應(yīng)技術(shù)方案的本質(zhì)脫離本發(fā)明各實施例技術(shù)方案的精神和范圍。
【權(quán)利要求】
1.一種動態(tài)顯示顏色的實現(xiàn)方法，其特征在于，包括: 在以超文本標記語言HTML/級聯(lián)樣式表CSS搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面； 為所述圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于I像素。
2.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述為所述圖形界面添加模糊濾鏡具體包括: 根據(jù)所述圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑； 按照所述第一模糊半徑為所述圖形界面添加模糊濾鏡。
3.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述方法還包括: 設(shè)置調(diào)整所述模糊半徑的接口。
4.根據(jù)權(quán)利要求1至3中任一項所述的方法，其特征在于，所述生成動態(tài)的圖形界面具體包括: 生成用于展示圖形的層； 在所述層上生成用于展示顏色的圖形； 為所述圖形添加位移動畫并設(shè)置動畫屬性，所述層與所述圖形組合為所述動態(tài)的圖形界面。
5.根據(jù)權(quán)利要求4所述的方法，其特征在于，所述圖形的數(shù)量為多個，所述層為HTML文件中一個獨立的層次DIV元素； 在所述層上生成用于展示顏色的圖形具體包括: 采用DIV和CSS在所述層上生成圖形，或采用SVG在所述層上生成圖形，或采用HTML5Canvas在所述層上生成圖形； 為所述圖形設(shè)置隨時間改變的顏色、大小或透明度。
6.一種裝置，其特征在于，包括: 生成模塊，用于在以HTML/CSS搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成動態(tài)的圖形界面；渲染模塊，用于為所述生成模塊生成的圖形界面添加模糊濾鏡，所述模糊濾鏡的模糊半徑不小于I像素。
7.根據(jù)權(quán)利要求6所述的裝置，其特征在于，所述渲染模塊具體包括: 確定單元，用于根據(jù)所述生成模塊生成的圖形界面中圖形的復雜度以及渲染所述圖形界面的設(shè)備的性能，確定所述模糊濾鏡的模糊半徑為第一模糊半徑； 添加單元，用于按照所述確定單元確定的第一模糊半徑為所述圖形界面添加模糊濾鏡。
8.根據(jù)權(quán)利要求7所述的裝置，其特征在于，所述裝置還包括: 設(shè)置模塊，用于設(shè)置調(diào)整所述模糊半徑的接口。
9.根據(jù)權(quán)利要求6至8中任一項所述的裝置，其特征在于，所述生成模塊具體包括: 層生成單元，用于在以HTML/CSS搭建用戶界面的應(yīng)用或網(wǎng)頁中，生成用于展示圖形的層； 圖形生成單元，用于在所述層生成單元生成的層上生成用于展示顏色的圖形； 動畫設(shè)置單元，用于為所述圖形生成單元生成的圖形添加位移動畫并設(shè)置動畫屬性，所述層與所述圖形組合為所述動態(tài)的圖形界面。
10.根據(jù)權(quán)利要求9所述的裝置，其特征在于， 所述層生成單元生成的層為HTML文件中一個獨立的層次DIV元素； 所述圖形生成單元具體包括: 圖形生成子單元，用于采用DIV和CSS在所述層上生成圖形，或采用SVG在所述層上生成圖形，或采用HTML 5Canvas在所述層上生成圖形； 設(shè)置子單元，用于為所述圖形生成子單元生成的圖形設(shè)置隨時間改變的顏色、大小或透明度。
【文檔編號】G06T13/00GK104361011SQ201410539340
【公開日】2015年2月18日 申請日期:2014年10月13日 優(yōu)先權(quán)日:2014年10月13日
【發(fā)明者】蔣釗 申請人:廣東威創(chuàng)視訊科技股份有限公司