專利名稱：一種圖形界面的自動繪制方法及系統(tǒng)的制作方法
技術(shù)領(lǐng)域：
本發(fā)明涉及圖形繪制技術(shù)，尤其涉及一種按照需求所定制的圖形界面的自動繪制方法及系統(tǒng)
背景技術(shù)：
目前，各類圖形界面比如常見的軟件界面中，需要大量的圖片來實現(xiàn)軟件界面的繪制?，F(xiàn)有的通用繪制方式是將圖片作為構(gòu)成一個完整的軟件界面的各個素材，通過眾多圖片的編輯組合，將各個圖片排列成所需要的大的完整的軟件界面。例如，以一款軟件QQ 影音的主界面舉例來說，該主界面由標(biāo)題欄、底部欄和中部區(qū)域三部分組成。其中，該主界面如圖1所示；標(biāo)題欄的圖片如圖2所示；底部欄的圖片如圖3所示；中部區(qū)域的圖片如圖 4所示。而構(gòu)成主界面的每個部分又都是由各個圖片組合而成的，以下分別舉例闡述。一、就標(biāo)題欄而言，標(biāo)題欄在繪制的時候包括背景圖片和前景圖片。本文中涉及的背景圖片通俗來說，類似于畫畫時采用的畫布；而前景圖片通俗來說，類似于在畫布上所繪制的各個圖形，不做贅述。比如，如圖2所示的標(biāo)題欄中，11、12所在位置的圖片為背景圖片，13、14、15、16、17所在位置的圖片，即各個按鈕的圖片為前景圖片。如圖5、6所示的圖片即為標(biāo)題欄的背景圖片；如圖7所示的圖片即為標(biāo)題欄的前景圖片，且圖7為前景圖片復(fù)用時的圖示。這里，標(biāo)題欄的背景圖片所對應(yīng)的可擴展標(biāo)記語言(XML)文件的表示方式如下< Image = “ STATIC_CAPTION_LEFT.BMP" /><Image = “ STATIC_CAPTION_RIGHT.BMP" />二、就底部欄而言，底部欄在繪制的時候也包括背景圖片和前景圖片。比如，如圖 3所示的底部欄中，21所在位置的圖片為背景圖片，22、23、24、25、26、27、28、29、30、31所在位置的圖片，即各個按鈕的圖片為前景圖片，如圖8所示的圖片即為底部欄的前景圖片，且圖8為前景圖片復(fù)用時的圖示。這里，底部欄的背景圖片所對應(yīng)的XML文件的表示方式如下< Image = “ STATIC_CAPTION_LEFT.BMP" />< Image = “ STATIC_CAPTION_LEFT.BMP" /><Image = “ STATIC_CAPTION_LEFT.BMP" />三、就中部區(qū)域而言，中部區(qū)域在繪制的時候也包括背景圖片和前景圖片。中部區(qū)域的背景圖片為黑色區(qū)域，比如，如圖4所示的中部區(qū)域中，32所在位置的圖片為背景圖片；如圖9所示按鈕的圖片即為中部區(qū)域的前景圖片，且圖9為前景圖片復(fù)用時的圖示。前景圖片和背景圖片都存在復(fù)用的情況，尤以前景圖片的復(fù)用為甚，采用現(xiàn)有的繪制方式，存在以下問題1、由于需要對大量的圖片進(jìn)行編輯、組合及排列才能繪制出一個完整的圖形界面，而圖片的數(shù)量繁多，圖片的分類和命名復(fù)雜，在圖片使用的過程中，編輯圖片、更換圖片都需要選擇對應(yīng)的圖片并加以正確命名，因此，對圖片管理的工作量很大。
2、對圖片進(jìn)行組合時，由于圖形界面中的背景圖片由多個圖片疊加排列而成，因此，圖片設(shè)計人員對于多個圖片中部分個別圖片的大小和顏色的修改，并不能直接形成完整的背景圖片，需要專門的軟件，比如上述例子軟件界面形成時是需要軟件QQ影音將所有的圖片組織起來加以展現(xiàn)，操作比較繁瑣。3、各個圖片在編輯過程中，盡管最初各個圖片是分別對應(yīng)不同的圖片格式，但是為了后續(xù)組合及排列的需要，需要根據(jù)需求保持相應(yīng)的圖片格式，以便于多個圖片設(shè)計人員合作共同編輯圖片的過程中，保持統(tǒng)一的標(biāo)準(zhǔn)。這樣多人參與的操作，且圖片格式在最初標(biāo)準(zhǔn)并不統(tǒng)一需后續(xù)統(tǒng)一，勢必增加溝通的復(fù)雜度。 4、對圖片進(jìn)行組合及排列時，對于各個圖片的位置、布局以及大小限制依賴于各個圖片本身的屬性，例如圖片的高度、長度，而軟件開發(fā)人員對于圖片的大小和位置是難以自由定制的。綜上所述，無論是對于圖片設(shè)計人員還是軟件開發(fā)人員，采用現(xiàn)有的繪制方式，由于對圖片進(jìn)行編輯、組合及排列時無法自由定制而無法自動繪制，因此，增加了對圖片管理及繪制的復(fù)雜度，從而大大影響了日常圖形界面開發(fā)的效率。

