本申請涉及用戶界面顯示技術(shù)領(lǐng)域,特別涉及一種界面背景顯示方法。
背景技術(shù):
互聯(lián)網(wǎng)產(chǎn)品的用戶界面中,為了突出信息的顯示,往往將信息與其背景加以區(qū)分。并且,為了獲得好的顯示效果,可以對界面的背景進行設(shè)置。
現(xiàn)有技術(shù)中,通常在界面中設(shè)置背景圖片。即,當獲取到展示目標界面的請求時,可以獲取目標界面中的信息和預先設(shè)置的背景圖片,然后在目標界面中展示所述信息和所述背景圖片。
在實現(xiàn)本申請過程中,發(fā)明人發(fā)現(xiàn)現(xiàn)有技術(shù)中至少存在如下問題:
一些情況下,界面中的信息可能通過多張信息圖片進行展示。在上述現(xiàn)有技術(shù)中,界面中的各個信息圖片通常對應相同的背景圖片。當焦點(foucs)從一張信息圖片移動到另一張信息圖片之上時,界面的背景圖片往往不會發(fā)生變化。這樣,焦點選中的信息圖片的顏色可能與背景圖片的顏色不協(xié)調(diào)、不融合,從而影響整個界面的顯示效果,造成用戶的視覺體驗不高。
技術(shù)實現(xiàn)要素:
本申請實施例的目的是提供一種界面背景顯示方法,以使界面背景的顏色與焦點選中的信息圖片的顏色相協(xié)調(diào),提升用戶的視覺體驗。
為解決上述技術(shù)問題,本申請實施例提供一種界面背景顯示方法是這樣實現(xiàn)的:
一種界面背景顯示方法,包括:
響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片;
根據(jù)所述第一圖片,生成與所述第一圖片對應的第二圖片;
在所述界面的背景中顯示所述第二圖片。
由以上本申請實施例提供的技術(shù)方案可見,本申請實施例在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的圖片,然后根據(jù)焦點選中的圖片,生成用于在界面的背景中進行顯示的圖片。或者,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的圖片,然后可以獲取所述界面的尺寸以及所述第一圖片的至少一個特征值,然后根據(jù)所述界 面的尺寸和第一預設(shè)阿爾法通道值,基于第三預設(shè)規(guī)則計算用于填充界面背景的像素點的第一阿爾法通道值,以及基于所述第一圖片的至少一個特征值,獲取用于填充界面背景的像素點的屬性值。這樣,界面的背景與焦點選中的圖片是相對應的。當焦點選中的圖片發(fā)生變化后,界面的背景也會相應地發(fā)生變化。因此,與現(xiàn)有技術(shù)相比,本申請實施例的界面背景顯示方法可以使界面背景的顏色與焦點選中圖片的顏色相協(xié)調(diào)和融合,從而提升了用戶的視覺體驗。
附圖說明
為了更清楚地說明本申請實施例或現(xiàn)有技術(shù)中的技術(shù)方案,下面將對實施例或現(xiàn)有技術(shù)描述中所需要使用的附圖作簡單地介紹,顯而易見地,下面描述中的附圖僅僅是本申請中記載的一些實施例,對于本領(lǐng)域普通技術(shù)人員來講,在不付出創(chuàng)造性勞動性的前提下,還可以根據(jù)這些附圖獲得其他的附圖。
圖1為本申請實施例一種界面背景顯示方法的流程圖;
圖2為本申請實施例另一種界面背景顯示方法的流程圖;
圖3為本申請實施例一種界面的示意圖;
圖4為本申請對第一圖片進行模糊處理的流程圖;
圖5為本申請實施例另一種界面背景顯示方法的流程圖;
圖6為本申請實施例另一種界面背景顯示方法的流程圖;
圖7為本申請實施例另一種界面背景顯示方法的流程圖;
圖8為本申請實施例另一種界面背景顯示方法的流程圖;
圖9為本申請實施例另一種界面背景顯示方法的流程圖。
具體實施方式
為了使本技術(shù)領(lǐng)域的人員更好地理解本申請中的技術(shù)方案,下面將結(jié)合本申請實施例中的附圖,對本申請實施例中的技術(shù)方案進行清楚、完整地描述,顯然,所描述的實施例僅僅是本申請一部分實施例,而不是全部的實施例?;诒旧暾堉械膶嵤├?,本領(lǐng)域普通技術(shù)人員在沒有作出創(chuàng)造性勞動前提下所獲得的所有其他實施例,都應當屬于本申請保護的范圍。
包含信息圖片的界面一般應用于智能電視軟件領(lǐng)域。智能電視軟件因受限于遙控器操作,且需滿足用戶遠距離觀看的場景需求,在界面設(shè)計時需要有明確的焦點狀態(tài)的表達,用于引導用戶感知當前所瀏覽的位置,以保證用戶不會在瀏覽路徑中迷路。上述的現(xiàn)有技術(shù)中,界面背景一般不會隨著焦點選中的信息圖片的不同而變化。這樣,有可能使焦點選中的信息 圖片與界面背景不協(xié)調(diào)、不融合,從而影響整個界面的顯示效果,造成用戶的視覺體驗不高。
為解決上述問題,本申請實施例提供一種界面背景顯示方法。下面介紹本申請界面背景顯示方法的一個實施例。如圖1所示,該實施例可以包括如下的步驟:
s101:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片;
s102:根據(jù)所述第一圖片,生成與所述第一圖片對應的第二圖片;
s103:在所述界面的背景中顯示所述第二圖片。
圖1所對應的實施例,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的圖片,然后根據(jù)焦點選中的圖片,生成用于在界面的背景中進行顯示的圖片。這樣,界面的背景與焦點選中的圖片是相對應的。當焦點選中的圖片發(fā)生變化后,界面的背景也會相應地發(fā)生變化。因此,與現(xiàn)有技術(shù)相比,圖1所對應的實施例可以使界面背景的顏色與焦點選中圖片的顏色相協(xié)調(diào)和融合,從而提升了用戶的視覺體驗。
在實際中,圖1所對應的實施例可以有很多種實現(xiàn)方式,以下以幾個具體的例子詳細說明圖1所對應實施例的具體實現(xiàn)。
圖2為圖1所對應實施例的一個實現(xiàn)方式,具體可以包括如下的步驟:
s201:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
界面一般用于向用戶展示信息或數(shù)據(jù)。為了將展示的信息或數(shù)據(jù)進行突出顯示,通??梢詫⒔缑娴谋尘昂颓熬凹右詤^(qū)分。其中,界面前景一般可以包括一個或多個展示信息或數(shù)據(jù)的區(qū)域。界面背景一般用于對界面的前景進行襯托。為了獲得好的信息或數(shù)據(jù)的顯示效果,通常可以對界面背景進行設(shè)置。例如,可以對界面背景的顏色、透明度進行設(shè)置。
界面前景可以包括一個或多個圖片。所述一個或多個圖片可以用于向用戶展示信息或數(shù)據(jù)。所述第一圖片可以為所述一個或多個圖片中的一個。例如,對于圖3所示的界面,界面前景可以包括a、b、c、d、e和f共6張圖片。
界面中焦點移動的觸發(fā)指令,可以是在檢測到界面中的焦點移動時產(chǎn)生的。用戶可以使用操作設(shè)備使焦點在界面前景中的各個圖片之間移動。當遇到感興趣的圖片時,用戶可以使用焦點選中該圖片。通??梢詫⒂脩暨x中的圖片作為第一圖片。所述操作設(shè)備可以包括遙控器、鼠標和游戲手柄等。圖3中,焦點選中的圖片為b。因此,可以將圖片b作為第一圖片。
在一個實施方式中,當焦點在界面前景中選中圖片所對應的區(qū)域時,該圖片已經(jīng)顯示在界面前景中。那么,焦點可以直接選中該圖片,進而可以將焦點選中的圖片作為第一圖片。
在另一個實施方式中,受限于處理器的運行速度,當焦點在界面前景中選中圖片所對應的區(qū)域時,該圖片可能還沒有顯示在界面前景中,或者還沒有完全顯示在界面前景中。那么,可以獲取焦點選中的區(qū)域,將焦點選中的區(qū)域?qū)膱D片作為第一圖片。具體地,可以獲取 焦點選中的區(qū)域?qū)牡刂?,并根?jù)該地址獲取圖片,然后將根據(jù)該地址獲取的圖片作為第一圖片。
s202:對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第二圖片。
模糊處理的過程可以是利用低通濾波器,將圖片中的高頻信號進行濾除的過程。圖片中的高頻信號一般與圖片中的突變、邊緣和噪聲等灰度變化比較劇烈的地方相對應。因此,通過對圖片進行模糊處理,可以減少圖片中的細節(jié)信息,使圖片的細節(jié)如邊界輪廓、線條等變得模糊,從而可以使圖片變得更加平滑。
具體地,可以使用如圖4所示的步驟對所述第一圖片進行模糊處理。
s2021:對于第一圖片內(nèi)的每個像素點,獲取該像素點對應的預設(shè)大小的區(qū)域。
第一圖片內(nèi)的像素點,可以具有對應的預設(shè)大小的區(qū)域。每個像素點對應的預設(shè)大小的區(qū)域一般位于第一圖片內(nèi),其內(nèi)部可以進一步包括多個像素點。例如,第一圖片內(nèi)像素點對應的預設(shè)大小的區(qū)域,可以為以該像素點為中心,與該像素點相鄰的上、下、左、右、左上、右上、左下和右下像素點組成的矩形區(qū)域。
s2022:然后根據(jù)該像素點對應的預設(shè)大小的區(qū)域內(nèi)的各個像素點,獲取該像素點的特征值。
在一個實施方式中,可以根據(jù)該像素點對應的預設(shè)大小的區(qū)域內(nèi)各個像素點的屬性值,計算所述各個像素點屬性值的平均值,然后將該平均值作為該像素點的特征值。
像素點的屬性值一般用于表示像素點的色彩。像素點的屬性值可以包括多個通道的值,具體的通道數(shù)量和種類一般與色彩空間相對應。所述色彩空間可以包括rgb空間、rgba空間、cmyk空間、hsl空間、hsla空間、hsb空間和hsba空間等。例如,對于rgb色彩空間,像素點的屬性值可以包括r(red,紅色)通道的值、g(green,綠色)通道的值和b(blue,藍色)通道的值。又如,對于rgba色彩空間,像素點的屬性值可以包括r(red,紅色)通道的值、g(green,綠色)通道的值、b(blue,藍色)通道的值和a(alpha,阿爾法)通道的值。又如,對于hsl色彩空間,像素點的屬性值可以包括h(hue,色相)通道的值、s(saturation,飽和度)通道的值和l(lightness,亮度)通道的值。又如,對于hsla色彩空間,像素點的屬性值可以包括h(hue,色相)通道的值、s(saturation,飽和度)通道的值、l(lightness,亮度)通道的值和a(alpha,阿爾法)通道的值。
像素點的特征值一般也可以用于表示像素點的色彩,具體可以包括多個通道的值。在同一個色彩空間下,像素點特征值的通道數(shù)量和種類可以與像素點的屬性值相同。
進一步地,像素點的屬性值可以包括多個通道的值。那么,可以獲取該像素點對應的預設(shè)大小的區(qū)域內(nèi)各個像素點的屬性值,并計算所述各個像素點的屬性值中每個通道值的平均 值,然后將該通道值的平均值作為該像素點特征值中相應通道的值。例如,對于rgb色彩空間,像素點的屬性值可以包括r通道的值、g通道的值和b通道的值。那么,可以計算該像素點預設(shè)大小的區(qū)域內(nèi)各個像素點屬性值中r通道值的平均值,然后將該r通道值的平均值作為該像素點特征值中r通道的值;可以計算該像素點預設(shè)大小的區(qū)域內(nèi)各個像素點屬性值中g(shù)通道值的平均值,然后將該g通道值的平均值作為該像素點特征值中g(shù)通道的值;可以計算預設(shè)大小的區(qū)域內(nèi)各個像素點屬性值中b通道值的平均值,然后將該b通道值的平均值作為該像素點特征值中b通道的值。
在另一個實施方式中,第一圖片內(nèi)像素點對應的預設(shè)大小的區(qū)域內(nèi)的各個像素點可以具有預設(shè)的權(quán)重值。預設(shè)大小的區(qū)域內(nèi)的各個像素點的預設(shè)權(quán)重值可以相同,也可以不同。那么,可以獲取該像素點對應的預設(shè)大小的區(qū)域內(nèi)各個像素點的屬性值和預設(shè)權(quán)重值,然后根據(jù)所述各個像素點的屬性值和預設(shè)權(quán)重值,計算所述各個像素點屬性值的權(quán)重平均值,并將該權(quán)重平均值作為該像素點的特征值。
所述像素點屬性值的權(quán)重平均值可以是根據(jù)像素點的屬性值以及像素點的預設(shè)權(quán)重值,計算得到的一個值。
進一步地,像素點的屬性值可以包括多個通道的值。那么,可以獲取該像素點對應的預設(shè)大小的區(qū)域內(nèi)各個像素點的屬性值和預設(shè)權(quán)重值,然后根據(jù)所述各個像素點的屬性值和預設(shè)權(quán)重值,計算所述各個像素點屬性值中每個通道值的權(quán)重平均值,然后將該通道值的權(quán)重平均值作為該像素點特征值中相應通道的值。
在一個具體應用場景中,對于第一圖片內(nèi)的每個像素點,可以利用二維正態(tài)分布函數(shù)
q(x,y)=0.06*r(x-1,y-1)+0.13*r(x,y-1)+0.06*r(x+1,y-1)+
0.13*r(x-1,y)+0.24*r(x,y)+0.06*r(x+1,y)+
0.06*r(x-1,y+1)+0.13*r(x,y+1)+0.06*r(x+1,y+1)
其中,
(x-1,y-1)、(x,y-1)、(x+1,y-1)、(x-1,y)、(x,y)、(x+1,y)、(x-1,y+1)、(x,y+1)和(x+1,y+1)為像素點(x,y)預設(shè)大小的區(qū)域內(nèi)的各個像素點;
r(x-1,y-1)為像素點(x-1,y-1)的屬性值,r(x,y-1)為像素點(x,y-1)的屬性值,…,r(x,y+1)為像素點(x,y+1)的屬性值,r(x+1,y+1)為像素點(x+1,y+1)的屬性值;
0.06、0.13和0.24分別為預設(shè)大小的區(qū)域內(nèi)各個像素點的預設(shè)權(quán)重值,具體可以通過所述3*3模板得到。
s2023:最后使用該像素點的特征值替換該像素點的屬性值。
這樣,經(jīng)過步驟s2021、步驟s2022和步驟s2023,對于第一圖片內(nèi)的每個像素點,可以獲取該像素點對應的預設(shè)大小的區(qū)域,然后可以根據(jù)該像素點對應的預設(shè)大小的區(qū)域內(nèi)的各個像素點,獲取該像素點的特征值,并使用該像素點的特征值替換該像素點的屬性值,從而實現(xiàn)對第一圖片的模糊處理。
在一個實施方式中,可以直接將模糊處理后的第一圖片作為第二圖片。
在另一個實施方式中,在步驟s202之前,所述方法還可以包括:獲取所述界面尺寸的比例。那么,在步驟s202中,可以根據(jù)該比例對第一圖片進行裁剪,以使裁剪后的第一圖片的尺寸比例與所述界面的尺寸比例相同,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第二圖片。
對裁剪后的第一圖片進行模糊處理的過程可以與圖4所對應的過程相類似。
所述界面尺寸可以包括以像素為單位的尺寸和以長度單位為單位的尺寸。所述長度的單位可以包括毫米(mm)和厘米(cm)等。例如,當所述界面的形狀為矩形時,所述界面尺寸可以包括界面長邊長度和短邊長度。
進一步地,當所述界面和所述第一圖片的形狀均為矩形時,可以獲取所述界面長邊長度和短邊長度的比例,然后可以以第一圖片的長邊長度或短邊長度為基準,依據(jù)該比例對所述第一圖片進行裁剪。這樣,與直接對第一圖片進行模糊處理相比,對裁剪后的第一圖片進行模糊處理,可以減少模糊處理的區(qū)域,從而可以減少圖片模糊處理所需的時間。
s203:在所述界面的背景中顯示所述第二圖片。
具體地,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉 伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
所述拉伸可以包括等比例拉伸。例如,當所述界面和所述第二圖片的形狀均為矩形時,所述對第二圖片進行拉伸,可以是在第二圖片長邊長度和短邊長度的比例保持不變的情況下,對第二圖片進行拉伸。
在所述界面的背景中顯示拉伸后的第二圖片,具體可以包括:在所述界面的背景中移動拉伸后的第二圖片,直至拉伸后的第二圖片的邊界與所述界面的邊界重合為止。其中,拉伸后的第二圖片的邊界與所述界面的邊界重合,可以包括拉伸后的第二圖片的左邊緣、右邊緣、上邊緣和下邊緣分別與界面的左邊緣、右邊緣、上邊緣和下邊緣重合。
進一步地,在所述界面的背景中移動拉伸后的第二圖片,可以包括:在所述界面的背景中沿水平向右的方向、水平向左的方向、豎直向上的方向、豎直向下的方向、界面的左上角至右下角的方向、界面的右下角至左上角的方向、界面的右上角至左下角的方向或界面的左下角至右上角的方向移動拉伸后的第二圖片。
在一個實施方式中,在步驟s202中,可以直接將模糊處理后的第一圖片作為第二圖片。那么,在步驟s203中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸獲取所述界面尺寸的比例,并可以根據(jù)該比例對第二圖片進行裁剪,最后可以根據(jù)所述界面的尺寸,對裁剪后的第二圖片進行拉伸。
在另一個實施方式中,在步驟s202中,可以根據(jù)所述界面尺寸的比例對第一圖片進行裁剪,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第二圖片。那么,在步驟s203中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,直接對第二圖片進行拉伸。
在一個實施方式中,焦點在界面前景中各個圖片之間移動的速度較快。因此,當根據(jù)第一圖片生成第二圖片后,焦點選中的第一圖片可能已經(jīng)發(fā)生變化。因此,在步驟s203中,可以獲取當前焦點選中的區(qū)域,然后將當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域進行比對。當當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域相同時,可以在界面的背景中顯示第二圖片。進一步地,當當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域不相同時,可以不在界面的背景中顯示第二圖片。其中,所述將當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域進行比對,可以是將當前焦點選中的區(qū)域的邊界與第一圖片所對應區(qū)域的邊界進行比對。
需要說明的是,本實現(xiàn)方式中,在執(zhí)行步驟s203的過程中,或者在執(zhí)行步驟s203之后,可以繼續(xù)執(zhí)行步驟s201和步驟s202。即,在界面背景顯示第二圖片的過程中,或者在界面背景顯示第二圖片之后,可以繼續(xù)獲取焦點選中的第一圖片,然后根據(jù)所述第一圖片,生成與所述第一圖片對應的第二圖片。
圖2所對應的實現(xiàn)方式,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的圖片,然后對焦點選中的圖片進行模糊處理,最后在界面的背景中顯示模糊處理后的圖片。這樣,界面的背景與焦點選中的圖片是相對應的。當焦點選中的圖片發(fā)生變化后,界面的背景也會相應地發(fā)生變化。因此,與現(xiàn)有技術(shù)相比,圖2所對應的實現(xiàn)方式可以使界面背景的顏色與焦點選中圖片的顏色相協(xié)調(diào)和融合,從而使用戶產(chǎn)生整體、融合和干凈的視覺體驗。
圖5為圖1所對應實施例的另一個實現(xiàn)方式,具體可以包括如下的步驟:
s501:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
步驟s501的內(nèi)容與步驟s201相類似。
s502:獲取所述第一圖片的至少一個特征值。
第一圖片的特征值可以由第一圖片內(nèi)像素點的屬性值得到,其數(shù)量可以為1個,也可以為多個。第一圖片的特征值可以用于表示第一圖片的主體色彩,可以包括多個通道的值,具體的通道數(shù)量和種類一般與第一圖片的色彩空間相對應。由于第一圖片內(nèi)像素點的屬性值一般也與第一圖片的色彩空間相對應,因此,第一圖片特征值的通道數(shù)量和種類可以與第一圖片內(nèi)像素點的屬性值相同。
在一個實施方式中,可以獲取第一圖片內(nèi)每個像素點的屬性值,然后可以統(tǒng)計每一所述屬性值對應的像素點數(shù)量,最后可以將對應的像素點數(shù)量最多的前m個屬性值作為第一圖片的特征值。其中,所述第一圖片特征值的數(shù)量為m個。所述m為正整數(shù)。所述m一般小于或等于屬性值的種類數(shù)。例如,可以獲取第一圖片內(nèi)每個像素點的屬性值,然后通過公式
一般地,像素點的屬性值可以包括多個通道的值。因此,像素點的屬性值的位數(shù)通常較多,從而使得在統(tǒng)計每一屬性值對應的像素點數(shù)量的過程中,需要較長的統(tǒng)計時間。例如,對于rgb色彩空間,像素點的屬性值一般為一個24位的數(shù)值,具體可以包括3個通道的值。其中,每個通道的值的位數(shù)為8位。為了減少統(tǒng)計所需的時間,在另一個實施方式中,可以獲取第一圖片內(nèi)每個像素點的灰度值,然后可以統(tǒng)計每一所述灰度值對應的像素點數(shù)量,并可以獲取對應的像素點數(shù)量最多的前m個灰度值。其中,所述m為正整數(shù)。所述m一般小于或 等于灰度值的種類數(shù)。那么,對于所述m個灰度值中的每個灰度值,可以獲取該灰度值對應的像素點,并可以將該灰度值對應的各個像素點屬性值的平均值作為第一圖片的一個特征值。其中,所述第一圖片特征值的數(shù)量為m個。
第一圖片內(nèi)每個像素點的灰度值可以由該像素點的屬性值得到。例如,在色彩空間為rgb的情況下,對于所述第一圖片內(nèi)的任一像素點,可以通過公式gray=0.3r+0.59g+0.11b計算該像素點的灰度值。該公式中,r、g和b分別為該像素點屬性值中r通道的值、g通道的值和b通道的值,gray為該像素點的灰度值。
s503:基于所述第一圖片的至少一個特征值,生成第二圖片。
在一個實施方式中,在步驟s503之前,所述方法還可以包括:獲取第一圖片的尺寸。那么,在步驟s503中,可以根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第二圖片。其中,新建圖片的尺寸可以與所述第一圖片的尺寸相同。
所述第一圖片的尺寸可以包括以像素為單位的尺寸和以長度單位為單位的尺寸。所述長度單位可以包括毫米(mm)和厘米(cm)等。例如,當所述第一圖片的形狀為矩形時,所述第一圖片的尺寸可以包括第一圖片長邊的長度和短邊的長度。
進一步地,當所述第一圖片的特征值數(shù)量為1個時,可以將新建圖片內(nèi)每個像素點的屬性值調(diào)整為與所述第一圖片的特征值相同。
進一步地,當所述第一圖片的特征值數(shù)量為多個時,可以將新建圖片劃分為多個區(qū)域,并建立所述多個特征值中的每個特征值與所述多個區(qū)域中的每個區(qū)域的一一對應關(guān)系。然后對于所述多個區(qū)域中的每個區(qū)域,可以將該區(qū)域中每個像素點的屬性值調(diào)整為該區(qū)域?qū)牡谝粓D片的特征值相同。
在另一個實施方式中,在步驟s503之前,所述方法還可以包括:獲取第一圖片的尺寸。那么,在步驟s503中,可以根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第三圖片。其中,新建圖片的尺寸可以與所述第一圖片的尺寸相同。然后可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第三圖片內(nèi)每個像素點的第一阿爾法通道值。其中,所述第一阿爾法通道值,可以為根據(jù)第一預設(shè)阿爾法通道值計算得到的像素點的阿爾法通道值。然后對于第三圖片內(nèi)的每個像素點,可以根據(jù)該像素點的第一阿爾法通道值,對該像素點的第二阿爾法通道值進行調(diào)整。其中,所述第二阿爾法通道值,可以為該像素點屬性值中阿爾法通道的值。最后可以將調(diào)整后的第三圖片作為第二圖片。例如,對于第三圖片內(nèi)的每個像素點,可以將該像素點的第一阿爾法通道值賦予該像素點的阿爾法通 道,以替換該像素點的第二阿爾法通道值。像素點屬性值中阿爾法通道值的大小范圍為0到255,可以用于表示該像素點的透明度。其中,0表示完全透明,255表示完全不透明。因此,通過調(diào)整第三圖片內(nèi)像素點屬性值中的阿爾法通道值,可以使生成的第二圖片產(chǎn)生漸變的顯示效果。
所述第一預設(shè)阿爾法通道值可以為預先設(shè)定的一個阿爾法通道值,也可以為根據(jù)第一圖片的特征值計算得到的一個阿爾法通道值。例如,當?shù)谝粓D片的特征值數(shù)量為1個時,所述第一預設(shè)阿爾法通道值αmax可以根據(jù)如下的公式計算得到。
其中,
n為第一圖片內(nèi)像素點的總數(shù)量;
k為第一圖片的特征值對應的像素點數(shù)量。具體地,當將對應的像素點數(shù)量最多的屬性值作為第一圖片的特征值時,那么,k可以為該屬性值在第一圖片內(nèi)對應的像素點數(shù)量。當獲取對應的像素點數(shù)量最多的灰度值,然后將該灰度值對應的各個像素點屬性值的平均值作為第一圖片的特征值時,那么,k可以為該灰度值在第一圖片內(nèi)對應的像素點數(shù)量。
進一步地,當新建圖片的形狀為矩形時,可以以新建圖片的長邊為x軸,短邊為y軸,建立平面直角坐標系。那么,根據(jù)新建圖片的尺寸和第一預設(shè)阿爾法通道值,可以通過如下的公式計算第三圖片內(nèi)每個像素點的第一阿爾法通道值。
其中,
α(x1,y1)為第三圖片內(nèi)像素點(x1,y1)的第一阿爾法通道值;
αmax為第一預設(shè)阿爾法通道值;
w1為新建圖片長邊的長度,h1為新建圖片短邊的長度;
x1為像素點(x1,y1)的x軸坐標值,y1為像素點(x1,y1)的y軸坐標值。
在另一個實施方式中,在步驟s503之前,所述方法還可以包括:獲取所述界面的尺寸。那么,在步驟s503中,可以根據(jù)所述界面的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第二圖片。其中,新建圖片的尺寸可以與所述界面的尺寸相同。
在另一個實施方式中,在步驟s503之前,所述方法還可以包括:獲取所述界面的尺寸。那么,在步驟s503中,可以根據(jù)所述界面的尺寸,新建一張圖片,然后可以基于所述第一圖 片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第三圖片。其中,新建圖片的尺寸可以與所述界面的尺寸相同。然后可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第三圖片內(nèi)每個像素點的第一阿爾法通道值。然后對于第三圖片內(nèi)的每個像素點,可以根據(jù)該像素點的第一阿爾法通道值,對該像素點的第二阿爾法通道值進行調(diào)整。最后可以將調(diào)整后的第三圖片作為第二圖片。
s504:在所述界面的背景中顯示所述第二圖片。
在一個實施方式中,在步驟s503中,可以根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第二圖片。那么,在步驟s504中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
在另一個實施方式中,在步驟s503中,可以根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第三圖片。然后可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第三圖片內(nèi)每個像素點的第一阿爾法通道值。然后對于第三圖片內(nèi)的每個像素點,可以根據(jù)該像素點的第一阿爾法通道值,對該像素點的第二阿爾法通道值進行調(diào)整。最后可以將調(diào)整后的第三圖片作為第二圖片。那么,在步驟s504中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
在另一個實施方式中,在步驟s503中,可以根據(jù)所述界面的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第二圖片。那么,在步驟s504中,可以直接在所述界面的背景中顯示第二圖片。
在另一個實施方式中,在步驟s503中,可以根據(jù)所述界面的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,并將調(diào)整后的新建圖片作為第三圖片。然后可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第三圖片內(nèi)每個像素點的第一阿爾法通道值。然后對于第三圖片內(nèi)的每個像素點,可以根據(jù)該像素點的第一阿爾法通道值,對該像素點的第二阿爾法通道值進行調(diào)整。最后可以將調(diào)整后的第三圖片作為第二圖片。那么,在步驟s504中,可以直接在所述界面的背景中顯示第二圖片。
在一個實施方式中,焦點在界面前景中各個圖片之間移動的速度較快。因此,當基于所 述第一圖片的至少一個特征值生成第二圖片后,焦點選中的第一圖片可能已經(jīng)發(fā)生變化。因此,在步驟s504中,可以獲取當前焦點選中的區(qū)域,然后將當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域進行比對。當當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域相同時,可以在界面的背景中顯示第二圖片。進一步地,當當前焦點選中的區(qū)域與第一圖片所對應的區(qū)域不相同時,可以不在界面的背景中顯示第二圖片。
需要說明的是,本實現(xiàn)方式中,在執(zhí)行步驟s504的過程中,或者在執(zhí)行步驟s504之后,可以繼續(xù)執(zhí)行步驟s501、步驟s502和步驟s503。即,在界面背景顯示第二圖片的過程中,或者在界面背景顯示第二圖片之后,可以繼續(xù)獲取焦點選中的第一圖片,然后可以獲取所述第一圖片的至少一個特征值,最后可以基于所述第一圖片的至少一個特征值,生成第二圖片。
圖5所對應的實現(xiàn)方式,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的第一圖片,并可以獲取第一圖片的至少一個特征值,然后可以根據(jù)所述第一圖片的至少一個特征值,生成第二圖片,最后可以在所述界面的背景中顯示第二圖片。這樣,第二圖片可以基于焦點選中圖片的至少一個特征值得到。因此,第二圖片可以保留第一圖片的主體色彩,從而可以使界面背景的顏色與焦點選中圖片的顏色協(xié)調(diào)和融合,使用戶產(chǎn)生整體、融合和干凈的視覺體驗。
圖6為圖1所對應實施例的另一個實現(xiàn)方式,具體可以包括如下的步驟:
s601:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
步驟s601的內(nèi)容與步驟s201相類似。
s602:獲取所述第一圖片的至少一個特征值。
步驟s602的內(nèi)容與步驟s502相類似。
s603:對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片。
所述對所述第一圖片進行模糊處理的過程可以與圖4所對應的過程相類似。
在一個實施方式中,可以直接將模糊處理后的第一圖片作為第四圖片。
在另一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述界面尺寸的比例。那么,在步驟s603中,可以根據(jù)該比例對第一圖片進行裁剪,以使裁剪后的第一圖片的尺寸比例與所述界面的尺寸比例相同,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第四圖片。
對裁剪后的第一圖片進行模糊處理的過程也可以與圖4所對應的過程相類似。
s604:基于所述第一圖片的至少一個特征值和所述第四圖片,生成第二圖片。
在一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述第一圖片的尺寸。 那么,在步驟s604中,可以根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,然后可以將所述第四圖片和所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。例如,可以將第五圖片疊加在第四圖片之上。
進一步地,所述根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,具體可以包括:根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,將調(diào)整后的新建圖片作為第二圖片。其中,新建圖片的尺寸可以與所述第一圖片的尺寸相同。
進一步地,所述根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,具體可以包括:根據(jù)所述第一圖片的尺寸,新建一張圖片,然后可以基于所述第一圖片的至少一個特征值,對新建圖片內(nèi)每個像素點的屬性值進行調(diào)整,將調(diào)整后的新建圖片作為第三圖片。其中,新建圖片的尺寸可以與所述第一圖片的尺寸相同。然后可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第三圖片內(nèi)每個像素點的第一阿爾法通道值。然后對于第三圖片內(nèi)的每個像素點,可以根據(jù)該像素點的第一阿爾法通道值,對該像素點的第二阿爾法通道值進行調(diào)整。最后可以將調(diào)整后的第三圖片作為第二圖片。
在另一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述第一圖片的尺寸,并建立所述第一圖片的至少一個特征值中的每個特征值與所述第一圖片內(nèi)像素點的對應關(guān)系。其中,第一圖片內(nèi)的每個像素點可以對應不同的第一圖片特征值,也可以對應相同的第一圖片特征值。那么,在步驟s604中,可以根據(jù)所述第一圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述第四圖片內(nèi)每個像素點的第一阿爾法通道值。其中,所述第一阿爾法通道值,可以為根據(jù)第一預設(shè)阿爾法通道值計算得到的像素點的阿爾法通道值。然后對于第四圖片內(nèi)的每個像素點,可以獲取該像素點的屬性值,并可以基于所述對應關(guān)系獲取該像素點對應的第一圖片的特征值,然后基于該像素點的屬性值、該像素點的第一阿爾法通道值和該像素點對應的第一圖片的特征值,計算該像素點的特征值,并使用該像素點的特征值替換該像素點的屬性值。最后可以將替換后的第四圖片作為第二圖片。例如,在色彩空間為rgb的情況下,對于第四圖片內(nèi)的任一像素點,該像素點對應的第一圖片的特征值為(ra1,ga1,ba1),該像素點的第一阿爾法通道值為alphax1,該像素點的屬性值為(rb1,gb1,bb1)。那么,可以根據(jù)如下的公式計算該像素點特征值(rc1,gc1,bc1)。
rc1=rb1+ra1*alphax1;
gc1=gb1+ga1*alphax1;
bc1=bb1+ba1*alphax1;
其中,
ra1、ga1和ba1分別為該像素點對應的第一圖片特征值中r通道的值、g通道的值和b通道的值;
rb1、gb1和bb1分別為該像素點屬性值中r通道的值、g通道的值和b通道的值;
rc1、gc1和bc1分別為該像素點特征值中r通道的值、g通道的值和b通道的值。
進一步地,當?shù)谝粓D片的形狀為矩形時,可以以所述第一圖片的長邊為x軸,短邊為y軸,建立平面直角坐標系。那么,根據(jù)所述第一圖片的尺寸和第一預設(shè)阿爾法通道值,可以通過如下的公式計算第四圖片內(nèi)每個像素點的第一阿爾法通道值。
其中,
α(x2,y2)為第四圖片內(nèi)像素點(x2,y2)的第一阿爾法通道值;
αmax為第一預設(shè)阿爾法通道值;
w2為第一圖片長邊的長度,h2為第一圖片短邊的長度;
x2為像素點(x2,y2)x軸的坐標值,y2為像素點(x2,y2)y軸的坐標值。
在一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述第一圖片的尺寸。在步驟s603中,可以直接將模糊處理后的第一圖片作為第四圖片。那么,在步驟s604中,可以根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,然后可以直接將所述第四圖片和所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。
在另一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述第一圖片的尺寸和所述界面尺寸的比例。在步驟s603中,可以直接將模糊處理后的第一圖片作為第四圖片。那么,在步驟s604中,可以根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,然后可以根據(jù)所述比例,分別對所述第四圖片和所述第五圖片進行裁剪,然后可以將裁剪后的所述第四圖片和裁剪后的所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。
在另一個實施方式中,在步驟s603之前,所述方法還可以包括:獲取所述第一圖片的尺寸和所述界面尺寸的比例。在步驟s603中,可以根據(jù)該比例對第一圖片進行裁剪,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第四圖片。那么,在步驟s604中,可以根據(jù)所述第一圖片的尺寸和至少一個特征值,生成第五圖片,然后可以根據(jù)所述比例,對所述第五圖片進行裁剪,然后可以將所述第四圖片和裁剪后的所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。
s605:在所述界面的背景中顯示所述第二圖片。
具體地,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
在一個實施方式中,在步驟s604中,可以直接將所述第四圖片和所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。那么,在步驟s605中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸獲取所述界面尺寸的比例,并可以根據(jù)該比例對第二圖片進行裁剪,最后可以根據(jù)所述界面的尺寸,對裁剪后的第二圖片進行拉伸。
在另一個實施方式中,在步驟s604中,可以將裁剪后的所述第四圖片和裁剪后的所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。那么,在步驟s605中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,直接對第二圖片進行拉伸。
在另一個實施方式中,在步驟s604中,可以將所述第四圖片和裁剪后的所述第五圖片進行疊加,并將疊加后的圖片作為第二圖片。那么,在步驟s605中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,直接對第二圖片進行拉伸。
需要說明的是,本實現(xiàn)方式中,在執(zhí)行步驟s605的過程中,或者在執(zhí)行步驟s605之后,可以繼續(xù)執(zhí)行步驟s601、步驟s602、步驟s603和步驟s604。即,在界面背景顯示第二圖片的過程中,或者在界面背景顯示第二圖片之后,可以繼續(xù)獲取焦點選中的第一圖片,然后可以獲取所述第一圖片的至少一個特征值,并可以對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片,最后可以基于所述第一圖片的至少一個特征值和所述第四圖片,生成第二圖片。
圖6所對應的實現(xiàn)方式,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的第一圖片,并可以獲取所第一圖片的至少一個特征值,并可以對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片,然后可以基于所述第一圖片的至少一個特征值和所述第四圖片,生成第二圖片,最后可以在所述界面的背景中顯示第二圖片。這樣,第二圖片可以根據(jù)所述第一圖片的至少一個特征值和模糊處理后的第一圖片得到。因此,第二圖片在保留第一圖片的主體色彩的同時,變得平滑,從而可以使界面背景的顏色與焦點選中圖片的顏色協(xié)調(diào)和融合,使用戶產(chǎn)生整體、融合和干凈的視覺體驗。
圖7為圖1所對應實施例的另一個實現(xiàn)方式,具體可以包括如下的步驟:
s701:建立所述界面前景中的圖片與預設(shè)圖片的對應關(guān)系。
預設(shè)圖片可以是預先存儲的、用于與焦點選中的圖片進行疊加的圖片。所述預設(shè)圖片的尺寸一般與界面前景中的圖片相同。所述預設(shè)圖片可以存儲于本地(local)設(shè)備中,也可以 存儲于服務器中。
預設(shè)圖片內(nèi)每個像素點屬性值中的阿爾法通道值可以相同,也可以不同。
界面前景中的每個圖片,可以對應不同的預設(shè)圖片,也可以對應相同的預設(shè)圖片。
s702:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
步驟s702的內(nèi)容與步驟s201相類似。
s703:基于所述對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)圖片。
焦點選中的圖片一般為界面前景中的圖片。即,第一圖片一般為界面前景中的圖片。因此,可以基于所述界面前景中的圖片與預設(shè)圖片的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)圖片。
s704:對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片。
所述對所述第一圖片進行模糊處理的過程可以與圖4所對應的過程相類似。
在一個實施方式中,可以直接將模糊處理后的第一圖片作為第四圖片。
在另一個實施方式中,在步驟s704之前,所述方法還可以包括:獲取所述界面尺寸的比例。那么,在步驟s704中,可以根據(jù)該比例對第一圖片進行裁剪,以使裁剪后的第一圖片的尺寸比例與所述界面的尺寸比例相同,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第四圖片。
對裁剪后的第一圖片進行模糊處理的過程也可以與圖4所對應的過程相類似。
s705:基于所述第一預設(shè)圖片和所述第四圖片,生成第二圖片。
在一個實施方式中,在步驟s704中,可以直接將模糊處理后的第一圖片作為第四圖片。那么,在步驟s705中,可以直接將所述第一預設(shè)圖片與所述第四圖片進行疊加,并將疊加后的圖片作為第二圖片。例如,可以將所述第一預設(shè)圖片疊加在所述第四圖片之上。
在另一個實施方式中,在步驟s704中,可以根據(jù)所述界面尺寸的比例對第一圖片進行裁剪,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第四圖片。那么,在步驟s705中,可以根據(jù)所述界面尺寸的比例對第一預設(shè)圖片進行裁剪,然后將裁剪后的所述第一預設(shè)圖片與所述第四圖片進行疊加,并將疊加后的圖片作為第二圖片。
s706:在所述界面的背景中顯示所述第二圖片。
具體地,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
在一個實施方式中,在步驟s705中,可以直接將所述第一預設(shè)圖片與所述第四圖片進行疊加,并將疊加后的圖片作為第二圖片。那么,在步驟s706中,可以獲取所述界面的尺寸, 然后可以根據(jù)所述界面的尺寸獲取所述界面尺寸的比例,并可以根據(jù)該比例對第二圖片進行裁剪,最后可以根據(jù)所述界面的尺寸,對裁剪后的第二圖片進行拉伸。
在另一個實施方式中,在步驟s705中,可以根據(jù)所述界面尺寸的比例對第一預設(shè)圖片進行裁剪,然后將裁剪后的所述第一預設(shè)圖片與所述第四圖片進行疊加,并將疊加后的圖片作為第二圖片。那么,在步驟s706中,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,直接對第二圖片進行拉伸。
需要說明的是,盡管在附圖中采用箭頭表示順序,但實際上步驟s703與步驟s704并沒有嚴格的先后順序。依賴于硬件的處理能力,這二者也可以并行處理。
圖7所對應的實現(xiàn)方式,可以建立所述界面前景中的圖片與預設(shè)圖片的對應關(guān)系。在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的第一圖片,然后可以基于對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)圖片,并可以對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片,然后可以基于所述第一預設(shè)圖片和所述第四圖片,生成第二圖片。最后可以在所述界面的背景中顯示第二圖片。與圖5和圖6所對應的實現(xiàn)方式相比,圖7所對應的實現(xiàn)方式不需要獲取所述第一圖片的至少一個特征值,從而可以減少生成第二圖片所需的時間,進而可以減少在所述界面的背景中顯示第二圖片所需的時間。
圖8為圖1所對應實施例的另一個實現(xiàn)方式,具體可以包括如下的步驟:
s801:建立所述界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,以及建立所述界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系。
所述預設(shè)屬性值集合可以為像素點的預設(shè)屬性值組成的集合。其中,所述預設(shè)屬性值可以為預先設(shè)定的屬性值。界面前景中的每個圖片,可以對應不同的預設(shè)屬性值集合,也可以對應相同的預設(shè)屬性值集合。
界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,可以包括界面前景中圖片的像素點與預設(shè)屬性值集合中的預設(shè)屬性值的對應關(guān)系。界面前景中圖片的每個像素點,可以對應不同的預設(shè)屬性值,也可以對應相同的預設(shè)屬性值。
所述預設(shè)阿爾法通道值集合可以為第二預設(shè)阿爾法通道值組成的集合。其中,所述第二預設(shè)阿爾法通道值可以為預先設(shè)定的阿爾法通道值。界面前景中的每個圖片,可以對應不同的預設(shè)阿爾法通道值集合,也可以對應相同的預設(shè)阿爾法通道值集合。
界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系,可以包括界面前景中圖片的像素點與預設(shè)阿爾法通道值集合中的第二預設(shè)阿爾法通道值的對應關(guān)系。界面前景中圖片的每個像素點,可以對應不同的第二預設(shè)阿爾法通道值,也可以對應相同的第二預設(shè)阿爾法通道 值。
s802:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
步驟s802的內(nèi)容與步驟s201相類似。
s803:基于所述界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)屬性值集合,基于所述界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)阿爾法通道值集合。
焦點選中的圖片一般為界面前景中的圖片。即,第一圖片一般為界面前景中的圖片。因此,可以基于所述界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)屬性值集合,可以基于所述界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)阿爾法通道值集合。
s804:對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片。
所述對所述第一圖片進行模糊處理的過程可以與圖4所對應的過程相類似。
在一個實施方式中,可以直接將模糊處理后的第一圖片作為第四圖片。
在另一個實施方式中,在步驟s804之前,所述方法還可以包括:獲取所述界面尺寸的比例。那么,在步驟s804中,可以根據(jù)該比例對第一圖片進行裁剪,以使裁剪后的第一圖片的尺寸比例與所述界面的尺寸比例相同,并可以對裁剪后的第一圖片進行模糊處理,最后可以將依次裁剪并模糊處理后的第一圖片作為第四圖片。
對裁剪后的第一圖片進行模糊處理的過程也可以與圖4所對應的過程相類似。
s805:基于所述第一預設(shè)屬性值集合、所述第一預設(shè)阿爾法通道值集合和所述第四圖片,生成第二圖片。
界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,可以包括界面前景中圖片的像素點與預設(shè)屬性值集合中的預設(shè)屬性值的對應關(guān)系。界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系,可以包括界面前景中圖片的像素點與預設(shè)阿爾法通道值集合中的第二預設(shè)阿爾法通道值的對應關(guān)系。因此,對于第四圖片內(nèi)的每個像素點,可以獲取該像素點的屬性值,從所述第一預設(shè)屬性值集合中獲取該像素點對應的預設(shè)屬性值,從所述第一預設(shè)阿爾法通道值集合中獲取該像素點對應的第二預設(shè)阿爾法通道值,然后可以基于該像素點的屬性值、該像素點對應的預設(shè)屬性值和該像素點對應的第二預設(shè)阿爾法通道值,計算該像素點的特征值,并使用該像素點的特征值替換該像素點的屬性值。最后可以將替換后的第四圖片作為第二圖片。例如,在色彩空間為rgb的情況下,對于第四圖片內(nèi)的任一像素點,該像素點的屬性值為(ra2,ga2,ba2),該像素點對應的第二阿爾法通道值為alphax2,該像素點對應的預設(shè)屬性值為(rb2,gb2,bb2)。那么,可以根據(jù)如下的公式計算該像素點特征值(rc2,gc2, bc2)。
rc2=rb2+ra2*alphax2;
gc2=gb2+ga2*alphax2;
bc2=bb2+ba2*alphax2;
其中,
ra2、ga2和ba2分別為該像素點的屬性值中r通道的值、g通道的值和b通道的值;
rb2、gb2和bb2分別為該像素點對應的預設(shè)屬性值中r通道的值、g通道的值和b通道的值;
rc2、gc2和bc2分別為該像素點特征值中r通道的值、g通道的值和b通道的值。
s806:在所述界面的背景中顯示所述第二圖片。
具體地,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
需要說明的是,盡管在附圖中采用箭頭表示順序,但實際上步驟s803與步驟s804并沒有嚴格的先后順序。依賴于硬件的處理能力,這二者也可以并行處理。
圖8所對應的實現(xiàn)方式,可以建立所述界面前景中的圖片與預設(shè)屬性值集合以及所述界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系。在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的第一圖片,然后可以基于所述界面前景中的圖片與預設(shè)屬性值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)屬性值集合,基于所述界面前景中的圖片與預設(shè)阿爾法通道值集合的對應關(guān)系,獲取與所述第一圖片對應的第一預設(shè)阿爾法通道值集合,并可以對所述第一圖片進行模糊處理,將模糊處理后的第一圖片作為第四圖片。然后可以基于所述第一預設(shè)屬性值集合、所述第一預設(shè)阿爾法通道值集合和所述第四圖片,生成第二圖片。最后可以在所述界面的背景中顯示第二圖片。與圖5和圖6所對應的實現(xiàn)方式相比,圖8所對應的實現(xiàn)方式不需要獲取所述第一圖片的至少一個特征值,從而可以減少生成第二圖片所需的時間,進而可以減少在所述界面的背景中顯示第二圖片所需的時間。
圖8為圖1所對應實施例的另一個實現(xiàn)方式,具體可以包括如下的步驟:
s901:響應于界面中焦點移動的觸發(fā)指令,獲取焦點選中的第一圖片。
步驟s901的內(nèi)容與步驟s201相類似。
s902:獲取所述界面的尺寸以及所述第一圖片的至少一個特征值。
獲取所述第一圖片的至少一個特征值的過程與步驟s502相類似。
s903:根據(jù)所述界面的尺寸,新建一張圖片。
新建圖片的尺寸可以和所述界面的尺寸相同
s904:根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述新建圖片內(nèi)每個像素點的第一阿爾法通道值。
進一步地,當所述新建圖片的形狀為矩形時,可以以新建圖片的長邊為x軸,短邊為y軸,建立平面直角坐標系。那么,根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,可以通過如下的公式計算所述新建圖片內(nèi)每個像素點的第一阿爾法通道值。
其中,
α(x3,y3)為像素點(x3,y3)的第一阿爾法通道值;
αmax為第一預設(shè)阿爾法通道值;
w2為界面長邊的長度,h2為界面短邊的長度;
x3為像素點(x3,y3)的x軸坐標值,y3為像素點(x3,y3)的y軸坐標值。
s905:基于所述第一圖片的至少一個特征值,確定所述新建圖片內(nèi)每個像素點的屬性值。
具體地,可以建立所述第一圖片的至少一個特征值中的每個特征值與所述新建圖片內(nèi)像素點的對應關(guān)系。其中,新建圖片內(nèi)每個像素點可以對應不同的第一圖片特征值,也可以對應相同的第一圖片特征值。由于第一圖片特征值的通道數(shù)量和種類可以與新建圖片內(nèi)像素點的屬性值相同,因此,對于新建圖片內(nèi)的每個像素點,可以將該像素點對應的第一圖片的特征值作為該像素點的屬性值。
s906:將所述新建圖片內(nèi)每個像素點的屬性值和第一阿爾法通道值,填充至所述新建圖片,將填充后的新建圖片作為第二圖片。
具體地,像素點的屬性值可以用于表示像素點的色彩。因此,可以將所述新建圖片內(nèi)每個像素點的屬性值填充至所述新建圖片,從而可以實現(xiàn)對所述新建圖片的色彩填充。然后,對于所述新建圖片內(nèi)的每個像素點,可以將該像素點的第一阿爾法通道值賦予該像素點的阿爾法通道,從而可以使所述新建圖片產(chǎn)生漸變的顯示效果。
s907:在所述界面的背景中顯示所述第二圖片。
具體地,可以獲取所述界面的尺寸,然后可以根據(jù)所述界面的尺寸,對第二圖片進行拉伸,最后可以在所述界面的背景中顯示拉伸后的第二圖片。
圖9所對應的實施例,在檢測到界面中焦點移動的觸發(fā)指令以后,可以獲取焦點選中的第一圖片,然后可以獲取所述界面的尺寸以及所述第一圖片的至少一個特征值,然后可以根 據(jù)所述界面的尺寸,新建一張圖片,并可以根據(jù)所述新建圖片的尺寸和第一預設(shè)阿爾法通道值,計算所述新建圖片內(nèi)每個像素點的第一阿爾法通道值,然后可以基于所述第一圖片的至少一個特征值,確定所述新建圖片內(nèi)每個像素點的屬性值,然后可以將所述新建圖片內(nèi)每個像素點的屬性值和第一阿爾法通道值,填充至所述新建圖片,并將填充后的新建圖片作為第二圖片。最后可以在所述界面的背景中顯示所述第二圖片。這樣,界面的背景與焦點選中的圖片是相對應的。當焦點選中的圖片發(fā)生變化后,界面的背景也會相應地發(fā)生變化。因此,與現(xiàn)有技術(shù)相比,圖9所對應的實施例可以使界面背景的顏色與焦點選中圖片的顏色相協(xié)調(diào)和融合,從而提升了用戶的視覺體驗。
在20世紀90年代,對于一個技術(shù)的改進可以很明顯地區(qū)分是硬件上的改進(例如,對二極管、晶體管、開關(guān)等電路結(jié)構(gòu)的改進)還是軟件上的改進(對于方法流程的改進)。然而,隨著技術(shù)的發(fā)展,當今的很多方法流程的改進已經(jīng)可以視為硬件電路結(jié)構(gòu)的直接改進。設(shè)計人員幾乎都通過將改進的方法流程編程到硬件電路中來得到相應的硬件電路結(jié)構(gòu)。因此,不能說一個方法流程的改進就不能用硬件實體模塊來實現(xiàn)。例如,可編程邏輯器件(programmablelogicdevice,pld)(例如現(xiàn)場可編程門陣列(fieldprogrammablegatearray,fpga))就是這樣一種集成電路,其邏輯功能由用戶對器件編程來確定。由設(shè)計人員自行編程來把一個數(shù)字系統(tǒng)“集成”在一片pld上,而不需要請芯片制造廠商來設(shè)計和制作專用的集成電路芯片2。而且,如今,取代手工地制作集成電路芯片,這種編程也多半改用“邏輯編譯器(logiccompiler)”軟件來實現(xiàn),它與程序開發(fā)撰寫時所用的軟件編譯器相類似,而要編譯之前的原始代碼也得用特定的編程語言來撰寫,此稱之為硬件描述語言(hardwaredescriptionlanguage,hdl),而hdl也并非僅有一種,而是有許多種,如abel(advancedbooleanexpressionlanguage)、ahdl(alterahardwaredescriptionlanguage)、confluence、cupl(cornelluniversityprogramminglanguage)、hdcal、jhdl(javahardwaredescriptionlanguage)、lava、lola、myhdl、palasm、rhdl(rubyhardwaredescriptionlanguage)等,目前最普遍使用的是vhdl(very-high-speedintegratedcircuithardwaredescriptionlanguage)與verilog2。本領(lǐng)域技術(shù)人員也應該清楚,只需要將方法流程用上述幾種硬件描述語言稍作邏輯編程并編程到集成電路中,就可以很容易得到實現(xiàn)該邏輯方法流程的硬件電路。
本領(lǐng)域技術(shù)人員也知道,除了以純計算機可讀程序代碼方式實現(xiàn)控制器以外,完全可以通過將方法步驟進行邏輯編程來使得控制器以邏輯門、開關(guān)、專用集成電路、可編程邏輯控制器和嵌入微控制器等的形式來實現(xiàn)相同功能。因此這種控制器可以被認為是一種硬件部 件,而對其內(nèi)包括的用于實現(xiàn)各種功能的裝置也可以視為硬件部件內(nèi)的結(jié)構(gòu)?;蛘呱踔粒梢詫⒂糜趯崿F(xiàn)各種功能的裝置視為既可以是實現(xiàn)方法的軟件模塊又可以是硬件部件內(nèi)的結(jié)構(gòu)。
上述實施例闡明的系統(tǒng)、裝置、模塊或單元,具體可以由計算機芯片或?qū)嶓w實現(xiàn),或者由具有某種功能的產(chǎn)品來實現(xiàn)。
為了描述的方便,描述以上裝置時以功能分為各種單元分別描述。當然,在實施本申請時可以把各單元的功能在同一個或多個軟件和/或硬件中實現(xiàn)。
通過以上的實施方式的描述可知,本領(lǐng)域的技術(shù)人員可以清楚地了解到本申請可借助軟件加必需的通用硬件平臺的方式來實現(xiàn)。基于這樣的理解,本申請的技術(shù)方案本質(zhì)上或者說對現(xiàn)有技術(shù)做出貢獻的部分可以以軟件產(chǎn)品的形式體現(xiàn)出來,該計算機軟件產(chǎn)品可以存儲在存儲介質(zhì)中,如rom/ram、磁碟、光盤等,包括若干指令用以使得一臺計算機設(shè)備(可以是個人計算機,服務器,或者網(wǎng)絡(luò)設(shè)備等)執(zhí)行本申請各個實施例或者實施例的某些部分所述的方法。
本說明書中的各個實施例均采用遞進的方式描述,各個實施例之間相同相似的部分互相參見即可,每個實施例重點說明的都是與其他實施例的不同之處。尤其,對于系統(tǒng)實施例而言,由于其基本相似于方法實施例,所以描述的比較簡單,相關(guān)之處參見方法實施例的部分說明即可。
本申請可用于眾多通用或?qū)S玫挠嬎銠C系統(tǒng)環(huán)境或配置中。例如:個人計算機、服務器計算機、手持設(shè)備或便攜式設(shè)備、平板型設(shè)備、多處理器系統(tǒng)、基于微處理器的系統(tǒng)、置頂盒、可編程的消費電子設(shè)備、網(wǎng)絡(luò)pc、小型計算機、大型計算機、包括以上任何系統(tǒng)或設(shè)備的分布式計算環(huán)境等等。
本申請可以在由計算機執(zhí)行的計算機可執(zhí)行指令的一般上下文中描述,例如程序模塊。一般地,程序模塊包括執(zhí)行特定任務或?qū)崿F(xiàn)特定抽象數(shù)據(jù)類型的例程、程序、對象、組件、數(shù)據(jù)結(jié)構(gòu)等等。也可以在分布式計算環(huán)境中實踐本申請,在這些分布式計算環(huán)境中,由通過通信網(wǎng)絡(luò)而被連接的遠程處理設(shè)備來執(zhí)行任務。在分布式計算環(huán)境中,程序模塊可以位于包括存儲設(shè)備在內(nèi)的本地和遠程計算機存儲介質(zhì)中。
雖然通過實施例描繪了本申請,本領(lǐng)域普通技術(shù)人員知道,本申請有許多變形和變化而不脫離本申請的精神,希望所附的權(quán)利要求包括這些變形和變化而不脫離本申請的精神。