一種用戶界面的拉伸控制的方法
【專利摘要】本發明公開了一種用戶界面的拉伸控制的方法，包括：在皮膚圖片上通過用于標示拉伸位置的可視化標識繪制所述拉伸區域；監視到對所述皮膚圖片存在拉伸需求時，識別所述皮膚圖片的可視化標識從而獲得拉伸區域，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸。本發明于拉伸控制的可視化標識直接由圖片攜帶，以此替代數據文件，極大地方便了使用。
【專利說明】一種用戶界面的拉伸控制的方法
[0001]本發明專利申請是申請日為2011年9月29日、申請號為201110305017.4、名稱為“一種用戶界面的拉伸控制的方法”的中國發明專利申請的分案申請。
【技術領域】
[0002]本發明屬于計算機領域，具體地說，涉及一種用戶界面的拉伸控制的方法。
【背景技術】
[0003]如今，在用戶終端上安裝有各種各樣的客戶端軟件，每種客戶端軟件都有各自的用戶界面，通過用戶界面完成客戶端軟件與用戶的交互，可以說用戶界面就是客戶端軟件的門戶。
[0004]軟件廠家通常都會為用戶界面設計皮膚，皮膚的設計在考慮美觀的同時，還要兼顧用戶界面上皮膚組件擺放布局的合理使用，同時還要仔細設計拉伸方案。設計者在設計皮膚時，往往首先會設計出適合用戶界面的皮膚圖片；之后再針對皮膚圖片編寫一個數據文件，這個數據文件中會以代碼或者數據表格的形式記錄在皮膚圖片上拉伸控制的參數，比如；拉伸區域、拉伸比例。這個數據文件對于普通用戶來說是很難看懂的，但是電腦程序可以識別，要將所屬皮膚加載到用戶界面時，由電腦程序讀取數據文件獲知皮膚圖片在拉伸時如何處理。
[0005]可以看到，數據文件的編寫在皮膚設計中是絕對的核心操作，但是其編寫的復雜程度可想而知，而且所編寫的數據非常繁瑣，導致容易出現錯誤，為皮膚設計帶來了很大的難度。
[0006]從另一方面考慮，如果用戶希望通過自定義的方式來自己設計皮膚的拉伸控制，數據文件的編寫這種過于專業性的操作，導致用戶自定義模式基本上不可實現。
[0007]因此需要提供一種方式，能使皮膚的拉伸控制設計變得簡單高效，尤其是使數據文件的編寫這種專業操作變得相對友好、直觀，對于任何人而言，無論是普通用戶還是專業設計人員都不需要專業技術就可以進行拉伸控制的設計。
【發明內容】
[0008]有鑒于此，本發明所要解決的技術問題是提供了一種用戶界面的拉伸控制的方法，使得用于拉伸控制的可視化標識直接由圖片攜帶，以此替代數據文件，極大地方便了使用。
[0009]為了解決上述技術問題，本發明公開了一種用戶界面的拉伸控制的方法，包括:在皮膚圖片上通過用于標示拉伸位置的可視化標識繪制所述拉伸區域；監視到對所述皮膚圖片存在拉伸需求時，識別所述皮膚圖片的可視化標識從而獲得拉伸區域，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸。
[0010]進一步地，所述可視化標識，包括:沿所述背景圖片的縱向延伸的一對或多對平行線和/或沿所述背景圖片的橫向延伸的一對或多對平行線。[0011]進一步地，所述平行線使用所述皮膚圖片上所占用面積小于一閾值的顏色和/或透明度來標明，每對平行線之間使用不同的顏色和/或透明度來區別。
[0012]進一步地，識別所述皮膚圖片的可視化標識從而獲得拉伸區域的步驟，包括:識別沿所述皮膚圖片的縱向延伸的平行線，每對平行線之間相夾的部分為橫向的拉伸區域；和/或，識別沿所述皮膚圖片的橫向延伸的平行線，每對平行線之間相夾的部分為縱向的拉伸區域。
[0013]進一步地，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，包括:當存在多個拉伸區域時，對各拉伸區域設置權重；監視到對所述皮膚圖片存在拉伸需求時，針對權重給每個拉伸區域分配相應的拉伸比例,權重越高的拉伸區域,其分配的拉伸比例越大。
[0014]進一步地，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，包括:監視到對所述皮膚圖片存在拉伸需求時，針對多個拉伸區域等比例分配拉伸尺寸。
[0015]進一步地，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，包括:處于所述拉伸區域外的皮膚圖片保持不變。
[0016]進一步地，還包括:所述平行線將所述皮膚圖片劃分為若干區域并依次編號，所述區域不包括所述平行線本身；依據所述編號的順序將對應的區域內的皮膚圖片的邊界直接拼接，重新組合得到不包含所述平行線的皮膚圖片并顯示。
[0017]與現有的方案相比，本發明所獲得的技術效果:
[0018]I)可視化標識直接由圖片攜帶，以此替代數據文件，極大地方便了使用，而可視化標識作為一種信息可讀性極強，對于用戶容易識別，對于電腦程序識別也是非常方便的。
[0019]2)標注繪制的操作本身相對編寫數據文件更為簡單，顯示效果更為直觀，用戶可以輕松了解皮膚圖片的拉伸布置。
[0020]3)應用可視化標識直接在皮膚圖片上進行標明，使得繪制拉伸區域變得簡單直觀，因此便于專業設計，有利于普通用戶的自定義設計。
[0021]4)通過分區域組合的皮膚圖片的顯示方式使得可視化標識不會顯示出來，保證皮膚圖片不會被破壞。
[0022]5)使用多個拉伸區域，按其拉伸所產生的變形影響設置權重，分層次消化拉伸帶來的圖片變形，提升拉伸后的顯示效果。
[0023]6)使皮膚圖片變形的節奏一致，這樣圖片整體變形效果均勻，拉伸后原圖的美感的破壞相對較小。
【專利附圖】
【附圖說明】
[0024]圖1為本發明整體方案的方法流程圖；
[0025]圖2為本發明顯示皮膚圖片的方法流程圖；
[0026]圖3為本發明顯示皮膚圖片的操作示意圖。
【具體實施方式】
[0027]以下將配合圖式及實施例來詳細說明本發明的實施方式，藉此對本發明如何應用技術手段來解決技術問題并達成技術功效的實現過程能充分理解并據以實施。
[0028]本發明的核心構思在于:使用皮膚圖片攜帶可視化標識，以此替代數據文件。[0029]所述可視化標識，包括:沿所述背景圖片的縱向延伸的一對或多對平行線和/或沿所述背景圖片的橫向延伸的一對或多對平行線；所述平行線使用所述皮膚圖片上所占用面積小于一閾值的顏色和/或透明度來標明，每對平行線之間使用不同的顏色和/或透明度來區別，優選采用皮膚圖片上沒有出現的顏色和/或透明度，即閾值取O。可視化標識更直觀簡單，對于電腦程序和普通用戶來說都是可讀的。
[0030]以下以一實施例對本發明的整體方案進行說明。如圖1所示，執行如下操作:
[0031]步驟100，在皮膚圖片上通過用于標示拉伸位置的可視化標識繪制拉伸區域；
[0032]在實際使用中，可以使用色塊、色條或者帶有顏色的線段、帶有透明度的條狀、線段等來標出皮膚圖片上的拉伸區域；標示拉伸位置一般可以通過標示拉伸區域的邊界來實現。
[0033]這里需要說明的是，可視化標識是使用可視化手段進行標注的標識。I)在極端情況下，可以肉眼不可讀而電腦程序可讀(用肉眼不可識別的色差或者透明度差別標識，或者肉眼不可識別的尺寸標出)，但是一般是用作特殊用途，但是標注繪制這個操作本身相對編寫數據文件是非常簡單直觀；2)但是一般來說它對于肉眼和電腦程序都可讀，這樣不僅標注繪制這個操作本身相對編寫數據文件是非常簡單直觀，顯示效果上就更為直觀了，用戶可以輕松了解組件布局在皮膚上的反映。
[0034]步驟200，監視到對所述皮膚圖片存在拉伸需求時，識別所述皮膚圖片的可視化標識從而獲得拉伸區域，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸；
[0035]I)識別所述皮膚圖片的可視化標識從而獲得拉伸區域
[0036]因為拉伸區域一般是按橫向和縱向分別標處，具體可以通過如下方式實現:識別沿所述皮膚圖片的縱向延伸的平行線，每對平行線之間相夾的部分為橫向的拉伸區域；和/或，識別沿所述皮膚圖片的橫向延伸的平行線，每對平行線之間相夾的部分為縱向的拉伸區域；
[0037]2)僅針對處于所述拉伸區域內的皮膚圖片進行拉伸
[0038]監視到對所述皮膚圖片存在橫向的拉伸需求時，針對所述橫向的拉伸區域內的皮膚圖片進行橫向拉伸，所述橫向的拉伸區域外的皮膚圖片保持不變，從而完成所述皮膚圖片的橫向拉伸；
[0039]監視到對所述皮膚圖片存在縱向的拉伸需求時，針對所述縱向的拉伸區域內的皮膚圖片進行縱向拉伸，所述縱向的拉伸區域外的皮膚圖片保持不變，從而完成所述皮膚圖片的縱向拉伸；
[0040]監視到對所述皮膚圖片同時存在橫向和縱向的拉伸需求時，可以先依上述方式進行縱向拉伸，再進行橫向拉伸；也可以先依上述方式進行橫向拉伸，再進行縱向拉伸。
[0041]針對步驟200的中拉伸操作，還存在多種策略:
[0042]I)分層次拉伸
[0043]當存在多個拉伸區域時，對各拉伸區域設置權重；監視到對所述皮膚圖片存在拉伸需求時，針對權重給每個拉伸區域分配相應的拉伸比例，權重越高的拉伸區域，其分配的拉伸比例越大。
[0044]分層次拉伸的意義在于——對于一些色彩充盈、構圖飽滿的圖片來說，其圖片內容沒有留下易于拉伸使用的區域，例如色彩單一、拉伸后變形不明顯的區域；這樣為了避免對于某塊拉伸區域拉伸比例過大導致拉伸區域內的圖片變形嚴重，與周邊配合不協調，影響顯示效果，則可以使用多個拉伸區域，按其拉伸所產生的變形影響設置權重，變形對全圖還是有一定影響的，則應盡量少拉伸，因此權重設置較低，變形對全圖片影響很小的，則應盡量多拉伸，因此權重設置較高；通過這種方式，分層次消化拉伸帶來的圖片變形，提升拉伸后的顯示效果。
[0045]2)等比例拉伸
[0046]監視到對所述皮膚圖片存在拉伸需求時，針對多個拉伸區域等比例分配拉伸尺寸。
[0047]分層次拉伸的意義在于——可以使變形的節奏一致，這樣圖片整體變形效果均勻，拉伸后原圖的美感的破壞相對小一些。
[0048]另外，在步驟100中對皮膚圖片繪制完拉伸區域后，皮膚圖片在正常顯示時需要考慮避免所繪制的可視化標識被顯示出來破壞皮膚圖片；而在步驟200中對皮膚圖片進行拉伸后進行顯示時也需要考慮避免所繪制的可視化標識被顯示出來破壞皮膚圖片。
[0049]可以通過以下方式來避免所繪制的可視化標識被顯示出來，如圖2所示，包括以下步驟:
[0050]步驟301，所述平行線將所述皮膚圖片劃分為若干區域并依次編號，所述區域不包括所述平行線本身；
[0051]步驟302，依據所述編號的順序將對應的區域內的皮膚圖片的邊界直接拼接，重新組合得到不包含所述平行線的皮膚圖片并顯示。
[0052]例如，如圖3所示，對一皮膚圖片分別在縱向和橫向使用兩條平行線繪制出拉伸區域，這樣所述皮膚圖片就被這些平行線分為了 9塊區域，可以對這9塊區域分別編號1-9，需要注意的是，這些區域最終被讀取的是區域內的皮膚圖片，這些區域并不包括平行線本身；
[0053]在顯示所述皮膚圖片時，依據所述編號的順序將對應的區域內的皮膚圖片再組合起來，這些區域不包括所述平行線，這些區域內的皮膚圖片的邊界直接拼接，這樣就可以得到不包含所述平行線的皮膚圖片并顯示出來，當這些平行線較細時，這些平行線被省略掉后并不會影響原圖的顯示效果。
[0054]上述說明示出并描述了本發明的若干優選實施例，但如前所述，應當理解本發明并非局限于本文所披露的形式，不應看作是對其他實施例的排除，而可用于各種其他組合、修改和環境，并能夠在本文所述發明構想范圍內，通過上述教導或相關領域的技術或知識進行改動。而本領域人員所進行的改動和變化不脫離本發明的精神和范圍，則都應在本發明所附權利要求的保護范圍內。
【權利要求】
1.一種用戶界面的拉伸控制的方法，其特征在于，包括: 在皮膚圖片上通過用于標示拉伸位置的可視化標識繪制所述拉伸區域； 監視到對所述皮膚圖片存在拉伸需求時，識別所述皮膚圖片的可視化標識從而獲得拉伸區域，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸。
2.如權利要求1所述的方法，其特征在于， 所述可視化標識，包括:沿所述背景圖片的縱向延伸的一對或多對平行線和/或沿所述背景圖片的橫向延伸的一對或多對平行線。
3.如權利要求2所述的方法，其特征在于， 所述平行線使用所述皮膚圖片上所占用面積小于一閾值的顏色和/或透明度來標明，每對平行線之間使用不同的顏色和/或透明度來區別。
4.如權利要求2所述的方法，其特征在于，識別所述皮膚圖片的可視化標識從而獲得拉伸區域的步驟，進一步包括: 識別沿所述皮膚圖片的縱向延伸的平行線，每對平行線之間相夾的部分為橫向的拉伸區域；和/或， 識別沿所述皮膚圖片的橫向延伸的平行線，每對平行線之間相夾的部分為縱向的拉伸區域。
5.如權利要求1所述的方法，其特征在于，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，進一步包括: 當存在多個拉伸區域時，對各拉伸區域設置權重； 監視到對所述皮膚圖片存在拉伸需求時，針對權重給每個拉伸區域分配相應的拉伸比例，權重越高的拉伸區域，其分配的拉伸比例越大。
6.如權利要求1所述的方法，其特征在于，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，進一步包括: 監視到對所述皮膚圖片存在拉伸需求時，針對多個拉伸區域等比例分配拉伸尺寸。
7.如權利要求1所述的方法，其特征在于，僅針對處于所述拉伸區域內的皮膚圖片進行拉伸的步驟，進一步包括: 處于所述拉伸區域外的皮膚圖片保持不變。
8.如權利要求1所述的方法，其特征在于，還包括: 所述平行線將所述皮膚圖片劃分為若干區域并依次編號，所述區域不包括所述平行線本身； 依據所述編號的順序將對應的區域內的皮膚圖片的邊界直接拼接，重新組合得到不包含所述平行線的皮膚圖片并顯示。
【文檔編號】G06F9/44GK103995701SQ201410222535
【公開日】2014年8月20日 申請日期:2011年9月29日 優先權日:2011年9月29日
【發明者】萬立新, 田新超 申請人:北京奇虎科技有限公司, 奇智軟件（北京）有限公司