確定用戶界面變更的方法及裝置的制造方法
【專利摘要】本發(fā)明提供一種確定用戶界面變更的方法及裝置。該方法包括：獲取游戲的兩個版本的用戶界面的子圖信息；根據(jù)子圖信息，獲得兩用戶界面分別包含的子圖；比對兩用戶界面中具有相同子圖標(biāo)識的子圖；根據(jù)比對結(jié)果，確定用戶界面是否變更。本發(fā)明通過自動化方式確定游戲的兩個版本對應(yīng)的用戶界面是否有更新，提高了工作效率并降低出錯率。
【專利說明】
確定用戶界面變更的方法及裝置
技術(shù)領(lǐng)域
[0001] 本發(fā)明設(shè)及用戶界面，尤其設(shè)及一種確定用戶界面變更的方法及裝置。
【背景技術(shù)】
[0002] 使用游戲框架開發(fā)游戲的過程中，用戶界面化ser Interface,簡稱:UI)的更新是 非常頻繁的，并且在團(tuán)隊協(xié)作中監(jiān)控每一次更新變動是保證項目質(zhì)量的有效途徑。接觸過 游戲引擎的開發(fā)人員都會有類似感受:每次UI資源出現(xiàn)變更，都會比較擔(dān)屯、。因為檢查時候 沒有比較直觀的方法可W觀察到，到底變更都設(shè)及哪些內(nèi)容。而UI資源變更，出問題的話， 小至UI顯示異常，大至客戶端閃退。
[0003] 在當(dāng)前階段，對于游戲的兩個版本對應(yīng)的UI是否有更新，開發(fā)者是通過肉眼觀察 進(jìn)行判斷的。但通過肉眼觀察運種人工方式判斷UI是否有更新是一項繁瑣、勞累且容易出 錯的工作。特別是，當(dāng)數(shù)百個UI版面經(jīng)歷數(shù)千次的更新時，現(xiàn)有的做法費時費力，已難W滿 足實際需要。

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