發(fā)明內(nèi)容
有鑒于此，本發(fā)明的主要目的在于提供一種圖形界面的自動繪制方法及系統(tǒng)，提高了日常圖形界面開發(fā)的效率。為達(dá)到上述目的，本發(fā)明的技術(shù)方案是這樣實現(xiàn)的一種圖形界面的自動繪制方法，該方法包括設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的所述切分參數(shù)和所述繪制參數(shù)生成可擴展標(biāo)記語言(XML)文件；解析所述XML文件，根據(jù)所述XML文件中的所述切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)所述XML文件中的所述繪制參數(shù)和所述目標(biāo)圖片自動繪制圖形界面。其中，切分時采用的切分依據(jù)為按照所述圖形界面的設(shè)計需求獲取一個完整的圖片，將所述完整的圖片作為源圖片并從中切分出所述目標(biāo)圖片。其中，所述目標(biāo)圖片為背景圖片和/或前景圖片。其中，所述切分參數(shù)包括表征源圖片所對應(yīng)文件名的參數(shù)、和表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)；所述繪制參數(shù)包括表征目標(biāo)圖片繪制方式的參數(shù)、和表征目標(biāo)圖片間繪圖間隔的參數(shù)。其中，所述根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片具體包括根據(jù)所述表征源圖片所對應(yīng)文件名的參數(shù)，獲取源圖片所對應(yīng)的文件名，讀入對應(yīng)的源圖片； 根據(jù)所述表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)，對讀入的源圖片進(jìn)行切分，獲取對應(yīng)的目標(biāo)圖片；相應(yīng)的，所述根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面具體包括根據(jù)所述表征目標(biāo)圖片繪制方式的參數(shù)、和所述表征目標(biāo)圖片間繪圖間隔的參數(shù)，將對應(yīng)的目標(biāo)圖片繪制到圖形界面中。其中，繪制時采用的繪制方式包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種或至少一種的組合。其中，該方法還包括當(dāng)切分后獲得的所述目標(biāo)圖片的大小與所述圖形界面所需繪制的范圍，大小一致時，采用所述直接拷貝的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的寬度小于所述圖形界面所需繪制的寬度， 且高度相同時，采用所述水平拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的高度小于所述圖形界面所需繪制的寬度， 且寬度相同時，采用所述垂直拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中。一種圖形界面的自動繪制系統(tǒng)，該系統(tǒng)包括參數(shù)設(shè)置及文件生成單元和自動繪制單元；其中，參數(shù)設(shè)置及文件生成單元，用于設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的所述切分參數(shù)和所述繪制參數(shù)生成XML文件；自動繪制單元，用于解析所述XML文件，根據(jù)所述XML文件中的所述切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)所述XML文件中的所述繪制參數(shù)和所述目標(biāo)圖片自動繪制圖形界面。其中，切分時所采用的切分依據(jù)為按照所述圖形界面的設(shè)計需求獲取一個完整的圖片，將所述完整的圖片作為源圖片并從中切分出所述目標(biāo)圖片。其中，所述自動繪制單元，進(jìn)一步用于采用包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種、或至少一種的組合的方式實現(xiàn)所述自動繪制。其中，所述自動繪制單元，進(jìn)一步用于當(dāng)切分后獲得的所述目標(biāo)圖片的大小與所述圖形界面所需繪制的范圍，大小一致時，采用所述直接拷貝的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的寬度小于所述圖形界面所需繪制的寬度， 且高度相同時，采用所述水平拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的高度小于所述圖形界面所需繪制的寬度， 且寬度相同時，采用所述垂直拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中。本發(fā)明設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的切分參數(shù)和繪制參數(shù)生成XML文件；解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。采用本發(fā)明，由于能隨需求預(yù)先配置切分參數(shù)和繪制參數(shù)到XML文件中，從而實現(xiàn)對圖片的自由定制，而且通過后續(xù)對XML文件的自動讀取及自動解析因而能實現(xiàn)圖形界面的自動繪制，因此，降低了對圖片管理及繪制的復(fù)雜度，從而大大提高了日常圖形界面開發(fā)的效率。