[0004] 本發(fā)明提供一種確定用戶界面變更的方法及裝置，W通過自動化方式確定游戲的 兩個版本對應(yīng)的UI是否有更新，提高工作效率并降低出錯率。
[0005] 第一方面，本發(fā)明提供一種確定用戶界面變更的方法，包括:獲取游戲的兩個版本 的用戶界面的子圖信息;根據(jù)所述子圖信息，獲得兩用戶界面分別包含的子圖；比對兩用戶 界面中具有相同子圖標(biāo)識的子圖；根據(jù)比對結(jié)果，確定所述用戶界面是否變更。
[0006] 在第一方面的第一種實現(xiàn)方式中，上述比對兩用戶界面中具有相同子圖標(biāo)識的子 圖之后，還包括：顯示比對結(jié)果，其中，所述比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo)識 的子圖、子圖比對結(jié)果和所述用戶界面比對結(jié)果。
[0007] 在第一方面的第二種實現(xiàn)方式中，上述獲取游戲的兩個版本的用戶界面的子圖信 息，包括:按照鍵值對列表，分別從兩用戶界面的配置文件中獲取單個子圖的子圖信息和子 圖標(biāo)識，其中，所述鍵值對列表中的鍵記錄用戶界面中子圖的子圖標(biāo)識，所述鍵值對列表中 的值記錄用戶界面中子圖的子圖信息。
[000引在第一方面的第Ξ種實現(xiàn)方式中，上述子圖信息包括:子圖在用戶界面中的位置、 子圖在原始子圖中的位置及所述原始子圖的大小，其中，子圖為剪切掉原始子圖的透明區(qū) 域后得到的圖片。上述根據(jù)所述子圖信息，獲得兩用戶界面分別包含的子圖，包括:根據(jù)所 述原始子圖的大小和所述子圖在原始子圖中的位置，獲得所述子圖信息對應(yīng)的子圖的層疊 樣式表CSS樣式參數(shù);根據(jù)用戶界面和所述子圖在用戶界面中的位置，獲得第一子圖；將所 述第一子圖設(shè)置在所述CSS樣式參數(shù)表征的第一塊標(biāo)簽上，得到用戶界面包含的一子圖。
[0009]在第一方面的第四種實現(xiàn)方式中，上述原始子圖的大小包括原始子圖的寬度與高 度，所述子圖在原始子圖中的位置包括子圖在原始子圖中的縱坐標(biāo)、橫坐標(biāo)、所述子圖的高 度和寬度。因此，上述根據(jù)所述原始子圖的大小和所述子圖在原始子圖中的位置，獲得所述 子圖信息對應(yīng)的子圖的css樣式參數(shù)，包括:將所述原始子圖的寬度與二倍邊框線寬度進(jìn)行 求和，獲得所述CSS樣式參數(shù)中的寬度;將所述原始子圖的高度與二倍邊框線寬度進(jìn)行求 和，獲得所述CSS樣式參數(shù)中的高度;根據(jù)所述子圖在原始子圖中的位置，確定所述CSS樣式 參數(shù)中的上留白及左留白；將所述原始子圖的高度與所述子圖在原始子圖中的縱坐標(biāo)的差 值，再減去所述子圖的高度，獲得所述CSS樣式參數(shù)中的下留白；將所述原始子圖的寬度與 所述子圖在原始子圖中的橫坐標(biāo)的差值，再減去所述子圖的寬度，獲得所述CSS樣式參數(shù)中 的右留白。
[0010] 在第一方面的第五種實現(xiàn)方式中，子圖信息還可W包括：用于表征子圖是否有旋 轉(zhuǎn)的信息，若所述用于表征子圖是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)?；诖?，上述根據(jù)用戶 界面和所述子圖在用戶界面中的位置，獲得第一子圖之后，還包括:將所述第一子圖W旋轉(zhuǎn) 基點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，所述設(shè)定角度為打包所述用戶界面時，所述第一子圖 所旋轉(zhuǎn)的角度，所述旋轉(zhuǎn)基點的橫縱坐標(biāo)均為所述子圖的高度的二分之一。
[0011] 在第一方面的第六種實現(xiàn)方式中，上述比對兩用戶界面中具有相同子圖標(biāo)識的子 圖，包括:獲得所述兩用戶界面中具有相同子圖標(biāo)識的子圖的直方圖向量及兩個直方圖向 量之間的距離;若兩個直方圖向量的距離為零，則確定所述具有相同子圖標(biāo)識的子圖的相 似度為100%。
[0012] 在第一方面的第屯種實現(xiàn)方式中，上述比對兩用戶界面中具有相同子圖標(biāo)識的子 圖，還包括:若所述兩個直方圖向量的距離不為零，則分別將所述具有相同子圖標(biāo)識的子圖 進(jìn)行像素點歸一化，得到第一向量和第二向量;根據(jù)所述第一向量和所述第二向量的點積， 得到所述兩用戶界面中具有相同子圖標(biāo)識的子圖的相似度。
[0013] 第二方面，本發(fā)明提供一種確定用戶界面變更的裝置，包括:第一獲取模塊，用于 獲取游戲的兩個版本的用戶界面的子圖信息;第二獲取模塊，用于根據(jù)所述子圖信息，獲得 兩用戶界面分別包含的子圖；比對模塊，用于比對兩用戶界面中具有相同子圖標(biāo)識的子圖； 確定模塊，用于根據(jù)比對結(jié)果，確定所述用戶界面是否變更。
[0014] 在第二方面的第一種實現(xiàn)方式中，該裝置還包括：顯示模塊，用于顯示比對結(jié)果， 其中，所述比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo)識的子圖、子圖比對結(jié)果和所述用 戶界面比對結(jié)果。
[0015] 在第二方面的第二種實現(xiàn)方式中，上述第一獲取模塊具體用于:按照鍵值對列表， 分別從兩用戶界面的配置文件中獲取單個子圖的子圖信息和子圖標(biāo)識，其中，所述鍵值對 列表中的鍵記錄用戶界面中子圖的子圖標(biāo)識，所述鍵值對列表中的值記錄用戶界面中子圖 的子圖信息。
[0016] 在第二方面的第Ξ種實現(xiàn)方式中，子圖信息包括:子圖在用戶界面中的位置、子圖 在原始子圖中的位置及所述原始子圖的大小，其中，子圖為剪切掉原始子圖的透明區(qū)域后 得到的圖片。所述第二獲取模塊具體用于:根據(jù)所述原始子圖的大小和所述子圖在原始子 圖中的位置，獲得所述子圖信息對應(yīng)的子圖的層疊樣式表CSS樣式參數(shù);根據(jù)用戶界面和所 述子圖在用戶界面中的位置，獲得第一子圖；將所述第一子圖設(shè)置在所述CSS樣式參數(shù)表征 的第一塊標(biāo)簽上，得到用戶界面包含的一子圖。
[0017] 在第二方面的第四種實現(xiàn)方式中，所述原始子圖的大小包括原始子圖的寬度與高 度，所述子圖在原始子圖中的位置包括子圖在原始子圖中的縱坐標(biāo)、橫坐標(biāo)、所述子圖的高 度和寬度。則所述第二獲取模塊還用于:將所述原始子圖的寬度與二倍邊框線寬度進(jìn)行求 和，獲得所述CSS樣式參數(shù)中的寬度;將所述原始子圖的高度與二倍邊框線寬度進(jìn)行求和， 獲得所述CSS樣式參數(shù)中的高度;根據(jù)所述子圖在原始子圖中的位置，確定所述CSS樣式參 數(shù)中的上留白及左留白；將所述原始子圖的高度與所述子圖在原始子圖中的縱坐標(biāo)的差 值，再減去所述子圖的高度，獲得所述CSS樣式參數(shù)中的下留白；將所述原始子圖的寬度與 所述子圖在原始子圖中的橫坐標(biāo)的差值，再減去所述子圖的寬度，獲得所述CSS樣式參數(shù)中 的右留白。
[0018] 在第二方面的第五種實現(xiàn)方式中，所述子圖信息還包括：用于表征子圖是否有旋 轉(zhuǎn)的信息。若所述用于表征子圖是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)，則所述第二獲取模塊 還用于:將所述第一子圖W旋轉(zhuǎn)基點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，所述設(shè)定角度為打包 所述用戶界面時，所述第一子圖所旋轉(zhuǎn)的角度，所述旋轉(zhuǎn)基點的橫縱坐標(biāo)均為所述子圖的 高度的二分之一。
[0019] 在第二方面的第六種實現(xiàn)方式中，所述比對模塊具體用于:獲得所述兩用戶界面 中具有相同子圖標(biāo)識的子圖的直方圖向量及兩個直方圖向量之間的距離;若兩個直方圖向 量的距離為零，則確定所述具有相同子圖標(biāo)識的子圖的相似度為100%。
[0020] 在第二方面的第屯種實現(xiàn)方式中，所述比對模塊還用于:若所述兩個直方圖向量 的距離不為零，則分別將所述具有相同子圖標(biāo)識的子圖進(jìn)行像素點歸一化，得到第一向量 和第二向量;根據(jù)所述第一向量和所述第二向量的點積，得到所述兩用戶界面中具有相同 子圖標(biāo)識的子圖的相似度。
[0021] 本發(fā)明確定用戶界面變更的方法及裝置，通過獲取游戲的兩個版本的用戶界面的 子圖信息，并根據(jù)子圖信息，獲得兩用戶界面分別包含的子圖；比對兩用戶界面中具有相同 子圖標(biāo)識的子圖，根據(jù)比對結(jié)果，確定用戶界面是否變更，從而實現(xiàn)通過自動化方式確定游 戲的兩個版本對應(yīng)的用戶界面是否有更新，提高了工作效率并降低出錯率。
【附圖說明】
[0022] 為了更清楚地說明本發(fā)明實施例或現(xiàn)有技術(shù)中的技術(shù)方案，下面將對實施例或現(xiàn) 有技術(shù)描述中所需要使用的附圖做一簡單地介紹，顯而易見地，下面描述中的附圖是本發(fā) 明的一些實施例，對于本領(lǐng)域普通技術(shù)人員來講，在不付出創(chuàng)造性勞動性的前提下，還可W 根據(jù)運些附圖獲得其他的附圖。
[0023] 圖1為本發(fā)明確定用戶界面變更的方法實施例一的流程圖；
[0024] 圖2為本發(fā)明確定用戶界面變更的方法中比對結(jié)果示例圖；
[0025] 圖3為本發(fā)明確定用戶界面變更的方法中子圖與用戶界面、原始子圖的關(guān)系示例 圖；
[0026] 圖4為本發(fā)明確定用戶界面變更的方法中CSS樣式參數(shù)的示例圖；
[0027] 圖5為本發(fā)明確定用戶界面變更的方法中獲取子圖過程的一示例圖；
[0028] 圖6為本發(fā)明確定用戶界面變更的方法中獲取子圖過程的另一示例圖；
[0029] 圖7為本發(fā)明確定用戶界面變更的方法中獲取子圖過程的另一示例圖；
[0030] 圖8為本發(fā)明確定用戶界面變更的方法中旋轉(zhuǎn)子圖過程的示例圖；
[0031] 圖9為本發(fā)明確定用戶界面變更的裝置實施例一的結(jié)構(gòu)示意圖；
[0032] 圖10為本發(fā)明確定用戶界面變更的裝置實施例二的結(jié)構(gòu)示意圖。
【具體實施方式】
[0033] 為使本發(fā)明實施例的目的、技術(shù)方案和優(yōu)點更加清楚，下面將結(jié)合本發(fā)明實施例 中的附圖，對本發(fā)明實施例中的技術(shù)方案進(jìn)行清楚、完整地描述，顯然，所描述的實施例是 本發(fā)明一部分實施例，而不是全部的實施例。基于本發(fā)明中的實施例，本領(lǐng)域普通技術(shù)人員 在沒有做出創(chuàng)造性勞動前提下所獲得的所有其他實施例，都屬于本發(fā)明保護(hù)的范圍。
[0034] 本發(fā)明實施例的說明書和權(quán)利要求書中的術(shù)語"包括"和"具有及他們的任何 變形，意圖在于覆蓋不排他的包含，例如，包含了一系列步驟或單元的過程、方法、系統(tǒng)、產(chǎn) 品或設(shè)備不必限于清楚地列出的那些步驟或單元，而是可包括沒有清楚地列出的或?qū)τ谶\ 些過程、方法、產(chǎn)品或設(shè)備固有的其它步驟或單元。
[0035] 首先對本發(fā)明所設(shè)及的幾個名詞進(jìn)行解釋：
[0036] plist文件:在游戲框架中，會自動把很多張游戲圖片打包成一個大圖和一個對應(yīng) 的配置文件，即屬性列表(Propedy List,簡稱:piiSt)文件，在使用的時候通過該配置文 件解析出對應(yīng)的子圖。其中，屬性列表文件是一種用來存儲序列化后的對象的文件，其文件 擴(kuò)展名為.plist,因此，通常被稱為plist文件。本文提到的plist文件是游戲框架中所使用 的一種列表文件格式。
[0037] 層疊樣式表（Cascading Style Sheets,簡稱：CSS):又稱串樣式列表、級聯(lián)樣式 表、串接樣式表、層疊樣式表、階層式樣式表，一種用來為結(jié)構(gòu)化文檔添加樣式(字體、間距 和顏色等）的計算機(jī)語言，由W3C定義和維護(hù)。其中，結(jié)構(gòu)化文檔例如為超文本標(biāo)記語言 巧yper Text Markup Language,簡稱：HTML)文檔或可擴(kuò)展標(biāo)記語言化xtensible Markup Language，簡稱:XML)應(yīng)用，等等。
[0038] 在游戲開發(fā)過程中，游戲框架自動把很多張游戲圖片打包成一個大圖和一個對應(yīng) 的配置文件，由于該打包處理，一張大圖中包含多張子圖（即上述游戲圖片），但一張大圖中 只要存在任一子圖的形狀變更，或子圖的數(shù)量變更時，打包后的大圖即發(fā)生變更，即大圖中 各個子圖的排列分布也會因子圖的變更而重新分布，因此，直接對比打包后的大圖毫無意 義，但若UI的變更判斷失誤，將可能導(dǎo)致UI顯示異常，設(shè)置客戶端閃退等諸多問題。為了避 免運些問題，本發(fā)明提供一種自動化地確定用戶界面變更的方法及裝置，用于比對開發(fā)過 程中用戶界面的變更情況。
[0039] 圖1為本發(fā)明確定用戶界面變更的方法實施例一的流程圖。該實施例提供一種確 定用戶界面變更的方法，該方法可W由確定用戶界面變更的裝置執(zhí)行，該裝置可W通過軟 件和/或硬件的方式實現(xiàn)，該裝置可W集成于例如電腦、手機(jī)等設(shè)備中。如圖1所示，該方法 包括：
[0040] S101、獲取游戲的兩個版本的用戶界面的子圖信息。
[0041] 在開發(fā)過程中，設(shè)及多次用戶界面的更新。其中，每一版本的用戶界面與該游戲中 其他版本對應(yīng)的同一用戶界面均可能存在差異。運里所說的用戶界面是指其在游戲中所發(fā) 揮的作用或?qū)?yīng)的標(biāo)識是相同的。例如，一游戲的登錄界面，在不同的版本中，都稱為登錄 界面或其發(fā)揮的作用都是進(jìn)入游戲。
[0042] 在確定要對比的兩個版本后，可W逐一比對各用戶界面，也可W對版本進(jìn)行統(tǒng)一 比對，本發(fā)明不限制每次比對的用戶界面的個數(shù)。另外，同時比對的版本也可W為Ξ個或更 多。為簡便說明，本發(fā)明W兩個版本的一個用戶界面的比對為例進(jìn)行說明。
[0043] 獲取要比對的用戶界面的子圖信息。具體地，用戶界面至少包含一個子圖，首先需 獲取該用戶界面對應(yīng)的子圖信息，例如打包該用戶界面的同時所生成的plist文件。
[0044] S102、根據(jù)子圖信息，獲得兩用戶界面分別包含的子圖。
[0045] 兩用戶界面分別包含的子圖個數(shù)可W相同或不同，即不同版本對應(yīng)同一用戶界面 的子圖有增刪等。運里進(jìn)行舉例說明，設(shè)定用戶界面1包含4個子圖，另一用戶界面2包含5個 子圖。其中，打包用戶界面1得到plist文件l，plist文件1中包含4個子圖對應(yīng)的子圖信息。 打包用戶界面2得到plist文件2，plist文件2中包含5個子圖對應(yīng)的子圖信息。
[0046] 基于上述設(shè)定，該步驟可W理解為，根據(jù)plist文件1得到的4個子圖對應(yīng)的子圖信 息，獲得用戶界面1包含的4個子圖；根據(jù)plist文件2得到的5個子圖對應(yīng)的子圖信息，獲得 用戶界面2包含的5個子圖。
[0047] S103、比對兩用戶界面中具有相同子圖標(biāo)識的子圖。
[0048] 具體地，逐一比對兩用戶界面中具有相同子圖標(biāo)識的子圖。其中，子圖標(biāo)識可W為 子圖的名稱或編號等可W唯一表征子圖的信息，在運里本發(fā)明不予限制。
[0049] S104、根據(jù)比對結(jié)果，確定用戶界面是否變更。
[0050] 其中，比對結(jié)果中包含了兩用戶界面是否存在差異的結(jié)果，若兩用戶界面存在差 異，即可確定用戶界面有變更。具體地，對于兩用戶界面是否存在差異，可通過兩用戶界面 中具有相同子圖標(biāo)識的子圖的相似度等來確定。例如，兩子圖的相似度為100%，說明兩子 圖相同；若兩子圖的相似度小于100%，說明兩子圖存在差異。
[0051] 該實施例通過獲取游戲的兩個版本的用戶界面的子圖信息，并根據(jù)子圖信息，獲 得兩用戶界面分別包含的子圖；比對兩用戶界面中具有相同子圖標(biāo)識的子圖，根據(jù)比對結(jié) 果，確定用戶界面是否變更，從而實現(xiàn)通過自動化方式確定游戲的兩個版本對應(yīng)的用戶界 面是否有更新，提高了工作效率并降低出錯率。
[0052] 可選地，在S103之后，該確定用戶界面變更的方法還可W包括：顯示比對結(jié)果。其 中，該比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo)識的子圖、子圖比對結(jié)果和用戶界面比 對結(jié)果等，W便于測試人員檢查和確認(rèn)變更的位置是否必要和合理。
[0化3] 例如，圖2示出一比對結(jié)果示例。參考圖2,比對結(jié)果包括Ξ個部分：1、標(biāo)識為"①" 的部分示出兩用戶界面的名稱及其各自對應(yīng)的plist文件的名稱和兩用戶界面各自所屬的 版本，其中，用戶界面的名稱在運里示例為"Login, png"，一用戶界面所屬的版本為 "version#18334"，其對應(yīng)的plist文件的名稱為"Login.plist"，另一用戶界面所屬的版本 為\6'3；[0]1#19391"，其對應(yīng)的口1131:文件的名稱為"1〇邑;[]1.口1131:";標(biāo)識為"(1)"的部分示出 兩用戶界面中具有相同子圖標(biāo)識的子圖及子圖名稱和子圖比對結(jié)果(表示為相似度）；標(biāo)識 為"③"的部分是兩用戶界面比對結(jié)果的總結(jié)，其可W包括存在差異的子圖的子圖標(biāo)識，用 戶點擊該子圖標(biāo)識可W鏈接至標(biāo)識為"②"部分中對應(yīng)的子圖。
[0054]在上述任一實施例中，S101可W包括:按照鍵值對列表，分別從兩用戶界面的配置 文件中獲取單個子圖的子圖信息和子圖標(biāo)識。其中，鍵值對列表中的鍵記錄用戶界面中子 圖的子圖標(biāo)識，鍵值對列表中的值記錄用戶界面中子圖的子圖信息?？蛇x地，子圖標(biāo)識可W 具體為子圖文件名，但本發(fā)明不W此為限制，子圖標(biāo)識只要能區(qū)分不同的子圖即可。
[0055] 具體地，子圖信息可W包括:子圖在用戶界面中的位置、子圖在原始子圖中的位置 及原始子圖的大小。其中，由于游戲框架在將很多張游戲圖片打包成一個大圖時，會剪切掉 游戲圖片的透明區(qū)域，因此，本發(fā)明中的子圖為剪切掉原始子圖的透明區(qū)域后得到的圖片。
[0056] 其中，子圖在用戶界面中的位置是按照用戶界面左上角為原點，記錄子圖到用戶 界面上邊的距離，和子圖到用戶界面左邊的距離;還包含子圖的尺寸，即寬和高。子圖在原 始子圖中的位置是按照原始子圖左上角為原點，記錄子圖到原始子圖上邊的距離，即子圖 在原始子圖中的縱坐標(biāo)，和子圖到原始子圖左邊的距離，即子圖在原始子圖中的橫坐標(biāo);還 包含子圖的尺寸，即子圖的高度和寬度。原始子圖的大小包括原始子圖的寬度與高度。
[0057] 另外，子圖信息還可W包括：用于表征子圖是否有旋轉(zhuǎn)的信息?？蛇x地，子圖信息 還可W包括:子圖在用戶界面中的裁剪偏移量。其中，子圖在用戶界面中的旋轉(zhuǎn)方式包括順 時針90°-種;子圖在用戶界面中的裁剪偏移量包含是水平和豎直兩個方向的裁剪偏移量。 [005引參考如下plist文件結(jié)構(gòu)示例，說明子圖信息。
[0化9]
[0060] 其中，該plist文件記錄了一用戶界面中的子圖信息?？梢?，plist文件包括至少一 個鍵值對。每個鍵值對包含一個鍵和一個值，采用標(biāo)簽對<key 乂/key〉表示鍵，而緊接其后 的標(biāo)簽對則為運個鍵所對應(yīng)的值。
[0061 ]如果值是<dictx/dict〉，則表示內(nèi)容依然是一個鍵值對；
[0062] 如果值是<3付1雌〉</3付山肖〉，則表示內(nèi)容是字符型，可W簡單理解為文字類型；
[0063] 如果值是<付116/^〉或鐘3136/〉，則表示布爾值真或布爾值假，可^理解為兩種特殊 數(shù)值a和0。
[0064] 每一個鍵值對記錄一個子圖在用戶界面中的信息。如上述plist文件結(jié)構(gòu)示例中 方框中內(nèi)容。其中，鍵里面記錄的用戶界面中子圖的文件名為"Dice.png";值里面由4個字 符型鍵值對和1個布爾型鍵值對組成，即用戶界面中子圖的子圖信息為方框中的"〈diet >……</dict>"部分。
[0065] W下是diet里面幾個參數(shù)的解釋：
[0066] 打ame: {{x,y}, {wi化h,hei曲t}}，表示子圖在用戶界面中的位置；
[0067] offset: {x，y}，表示子圖在用戶界面中的裁剪偏移量；
[0068] rotated: true/化Ise，用于表征子圖是否有旋轉(zhuǎn)的信息；
[0069] sourceColorRect: {{x,y}, {wi化h,hei曲t}}，表示子圖在原始子圖中的位置；
[0070] sourceSize: {wi化h,height}，表示原始子圖的大小。
[0071] 參考圖3,右下角是一個打包好的用戶界面，用戶界面中的黑色區(qū)域是裁剪透明區(qū) 域后的子圖；左上角為原始子圖，原始子圖中的黑色區(qū)域與用戶界面中的黑色區(qū)域相同。圖 3還示出上述幾個參數(shù)的具體含義，此處不再寶述。
[0072] 由于打包用戶界面時會將原始子圖的透明區(qū)域剪切掉，所W為了表現(xiàn)透明區(qū)域， 從用戶界面中樞出子圖后，需根據(jù)實際情況將子圖填充到原始子圖大小的區(qū)域里面，W還 原原始子圖。
[0073] 在上述實施例的基礎(chǔ)上，S102可W包括:根據(jù)原始子圖的大小和子圖在原始子圖 中的位置，獲得子圖信息對應(yīng)的子圖的CSS樣式參數(shù);根據(jù)用戶界面和子圖在用戶界面中的 位置，獲得第一子圖；將第一子圖設(shè)置在CSS樣式參數(shù)表征的第一塊標(biāo)簽上，得到用戶界面 包含的一子圖。
[0074] 進(jìn)一步地，上述根據(jù)原始子圖的大小和子圖在原始子圖中的位置，獲得子圖信息 對應(yīng)的子圖的CSS樣式參數(shù)，可W具體為:將原始子圖的寬度與二倍邊框線寬度進(jìn)行求和， 獲得CSS樣式參數(shù)中的寬度;將原始子圖的高度與二倍邊框線寬度進(jìn)行求和，獲得CSS樣式 參數(shù)中的高度;根據(jù)子圖在原始子圖中的位置，確定CSS樣式參數(shù)中的上留白及左留白；將 原始子圖的高度與子圖在原始子圖中的縱坐標(biāo)的差值，再減去子圖的高度，獲得CSS樣式參 數(shù)中的下留白；將原始子圖的寬度與子圖在原始子圖中的橫坐標(biāo)的差值，再減去子圖的寬 度，獲得CSS樣式參數(shù)中的右留白。
[0075] a.定義原始子圖的邊框。
[0076] 圖4為CSS樣式參數(shù)的介紹。其中：
[0077] CSS樣式參數(shù)中的寬度wi化h:互=sou;rceSize.w+2(邊框線寬度為l);
[0078] CSS樣式參數(shù)中的高度height:b=sourceSize.h+2(邊框線寬度為1);
[00巧]CSS 樣式參數(shù)中的上留白 padding-top :pt = sou：TceColorRect.y;
[0080] CSS 樣式參數(shù)中的左留白 padding-left: pi = sou：TceColorRect.x;
[0081 ] CSS 樣式參數(shù)中的右留白 padding-right : pr = sourceSize .w- sourceColorRect.x-sourceColorRect.w;
[0082] CSS 樣式參數(shù)中的下留白 padding-bottom : pb = sourceSize . h- sourceColorRect.y-sourceColorRect.h。
[0083] 所W，原始子圖的邊框的CSS樣式參數(shù)為:width:哩x;hei曲t:畦X;padding:站px plpx pbpx prpxo
[0084] 下面是實際的例子，首先plist文件的定義如下：sourceSize.w=147 ; sourceSize .h = 60 ； sourceColorRect. x = 8 ； sourceColorRect. y = 7 ； sourceColorRect. w = 131 ;sourceColorRect.h = 46。
[00 化]經(jīng)過計算得到:互=147+2 = 149 古=60+2 = 62 ；pt = 7 ;些=147-131-8 = 8;幽=60- 46-7 = 7 ;虹=8 ;得到原始子圖的邊框的CSS樣式參數(shù)為：width : 149￡x; height: 62￡x ; p曰dding:7px 8px 7px 8px〇
[0086] 為了直觀表示，已經(jīng)將實際裁剪后的子圖用黑色區(qū)域代替，可W看到黑色區(qū)域的 上下左右分別留了7px 8px 7px 8px的空白區(qū)域，圖5示出實際裁剪效果（即第一塊標(biāo)簽）。
[0087] b.獲得第一子圖。
[0088] 對于打ame: {{x,y}, {wi化h,hei曲t}}，那么對應(yīng)的樞圖CSS代碼為：
[0089] 背景圖片background-imageiurK '/site_media/Login_common_36453.png'）；
[0090] 寬度 wi 化 h:w =打 ame .wi 化 h;
[0091] 高度 height :h =打ame. height;
[0092] 背景圖片 X軸偏移background-pos i t ion-x: bpx = -f rame. X;
[0093] 背景圖片y 軸偏移 background-position-y: bpy = -frame. y;
[0094] 所有設(shè)置完的css樣式參數(shù)為：
[0095] back邑round-ima邑e:url('/site_media/Lo邑in_common_36453.pn邑'）；width:wpx; height:hpx;b3ckground-position:bxpxbypx。
[0096] 運里要特別注意的一點是：如果圖片有旋轉(zhuǎn)過的話，width和height的數(shù)值要對 調(diào)。
[0097] 還是上面那個例子，從piist文件中得到打ame .width = 131;frame .height = 46; ;1^招111日.義=736;打日111日.7 = 496，而且沒有旋轉(zhuǎn)。經(jīng)過計算得到：￥=131;11 = 46;13邱義=-736; bypx = -496;得到設(shè)置完的css樣式參數(shù)：background-image :u;rl ('/site_media/Login_ common_36453. png '）；width:131px;height:46px;background-position:-736px-496px。
[0098] 從而，根據(jù)用戶界面和子圖在用戶界面中的位置，獲得第一子圖。
[0099] C.將第一子圖設(shè)置在CSS樣式參數(shù)表征的第一塊標(biāo)簽上，得到用戶界面包含的一 子圖，效果如圖6所示，即將第一子圖填充在圖5所示的黑色區(qū)域內(nèi)。
[0100] 需說明的是，通過上述實現(xiàn)方式得到用戶界面包含的一子圖是為了保證最后得到 的效果圖和原始子圖一致，也就是最終在程序中使用的圖片一致。如果直接使用a.中的CSS 樣式參數(shù)在用戶界面上樞圖，得到的結(jié)果會帶上周圍其他子圖的內(nèi)容，具體如圖7所示。
[0101] 若用于表征子圖是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)，則上述根據(jù)用戶界面和子圖 在用戶界面中的位置，獲得第一子圖之后，該方法還可W包括:將第一子圖W旋轉(zhuǎn)基點為基 準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度。該設(shè)定角度為打包用戶界面時，該第一子圖所旋轉(zhuǎn)的角度。旋轉(zhuǎn) 基點的橫縱坐標(biāo)均為子圖的高度的二分之一。
[0102] 打包的時候，打包工具有時候會把圖片順時針旋轉(zhuǎn)90°，W縮小打包之后的用戶界 面的大小。在打包生成的plist文件中添加<467〉1'〇1曰16(1</467〉<付116/〉來表示子圖是否有 旋轉(zhuǎn)，并且只有順時針旋轉(zhuǎn)90° -種方式。所W，在解析到上述旋轉(zhuǎn)標(biāo)記時，只需要把旋轉(zhuǎn)過 的圖片逆時針旋轉(zhuǎn)90°，即可還原原始子圖的真實角度。
[0103] 將第一子圖W旋轉(zhuǎn)基點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，該特征可W通過CSS3的旋 轉(zhuǎn)（rotate)功能實現(xiàn)。CSS3 的旋轉(zhuǎn)設(shè)及兩個參數(shù) transform :;ro1:ate(-90deg)和 transform- origin: 25.5px 25.5px，其中，前者是旋轉(zhuǎn)角度:-90°表示逆時針旋轉(zhuǎn)90° ;后者是旋轉(zhuǎn)基 點，就是圖片旋轉(zhuǎn)時中屯、點的坐標(biāo)。運里僅示例說明設(shè)定角度，本發(fā)明實施例不W此為限 審IJ，例如，當(dāng)打包圖片是旋轉(zhuǎn)其他角度，在獲取第一子圖之后需逆方向旋轉(zhuǎn)該其他角度。
[0104] 如圖8所示，實線長方形表示子圖，需要將該子圖旋轉(zhuǎn)到虛線長方形的位置，則旋 轉(zhuǎn)基點就是陰影部分運個正方形的中屯、點。運樣的話，transform-origin的屬性就是 frame.h/2px frame.h/2px〇
[0105] W上通過具體實施例說明用戶界面中子圖的獲取過程，接下來詳細(xì)說明兩用戶界 面中具有相同子圖標(biāo)識的子圖的比對過程。
[0106] -種實現(xiàn)方式中，S103可W包括:獲得兩用戶界面中具有相同子圖標(biāo)識的子圖的 直方圖向量及兩個直方圖向量之間的距離;若兩個直方圖向量的距離為零，則確定具有相 同子圖標(biāo)識的子圖的相似度為100%。例如，兩個直方圖向量之間的距離可采用計算兩個直 方圖向量的均方根的形式獲得，但本發(fā)明不局限于此。
[0107] 進(jìn)一步地，S103還可W包括:若兩個直方圖向量的距離不為零，則分別將具有相同 子圖標(biāo)識的子圖進(jìn)行像素點歸一化，得到第一向量和第二向量;根據(jù)第一向量和第二向量 的點積，得到兩用戶界面中具有相同子圖標(biāo)識的子圖的相似度。該實施例中，像素點歸一化 是指對子圖中紅、綠、藍(lán)W及透明像素求平均值，將子圖轉(zhuǎn)換成一向量。
[0108] 例如，游戲框架Cocos2d-x提供了 Cocos2d-HTML5引擎，是用腳本語言化vaScript 編寫的，最大化保留了引擎的性能，并且應(yīng)用程序編程接口（Application Programming Interface，簡稱:API)與游戲框架Cocos2cl非常接近。該Cocos2d-HTML5引擎是利用HTML5中 畫圖（Canvas)技術(shù)和JavaScript實現(xiàn)的。采用Canvas和JavaScript技術(shù)理論上也可W替代 本文的技術(shù)完成用戶界面對比工具，本專利技術(shù)方案的應(yīng)用不限定具體的游戲框架或引 擎，運里不再寶述。
[0109] 圖9為本發(fā)明確定用戶界面變更的裝置實施例一的結(jié)構(gòu)示意圖。如圖9所示，確定 用戶界面變更的裝置90包括:第一獲取模塊91、第二獲取模塊92、比對模塊93和確定模塊 94。
[0110] 其中，第一獲取模塊91用于獲取游戲的兩個版本的用戶界面的子圖信息。第二獲 取模塊92用于根據(jù)子圖信息，獲得兩用戶界面分別包含的子圖。比對模塊93用于比對兩用 戶界面中具有相同子圖標(biāo)識的子圖。確定模塊94用于根據(jù)比對結(jié)果，確定用戶界面是否變 更。
[0111] 本實施例的裝置，可W用于執(zhí)行圖1所示方法實施例的技術(shù)方案，其實現(xiàn)原理和技 術(shù)效果類似，此處不再寶述。
[0112] 可選地，確定用戶界面變更的裝置90還可W包括:顯示模塊95。該顯示模塊95用于 顯示比對結(jié)果，其中，該比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo)識的子圖、子圖比對結(jié) 果和用戶界面比對結(jié)果。
[0113] 在上述實施例的基礎(chǔ)上，第一獲取模塊91可具體用于:按照鍵值對列表，分別從兩 用戶界面的配置文件中獲取單個子圖的子圖信息和子圖標(biāo)識。其中，鍵值對列表中的鍵記 錄用戶界面中子圖的子圖標(biāo)識，鍵值對列表中的值記錄用戶界面中子圖的子圖信息。
[0114] 在上述實施例中，子圖信息可W包括:子圖在用戶界面中的位置、子圖在原始子圖 中的位置及原始子圖的大小，其中，子圖為剪切掉原始子圖的透明區(qū)域后得到的圖片。第二 獲取模塊92可具體用于:根據(jù)原始子圖的大小和子圖在原始子圖中的位置，獲得子圖信息 對應(yīng)的子圖的CSS樣式參數(shù);根據(jù)用戶界面和子圖在用戶界面中的位置，獲得第一子圖；將 第一子圖設(shè)置在css樣式參數(shù)表征的第一塊標(biāo)簽上，得到用戶界面包含的一子圖。
[0115] 進(jìn)一步地，原始子圖的大小包括原始子圖的寬度與高度。子圖在原始子圖中的位 置包括子圖在原始子圖中的縱坐標(biāo)、橫坐標(biāo)、子圖的高度和寬度?；诖耍瑒t第二獲取模塊 92還可W用于:將原始子圖的寬度與二倍邊框線寬度進(jìn)行求和，獲得CSS樣式參數(shù)中的寬 度;將原始子圖的高度與二倍邊框線寬度進(jìn)行求和，獲得CSS樣式參數(shù)中的高度;根據(jù)子圖 在原始子圖中的位置，確定CSS樣式參數(shù)中的上留白及左留白；將原始子圖的高度與子圖在 原始子圖中的縱坐標(biāo)的差值，再減去子圖的高度，獲得CSS樣式參數(shù)中的下留白；將原始子 圖的寬度與子圖在原始子圖中的橫坐標(biāo)的差值，再減去子圖的寬度，獲得CSS樣式參數(shù)中的 右留白。
[0116] 另外，子圖信息還可W包括：用于表征子圖是否有旋轉(zhuǎn)的信息。若該用于表征子圖 是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)，則第二獲取模塊92還可W用于:將第一子圖W旋轉(zhuǎn)基 點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，該設(shè)定角度為打包用戶界面時，第一子圖所旋轉(zhuǎn)的角度， 旋轉(zhuǎn)基點的橫縱坐標(biāo)均為子圖的高度的二分之一。
[0117] 可選地，比對模塊93可具體用于：獲得兩用戶界面中具有相同子圖標(biāo)識的子圖的 直方圖向量及兩個直方圖向量之間的距離;若兩個直方圖向量的距離為零，則確定具有相 同子圖標(biāo)識的子圖的相似度為100 %。
[0118] 作為本發(fā)明的一種實現(xiàn)方式，比對模塊93還可W用于:若兩個直方圖向量的距離 不為零，則分別將具有相同子圖標(biāo)識的子圖進(jìn)行像素點歸一化，得到第一向量和第二向量； 根據(jù)第一向量和第二向量的點積，得到兩用戶界面中具有相同子圖標(biāo)識的子圖的相似度。
[0119] 本發(fā)明通過獲取游戲的兩個版本的用戶界面的子圖信息，并根據(jù)子圖信息，獲得 兩用戶界面分別包含的子圖；比對兩用戶界面中具有相同子圖標(biāo)識的子圖，根據(jù)比對結(jié)果， 確定用戶界面是否變更，從而實現(xiàn)通過自動化方式確定游戲的兩個版本對應(yīng)的用戶界面是 否有更新，提高了工作效率并降低出錯率。
[0120] 圖10為本發(fā)明確定用戶界面變更的裝置實施例二的結(jié)構(gòu)示意圖。參照圖10,確定 用戶界面變更的裝置100包括:處理器110和存儲器120。
[0121] 具體地，存儲器120存儲處理器110的可執(zhí)行指令，當(dāng)確定用戶界面變更的裝置100 運行時，處理器110與存儲器120之間通信，處理器110調(diào)用存儲器120中的可執(zhí)行指令，用于 執(zhí)行上述任一方法實施例。
[0122] 本實施例的裝置，可W用于執(zhí)行上述任一方法實施例的技術(shù)方案，其實現(xiàn)原理和 技術(shù)效果類似，此處不再寶述。
[0123] 本領(lǐng)域普通技術(shù)人員可W理解:實現(xiàn)上述各方法實施例的全部或部分步驟可W通 過程序指令相關(guān)的硬件來完成。前述的程序可W存儲于一計算機(jī)可讀取存儲介質(zhì)中。該程 序在執(zhí)行時，執(zhí)行包括上述各方法實施例的步驟;而前述的存儲介質(zhì)包括:R〇M、RAM、磁碟或 者光盤等各種可W存儲程序代碼的介質(zhì)。
[0124] 最后應(yīng)說明的是：W上各實施例僅用W說明本發(fā)明的技術(shù)方案，而非對其限制;盡 管參照前述各實施例對本發(fā)明進(jìn)行了詳細(xì)的說明，本領(lǐng)域的普通技術(shù)人員應(yīng)當(dāng)理解:其依 然可W對前述各實施例所記載的技術(shù)方案進(jìn)行修改，或者對其中部分或者全部技術(shù)特征進(jìn) 行等同替換；而運些修改或者替換，并不使相應(yīng)技術(shù)方案的本質(zhì)脫離本發(fā)明各實施例技術(shù) 方案的范圍。
【主權(quán)項】
1. 一種確定用戶界面變更的方法，其特征在于，包括： 獲取游戲的兩個版本的用戶界面的子圖信息； 根據(jù)所述子圖信息，獲得兩用戶界面分別包含的子圖； 比對兩用戶界面中具有相同子圖標(biāo)識的子圖； 根據(jù)比對結(jié)果，確定所述用戶界面是否變更。2. 根據(jù)權(quán)利要求1所述的方法，其特征在于，所述比對兩用戶界面中具有相同子圖標(biāo)識 的子圖之后，還包括： 顯示比對結(jié)果，其中，所述比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo)識的子圖、子圖 比對結(jié)果和所述用戶界面比對結(jié)果。3. 根據(jù)權(quán)利要求1所述的方法，其特征在于，所述獲取游戲的兩個版本的用戶界面的子 圖信息，包括： 按照鍵值對列表，分別從兩用戶界面的配置文件中獲取單個子圖的子圖信息和子圖標(biāo) 識，其中，所述鍵值對列表中的鍵記錄用戶界面中子圖的子圖標(biāo)識，所述鍵值對列表中的值 記錄用戶界面中子圖的子圖信息。4. 根據(jù)權(quán)利要求1所述的方法，其特征在于，所述子圖信息包括:子圖在用戶界面中的 位置、子圖在原始子圖中的位置及所述原始子圖的大小，其中，子圖為剪切掉原始子圖的透 明區(qū)域后得到的圖片； 所述根據(jù)所述子圖信息，獲得兩用戶界面分別包含的子圖，包括： 根據(jù)所述原始子圖的大小和所述子圖在原始子圖中的位置，獲得所述子圖信息對應(yīng)的 子圖的層疊樣式表CSS樣式參數(shù)； 根據(jù)用戶界面和所述子圖在用戶界面中的位置，獲得第一子圖； 將所述第一子圖設(shè)置在所述CSS樣式參數(shù)表征的第一塊標(biāo)簽上，得到用戶界面包含的 一子圖。5. 根據(jù)權(quán)利要求4所述的方法，其特征在于，所述原始子圖的大小包括原始子圖的寬度 與高度，所述子圖在原始子圖中的位置包括子圖在原始子圖中的縱坐標(biāo)、橫坐標(biāo)、所述子圖 的高度和寬度，則所述根據(jù)所述原始子圖的大小和所述子圖在原始子圖中的位置，獲得所 述子圖信息對應(yīng)的子圖的CSS樣式參數(shù)，包括： 將所述原始子圖的寬度與二倍邊框線寬度進(jìn)行求和，獲得所述CSS樣式參數(shù)中的寬度； 將所述原始子圖的高度與二倍邊框線寬度進(jìn)行求和，獲得所述CSS樣式參數(shù)中的高度； 根據(jù)所述子圖在原始子圖中的位置，確定所述CSS樣式參數(shù)中的上留白及左留白； 將所述原始子圖的高度與所述子圖在原始子圖中的縱坐標(biāo)的差值，再減去所述子圖的 高度，獲得所述CSS樣式參數(shù)中的下留白； 將所述原始子圖的寬度與所述子圖在原始子圖中的橫坐標(biāo)的差值，再減去所述子圖的 寬度，獲得所述CSS樣式參數(shù)中的右留白。6. 根據(jù)權(quán)利要求4或5所述的方法，其特征在于，所述子圖信息還包括：用于表征子圖是 否有旋轉(zhuǎn)的信息，若所述用于表征子圖是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)，則所述根據(jù)用 戶界面和所述子圖在用戶界面中的位置，獲得第一子圖之后，還包括： 將所述第一子圖以旋轉(zhuǎn)基點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，所述設(shè)定角度為打包所述 用戶界面時，所述第一子圖所旋轉(zhuǎn)的角度，所述旋轉(zhuǎn)基點的橫縱坐標(biāo)均為所述子圖的高度 的二分之一。7. 根據(jù)權(quán)利要求1~5中任一項所述的方法，其特征在于，所述比對兩用戶界面中具有 相同子圖標(biāo)識的子圖，包括： 獲得所述兩用戶界面中具有相同子圖標(biāo)識的子圖的直方圖向量及兩個直方圖向量之 間的距離； 若兩個直方圖向量的距離為零，則確定所述具有相同子圖標(biāo)識的子圖的相似度為 100%〇8. 根據(jù)權(quán)利要求7所述的方法，其特征在于，所述比對兩用戶界面中具有相同子圖標(biāo)識 的子圖，還包括： 若所述兩個直方圖向量的距離不為零，則分別將所述具有相同子圖標(biāo)識的子圖進(jìn)行像 素點歸一化，得到第一向量和第二向量； 根據(jù)所述第一向量和所述第二向量的點積，得到所述兩用戶界面中具有相同子圖標(biāo)識 的子圖的相似度。9. 一種確定用戶界面變更的裝置，其特征在于，包括： 第一獲取模塊，用于獲取游戲的兩個版本的用戶界面的子圖信息； 第二獲取模塊，用于根據(jù)所述子圖信息，獲得兩用戶界面分別包含的子圖； 比對模塊，用于比對兩用戶界面中具有相同子圖標(biāo)識的子圖； 確定模塊，用于根據(jù)比對結(jié)果，確定所述用戶界面是否變更。10. 根據(jù)權(quán)利要求9所述的裝置，其特征在于，還包括： 顯示模塊，用于顯示比對結(jié)果，其中，所述比對結(jié)果包括兩用戶界面中具有相同子圖標(biāo) 識的子圖、子圖比對結(jié)果和所述用戶界面比對結(jié)果。11. 根據(jù)權(quán)利要求9所述的裝置，其特征在于，所述第一獲取模塊具體用于： 按照鍵值對列表，分別從兩用戶界面的配置文件中獲取單個子圖的子圖信息和子圖標(biāo) 識，其中，所述鍵值對列表中的鍵記錄用戶界面中子圖的子圖標(biāo)識，所述鍵值對列表中的值 記錄用戶界面中子圖的子圖信息。12. 根據(jù)權(quán)利要求9所述的裝置，其特征在于，所述子圖信息包括:子圖在用戶界面中的 位置、子圖在原始子圖中的位置及所述原始子圖的大小，其中，子圖為剪切掉原始子圖的透 明區(qū)域后得到的圖片； 所述第二獲取模塊具體用于:根據(jù)所述原始子圖的大小和所述子圖在原始子圖中的位 置，獲得所述子圖信息對應(yīng)的子圖的層疊樣式表CSS樣式參數(shù);根據(jù)用戶界面和所述子圖在 用戶界面中的位置，獲得第一子圖；將所述第一子圖設(shè)置在所述CSS樣式參數(shù)表征的第一塊 標(biāo)簽上，得到用戶界面包含的一子圖。13. 根據(jù)權(quán)利要求12所述的裝置，其特征在于，所述原始子圖的大小包括原始子圖的寬 度與高度，所述子圖在原始子圖中的位置包括子圖在原始子圖中的縱坐標(biāo)、橫坐標(biāo)、所述子 圖的高度和寬度，則所述第二獲取模塊還用于： 將所述原始子圖的寬度與二倍邊框線寬度進(jìn)行求和，獲得所述CSS樣式參數(shù)中的寬度； 將所述原始子圖的高度與二倍邊框線寬度進(jìn)行求和，獲得所述CSS樣式參數(shù)中的高度； 根據(jù)所述子圖在原始子圖中的位置，確定所述CSS樣式參數(shù)中的上留白及左留白； 將所述原始子圖的高度與所述子圖在原始子圖中的縱坐標(biāo)的差值，再減去所述子圖的 高度，獲得所述css樣式參數(shù)中的下留白； 將所述原始子圖的寬度與所述子圖在原始子圖中的橫坐標(biāo)的差值，再減去所述子圖的 寬度，獲得所述CSS樣式參數(shù)中的右留白。14. 根據(jù)權(quán)利要求12或13所述的裝置，其特征在于，所述子圖信息還包括：用于表征子 圖是否有旋轉(zhuǎn)的信息，若所述用于表征子圖是否有旋轉(zhuǎn)的信息表示子圖有旋轉(zhuǎn)，則所述第 二獲取模塊還用于： 將所述第一子圖以旋轉(zhuǎn)基點為基準(zhǔn)沿逆方向旋轉(zhuǎn)設(shè)定角度，所述設(shè)定角度為打包所述 用戶界面時，所述第一子圖所旋轉(zhuǎn)的角度，所述旋轉(zhuǎn)基點的橫縱坐標(biāo)均為所述子圖的高度 的二分之一。15. 根據(jù)權(quán)利要求9~13中任一項所述的裝置，其特征在于，所述比對模塊具體用于： 獲得所述兩用戶界面中具有相同子圖標(biāo)識的子圖的直方圖向量及兩個直方圖向量之 間的距離； 若兩個直方圖向量的距離為零，則確定所述具有相同子圖標(biāo)識的子圖的相似度為 100%〇16. 根據(jù)權(quán)利要求15所述的裝置，其特征在于，所述比對模塊還用于： 若所述兩個直方圖向量的距離不為零，則分別將所述具有相同子圖標(biāo)識的子圖進(jìn)行像 素點歸一化，得到第一向量和第二向量； 根據(jù)所述第一向量和所述第二向量的點積，得到所述兩用戶界面中具有相同子圖標(biāo)識 的子圖的相似度。
【文檔編號】G06F9/44GK105824627SQ201610147249
【公開日】2016年8月3日
【申請日】2016年3月15日
【發(fā)明人】招成林, 趙春玉
【申請人】網(wǎng)易（杭州）網(wǎng)絡(luò)有限公司