圖1為軟件界面的示意圖；圖2為構(gòu)成軟件界面的標(biāo)題欄的示意圖；圖3為構(gòu)成軟件界面的底部欄的示意圖；圖4為構(gòu)成中部區(qū)域的底部欄的示意圖5、圖6為標(biāo)題欄的背景圖片的示意圖；圖7為標(biāo)題欄的前景圖片的示意圖；圖8為底部欄的前景圖片的示意圖；圖9為中部區(qū)域的前景圖片的示意圖；圖10為本發(fā)明所選取的源圖片及其所在坐標(biāo)的示意圖；圖11為本發(fā)明從源圖片中切分后獲得目標(biāo)圖片的示意圖；圖12為本發(fā)明隨需求定制而自動繪制的完整流程示意圖；圖13為本發(fā)明圖12中自動繪制軟件界面的流程示意圖。
具體實施例方式本發(fā)明的基本思想是設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的切分參數(shù)和繪制參數(shù)生成XML文件；解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。為使本發(fā)明的目的、技術(shù)方案和優(yōu)點更加清楚明白，以下舉實施例并參照附圖，對本發(fā)明進(jìn)一步詳細(xì)說明。一種圖形界面的自動繪制方法，該方法主要包括以下內(nèi)容一、設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的切分參數(shù)和繪制參數(shù)生成XML文件。二、解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù) XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。這里，針對所述目標(biāo)圖片而言，目標(biāo)圖片為背景圖片和/或前景圖片。這里，針對所述切分并獲取對應(yīng)的目標(biāo)圖片而言，切分時采用的切分依據(jù)為按照圖形界面的設(shè)計需求獲取一個完整的圖片，將完整的圖片作為源圖片并從中切分出目標(biāo)圖片。這里，針對設(shè)置的所述切分參數(shù)而言，切分參數(shù)包括表征源圖片所對應(yīng)文件名的參數(shù)、和表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)，二者缺一不可。這里，針對設(shè)置的所述繪制參數(shù)而言，繪制參數(shù)包括表征目標(biāo)圖片繪制方式的參數(shù)、和表征目標(biāo)圖片間繪圖間隔的參數(shù)，二者缺一不可。這里，針對所述根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片具體包括根據(jù)表征源圖片所對應(yīng)文件名的參數(shù)，獲取源圖片所對應(yīng)的文件名，讀入對應(yīng)的源圖片；根據(jù)表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)，對讀入的源圖片進(jìn)行切分，獲取對應(yīng)的目標(biāo)圖片。相應(yīng)的，所述根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面具體包括根據(jù)表征目標(biāo)圖片繪制方式的參數(shù)、和表征目標(biāo)圖片間繪圖間隔的參數(shù)，將對應(yīng)的目標(biāo)圖片繪制到圖形界面中。這里，利用所述表征目標(biāo)圖片繪制方式的參數(shù)，將目標(biāo)圖片繪制到圖形界面時，相應(yīng)的采用的繪制方式包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種或至少一種的組合，以下具體闡述。1、當(dāng)切分后獲得的目標(biāo)圖片的大小與圖形界面所需繪制的范圍，大小一致時，采用所述直接拷貝的方式將目 標(biāo)圖片繪制到圖形界面中。2、當(dāng)切分后獲得的目標(biāo)圖片的寬度小于圖形界面所需繪制的寬度，且高度相同時，采用所述水平拉伸的方式將目標(biāo)圖片繪制到圖形界面中。3、當(dāng)切分后獲得的目標(biāo)圖片的高度小于圖形界面所需繪制的寬度，且寬度相同時，采用所述垂直拉伸的方式將目標(biāo)圖片繪制到圖形界面中。綜上所述，對比本發(fā)明與現(xiàn)有技術(shù)可知采用現(xiàn)有的繪制方式會導(dǎo)致圖片的組織管理復(fù)雜、增加圖片開發(fā)設(shè)計的過程、圖片布局不靈活不自由，從而影響到日常圖形界面開發(fā)的效率。而本發(fā)明是基于同樣的坐標(biāo)系，從一個完整的單個圖片中進(jìn)行切分來獲得繪制圖形界面的各部分圖片，并隨需求將切分的各部分圖片的參數(shù)預(yù)先設(shè)置在標(biāo)準(zhǔn)的XML文件中，通過對該XML文件自動讀取、自動解析及自動繪制完成圖形界面的繪制。采用本發(fā)明具有的優(yōu)點是第一，這種切分方式通過減少圖片的數(shù)量，簡化了圖片的管理；第二，通過操作完整的圖片，使得對圖片的更改直接反映到圖片開發(fā)設(shè)計人員；第三，標(biāo)準(zhǔn)統(tǒng)一，且由于減少了背景圖片，降低了對于圖片格式的一致性要求，因此提高了圖片的繪制效率；第四， 可以隨需求自由定制而自動繪制。總之采用本發(fā)明，無論是對于圖片設(shè)計人員和軟件開發(fā)人員，優(yōu)化了圖片的組織管理和開發(fā)過程，提高了圖形界面比如軟件界面的可定制性、從而大大提高了日常圖形界面的開發(fā)效率。這里需要指出的是，本文所涉及的圖片，如無直接強調(diào)指出是前景圖片還是背景圖片，都包括前景圖片和/或背景圖片。其中，本發(fā)明可以對前景圖片仍采用現(xiàn)有的繪制方式，即讀取多個圖片后進(jìn)行編輯、組合及排列最終繪制出一個完整的圖形界面，而對背景圖片采用本發(fā)明切分和定制的繪制方式；本發(fā)明也可以對背景圖片仍采用現(xiàn)有的繪制方式，而對前景圖片采用本發(fā)明切分和定制的繪制方式；本發(fā)明還可以對背景圖片和前景圖片都采用本發(fā)明切分和定制的繪制方式。以下對本發(fā)明進(jìn)行舉例闡述。實例一圖片的切分和應(yīng)用過程。本實例是對前景圖片仍采用現(xiàn)有的繪制方式，僅對背景圖片采用本發(fā)明切分和定制的繪制方式。在將圖片按照前景圖片和背景圖片進(jìn)行分類后，對前景圖片保持原有設(shè)計，同時背景圖片的生成方式是從一個完整的背景圖片，如圖10所示的圖片中切分獲得，根據(jù)軟件開發(fā)人員的需求選取合適的長度和寬度。例如，如圖2、圖3所示的圖片中的背景圖片可以根據(jù)需求從如圖10所示的圖片中切分。這里，如圖10所示的圖片，文件名為MainWndBkg. BMP,切分的圖片所對應(yīng)的XML文件表示方式如下切分如圖2所示的圖片的背景圖片的XML文件表示方式如下<Image = “ MainffndBkg. BMP" EffectArea = “ 0,0,100,23"Draw=" HFrame“ ParamGaps = “ 15,0,15,0" />切分如圖3所示的圖片的背景圖片的XML文件表示方式如下<Image =“ MainffndBkg. BMP" EffectArea =“ 0，68，100，100〃Draw = “ HFrame“ ParamGaps = “ 15,0,15,0" />XML文件中，各個參數(shù)的意義如下(1) Image參數(shù)即為上述表征源圖片所對應(yīng)文件名的參數(shù)的一個具體實現(xiàn)。該參數(shù)的值，例如MainWndBkg. BMP是圖片的文件名，表示根據(jù)這個文件名可以讀取文件并獲得一張圖片，然后在這個圖片上進(jìn)行圖片的切分。(2) EffectArea參數(shù)即為上述表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)的一個具體實現(xiàn)。表示切分出來的圖片在源圖片中的坐標(biāo)。
例如，如圖10所示的圖片，其圖片的本身屬性是寬度為100個像素，高度為100像素。這里，將如圖10所示的圖片作為源圖片，切分后獲得所需要的目標(biāo)圖片。首先定義該源圖片的左上角的坐標(biāo)為(0，0)，該源圖片的右下角設(shè)為(100，100) ,EffectArea = " 0,0, 100,23"表示切分位置是坐標(biāo)(0,0)和(100,23)所圍成的矩形。如圖11所示的圖片即為從該源圖片中按照參數(shù)EffectArea=" 0,0,100,23"所切分獲得的目標(biāo)圖片。(3) Draw參數(shù)即為上述表征目標(biāo)圖片繪制方式的參數(shù)的一個具體實現(xiàn)。表示切分出來的圖片的繪制方式。圖形界面以軟件界面為例，由于圖片切分后需要繪制到如圖1所示的軟件界面當(dāng)中，因此，需要調(diào)整繪制的方式，使得圖片能夠充滿到軟件界面所需要的部分。圖片的繪制方式一般有以下幾種繪制方式1 直接拷貝的方式。如果切分后獲得的圖片大小與軟件界面所需繪制的范圍大小一致，采用直接拷貝的方式，將圖片繪制到軟件界面當(dāng)中，在XML文件中的配置 Mi Draw = “ None“ 繪制方式2 水平拉伸的方式。如果切分后獲得的圖片寬度小于軟件界面所需繪制的寬度，但高度相同的情況下，可以采用水平拉伸的方式，將圖片繪制到軟件界面當(dāng)中。 在XML文件中的配置是Draw = “ HFrame “。繪制方式3 垂直拉伸的方式。如果切分后獲得的圖片高度小于軟件界面所需繪制的寬度，但寬度相同的情況下，可以采用垂直拉伸的方式，將圖片繪制到軟件界面當(dāng)中。 在XML文件中的配置是Draw = “ VFrame “。繪制方式4 水平拉伸的方式和垂直拉伸的方式共用。如果切分后獲得的圖片寬度小于軟件界面所需繪制的寬度，高度也小于軟件界面所需繪制的寬度，可以采用水平拉伸的方式和垂直拉伸的方式共用的方式，將圖片繪制到軟件界面當(dāng)中。在XML文件中的配置是 Draw = “ Frame “ 0(4)ParamGaps參數(shù)即為上述表征目標(biāo)圖片間繪圖間隔的參數(shù)的一個具體實現(xiàn)。 表示切分出來的圖片的繪圖間隔，和參數(shù)Draw共同起作用。當(dāng)采用直接拷貝的方式，即Draw = “ None"的繪制方式時，ParamGaps的值固定為“0，0，0，0”。當(dāng)采用水平拉伸的方式，即Draw = “ HFrame"的繪制方式時，ParamGaps的值為 "xl,0, χ2，0”。其中xl和χ2都表示大于0的整數(shù)，xl表示距離圖片左端的像素值，χ2表示距離圖片右端的像素值，在水平拉伸的方式繪制時，圖片的中間部分進(jìn)行拉伸操作，左右兩端采用直接拷貝的方式繪制。例如，如圖11所示圖片的參數(shù)ParamGaps =" 15,0,15, 0"，其含義為左右兩端寬度為15像素的部分采用直接拷貝的方式繪制，中間部分寬度為 70像素的部分采用水平拉伸的方式繪制。當(dāng)采用垂直拉伸的方式，即Draw = ‘‘ VFrame"的繪制方式時，ParamGaps的值為 "0, yl，0，y2，，。其中yl和y2都表示大于0的整數(shù)，yl表示距離圖片上端的像素值，y2表示距離圖片下端的像素值。在垂直拉伸的方式繪制時，圖片的中間部分進(jìn)行拉伸操作，上下兩端采用直接拷貝的方式繪制。 當(dāng)采用水平拉伸的方式和垂直拉伸的方式共用，即Draw=" Frame"的繪制方式時，ParamGaps的值為"xl, yl, x2, y2”。其中xl和x2都表示大于0等整數(shù)，xl表示距離圖片左端的像素值，x2表示距離圖片右端的像素值。yl和y2都表示大于0等整數(shù)，yl表示距離圖片上端的像素值，y2表示距離圖片下端的像素值。實例二 為本發(fā)明的圖形界面的自動繪制方法的一個優(yōu)選實施例，是參數(shù)設(shè)置、 XML文件生成及最終實現(xiàn)圖形界面自動繪制的一個完整流程，該圖形界面是一個軟件界面。 如圖12所示，該流程包括以下步驟步驟101、獲取符合軟件界面需求的源圖片。步驟102、根據(jù)軟件界面需求，設(shè)置一系列的EffectArea參數(shù)、Draw參數(shù)、 rcParamsGaps 參數(shù)。步驟103、根據(jù)設(shè)置好的EffectArea參數(shù)、Draw參數(shù)、rcParamsGaps參數(shù)生成XML 文件。步驟104、根據(jù)XML文件中所設(shè)置的參數(shù)配置，實現(xiàn)軟件界面的自動繪制。步驟105、軟件開發(fā)過程當(dāng)中，如果需要對軟件界面進(jìn)行調(diào)整，需要手動更改相關(guān)的EffectArea參數(shù)、Draw參數(shù)、rcParamsGaps參數(shù)，重新生成新的XML文件，然后重新執(zhí)行步驟103、步驟104重新實現(xiàn)軟件界面的自動繪制。實例三為本發(fā)明解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面的一個優(yōu)選實施例，即為圖12中所示的步驟104“根據(jù)XML文件中所設(shè)置的參數(shù)配置，實現(xiàn)軟件界面的自動繪制” 的流程，如圖13所示，包括以下步驟步驟201 軟件讀取已生成的XML文件。步驟202 軟件搜索XML文件中的Image參數(shù)，獲得文件名，讀入對應(yīng)的源圖片。步驟203 軟件搜索XML文件中的EffectArea參數(shù)，對步驟202中獲得的源圖片進(jìn)行切分，獲得切分后所需要的目標(biāo)圖片。步驟204 軟件搜索XML文件中的Draw參數(shù)和rcParamGaps參數(shù)，獲得繪制方式和繪制間隔。步驟205 軟件根據(jù)步驟203獲得的目標(biāo)圖片和步驟204獲得的參數(shù)，自動繪制軟件界面的背景。步驟206:判斷自動繪制是否完成，如果完成，則結(jié)束當(dāng)前自動繪制流程；否則，轉(zhuǎn)入執(zhí)行步驟203。這里需要指出的是軟件開發(fā)人員檢查軟件界面的繪制效果，對于不符合要求的繪制進(jìn)行調(diào)整，僅僅需要手動更改對應(yīng)的XML文件，將參數(shù)EffectArea、ParamGaps和Draw 的值進(jìn)行更改，重新執(zhí)行步驟201 步驟205，在這個過程中不需要圖片設(shè)計人員重新設(shè)計制作圖片。一種圖形界面的自動繪制系統(tǒng)，該系統(tǒng)包括參數(shù)設(shè)置及文件生成單元和自動繪制單元。其中，參數(shù)設(shè)置及文件生成單元，用于設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的切分參數(shù)和繪制參數(shù)生成XML文件。自動繪制單元，用于解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。這里，切分時所采用的切分依據(jù)為按照圖形界面的設(shè)計需求獲取一個完整的圖片，將完整的圖片作為源圖片并從中切分出目標(biāo)圖片。這里，自動繪制單元，進(jìn)一步用于采用包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種、或至少一種的組合的方式實現(xiàn)目標(biāo)圖片的自動繪制。這里，自動繪制單元有以下三種具體實現(xiàn)自動繪制單元，進(jìn)一步用于當(dāng)切分后獲得的目標(biāo)圖片的大小與圖形界面所需繪制的范圍，大小一致時，采用直接拷貝的方式將目標(biāo)圖片繪制到圖形界面中。自動繪制單元，進(jìn)一步用于當(dāng)切分后獲得的目標(biāo)圖片的寬度小于圖形界面所需繪制的寬度，且高度相同時，采用水平拉伸的方式將目標(biāo)圖片繪制到圖形界面中。自動繪制單元，進(jìn)一步用于當(dāng)切分后獲得的目標(biāo)圖片的高度小于圖形界面所需繪制的寬度，且寬度相同時，采用垂直拉伸的方式將目標(biāo)圖片繪制到圖形界面中。以上所述，僅為本發(fā)明的較佳實施例而已，并非用于限定本發(fā)明的保護范圍。
權(quán)利要求
1.一種圖形界面的自動繪制方法，其特征在于，該方法包括設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的所述切分參數(shù)和所述繪制參數(shù)生成可擴展標(biāo)記語言(XML)文件；解析所述XML文件，根據(jù)所述XML文件中的所述切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片， 根據(jù)所述XML文件中的所述繪制參數(shù)和所述目標(biāo)圖片自動繪制圖形界面。
2.根據(jù)權(quán)利要求1所述的方法，其特征在于，切分時采用的切分依據(jù)為按照所述圖形界面的設(shè)計需求獲取一個完整的圖片，將所述完整的圖片作為源圖片并從中切分出所述目標(biāo)圖片。
3.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述目標(biāo)圖片為背景圖片和/或前景圖片。
4.根據(jù)權(quán)利要求2或3所述的方法，其特征在于，所述切分參數(shù)包括表征源圖片所對應(yīng)文件名的參數(shù)、和表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)；所述繪制參數(shù)包括表征目標(biāo)圖片繪制方式的參數(shù)、和表征目標(biāo)圖片間繪圖間隔的參數(shù)。
5.根據(jù)權(quán)利要求4所述的方法，其特征在于，所述根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片具體包括根據(jù)所述表征源圖片所對應(yīng)文件名的參數(shù)，獲取源圖片所對應(yīng)的文件名，讀入對應(yīng)的源圖片；根據(jù)所述表征目標(biāo)圖片在源圖片中坐標(biāo)的參數(shù)，對讀入的源圖片進(jìn)行切分，獲取對應(yīng)的目標(biāo)圖片；相應(yīng)的，所述根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面具體包括根據(jù)所述表征目標(biāo)圖片繪制方式的參數(shù)、和所述表征目標(biāo)圖片間繪圖間隔的參數(shù)，將對應(yīng)的目標(biāo)圖片繪制到圖形界面中。
6.根據(jù)權(quán)利要求1所述的方法，其特征在于，繪制時采用的繪制方式包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種或至少一種的組合。
7.根據(jù)權(quán)利要求6所述的方法，其特征在于，該方法還包括當(dāng)切分后獲得的所述目標(biāo)圖片的大小與所述圖形界面所需繪制的范圍，大小一致時， 采用所述直接拷貝的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的寬度小于所述圖形界面所需繪制的寬度，且高度相同時，采用所述水平拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的高度小于所述圖形界面所需繪制的寬度，且寬度相同時，采用所述垂直拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中。
8.一種圖形界面的自動繪制系統(tǒng)，其特征在于，該系統(tǒng)包括參數(shù)設(shè)置及文件生成單元和自動繪制單元；其中，參數(shù)設(shè)置及文件生成單元，用于設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的所述切分參數(shù)和所述繪制參數(shù)生成XML文件；自動繪制單元，用于解析所述XML文件，根據(jù)所述XML文件中的所述切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)所述XML文件中的所述繪制參數(shù)和所述目標(biāo)圖片自動繪制圖形界面。
9.根據(jù)權(quán)利要求8所述的系統(tǒng)，其特征在于，切分時所采用的切分依據(jù)為按照所述圖形界面的設(shè)計需求獲取一個完整的圖片，將所述完整的圖片作為源圖片并從中切分出所述目標(biāo)圖片。
10.根據(jù)權(quán)利要求8所述的系統(tǒng)，其特征在于，所述自動繪制單元，進(jìn)一步用于采用包括直接拷貝的方式、水平拉伸的方式、垂直拉伸的方式中的任意一種、或至少一種的組合的方式實現(xiàn)所述自動繪制。
11.根據(jù)權(quán)利要求10所述的系統(tǒng)，其特征在于，所述自動繪制單元，進(jìn)一步用于當(dāng)切分后獲得的所述目標(biāo)圖片的大小與所述圖形界面所需繪制的范圍，大小一致時，采用所述直接拷貝的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的寬度小于所述圖形界面所需繪制的寬度，且高度相同時，采用所述水平拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中；或者，當(dāng)切分后獲得的所述目標(biāo)圖片的高度小于所述圖形界面所需繪制的寬度，且寬度相同時，采用所述垂直拉伸的方式將所述目標(biāo)圖片繪制到所述圖形界面中。
全文摘要
本發(fā)明公開了一種圖形界面的自動繪制方法，該方法包括設(shè)置圖形界面中每個目標(biāo)圖片的切分參數(shù)和繪制參數(shù)，根據(jù)設(shè)置的切分參數(shù)和繪制參數(shù)生成可擴展標(biāo)記語言(XML)文件；解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。本發(fā)明還公開了一種圖形界面的自動繪制系統(tǒng)，該系統(tǒng)中的自動繪制單元，用于解析XML文件，根據(jù)XML文件中的切分參數(shù)切分并獲取對應(yīng)的目標(biāo)圖片，根據(jù)XML文件中的繪制參數(shù)和目標(biāo)圖片自動繪制圖形界面。采用本發(fā)明的方法及系統(tǒng)，提高了日常圖形界面開發(fā)的效率。
文檔編號G06F9/44GK102222354SQ20101015084
公開日2011年10月19日 申請日期2010年4月19日 優(yōu)先權(quán)日2010年4月19日
發(fā)明者戴強, 潘偉彬 申請人:騰訊科技(深圳)有限公司