- 官方網(wǎng)站：http://www.skinui.cn
- 下載地址：http://pan.baidu.com/s/1slKsMGt
SkinUI界面庫提供Windows界面開發(fā)全套解決方案苏遥，經(jīng)過幾年不斷的優(yōu)化和迭代，變得非常穩(wěn)定和高效。本文將會簡單介紹如何使用SkinUI界面庫開發(fā)Windows客戶端應(yīng)用烟零。
本章是全書的基礎(chǔ)，簡要介紹SkinUI界面庫的歷史骂因、現(xiàn)狀和發(fā)展趨勢丢胚，并重點向讀者講解如何搭建和使用SkinUI界面開發(fā)環(huán)境，包括SkinUI提供的Sln++有咨、Res++、Spy++工具蒸健。掌握這些工具是開發(fā)SkinUI應(yīng)用的基礎(chǔ)技能座享。
1.1 歷史和現(xiàn)狀
SkinUI是本人利用業(yè)余時間開發(fā)的用于Windows客戶端開發(fā)的界面庫婉商，從2010年8月至今一直不斷優(yōu)化和迭代。
第一版的界面庫以MFC為基礎(chǔ)自定義了一系列的控件渣叛，布局只有絕對定位丈秩。雖然能實現(xiàn)市面上大部分客戶端軟件的效果，但是難以擴展淳衙，開發(fā)效率低下蘑秽。同時，因為依賴MFC箫攀，安裝包需要攜帶龐大的MFC庫文件肠牲，其體積是核心庫文件的幾十倍以上，對于開發(fā)一些幾百KB的小程序靴跛，代價有點大缀雳。
為了解決以上問題，第二版本的界面不再依賴MFC梢睛，轉(zhuǎn)而以WTL為基礎(chǔ)肥印，解決了庫文件體積龐大的問題。同時扬绪，該版本的界面庫增加了相對布局竖独，開發(fā)效率顯著提高。但是挤牛，MFC莹痢、WTL存在一些坑，需要寫很多猥瑣代碼才能繞過墓赴，不夠優(yōu)雅竞膳。另外，跟市面上其他產(chǎn)品相比诫硕，界面效果沒有讓人眼前一亮的感覺坦辟。一些動畫、換膚等高級功能實現(xiàn)起來依然繁瑣章办、最終實現(xiàn)的效果也無法令人滿意锉走。例如采用雙窗口聯(lián)動方式實現(xiàn)的陰影存在跟隨問題，在窗口拖動和最大最小化的時候有遲滯藕届。
實際上挪蹭，以上兩個版本都沒能完美解決擴展性的問題。例如休偶，為了實現(xiàn)產(chǎn)品各式各樣的按鈕梁厉，每種按鈕都需要從按鈕類繼承一下，最后可能存在幾十個類似的按鈕類踏兜，而它們僅僅只是繪制部分的代碼不同词顾。
為了解決以上存在的種種問題八秃，最終開發(fā)了第三版的界面庫。這一版本的界面庫以Win32為基礎(chǔ)肉盹，不再依賴MFC和WTL等第三方界面庫昔驱，歷史遺留問題得到徹底解決。除了支持相對布局垮媒，還支持水平布局舍悯、垂直布局航棱、幀布局睡雇、表格布局、比例布局等高效的布局方式饮醇。同時它抱，以組合的方式實現(xiàn)絕大部分控件，再也不需要每種按鈕繼承一個按鈕類朴艰，直接替換布局文件即可得到完全不同樣式的按鈕观蓄。
1.2 發(fā)展趨勢
Windows客戶端開發(fā)的一項重要工作就是用戶界面的開發(fā)。不管客戶端應(yīng)用實際包含的邏輯多么復(fù)雜祠墅、多么優(yōu)秀侮穿，如果這個應(yīng)用沒有提供友好的圖形用戶界面，也將很難吸引最終用戶毁嗦。
相反亲茅，如果為應(yīng)用程序提供了友好的圖形用戶界面，最終用戶通過鼠標(biāo)點點就可以操作整個應(yīng)用狗准，這個應(yīng)用程序就會受歡迎得多克锣。實際上，Windows之所以廣為人知腔长，其最初的吸引力就是來自于它所提供的圖形用戶界面袭祟。作為一個程序開發(fā)者，必須優(yōu)先考慮用戶的感受捞附，一定要讓用戶感到爽巾乳，我們的程序才會被需要、被使用鸟召，這樣的程序才有價值胆绊。
從趨勢上看，用戶對Windows客戶端界面的要求會越來越高药版，對Windows界面開發(fā)人才的需求也越來越大辑舷。對于大部分Windows客戶端來說，新增功能50%以上的開發(fā)量來自于界面開發(fā)槽片，后期迭代70%以上的工作量同樣來自界面開發(fā)何缓。
雖然界面開發(fā)的工作量越來越大肢础，但是MFC、WTL等傳統(tǒng)界面庫開發(fā)效率低下碌廓，實現(xiàn)動畫传轰、換膚等高級需求困難，同時卡頓谷婆、閃爍等一系列問題難以徹底解決慨蛙，已經(jīng)無法滿足互聯(lián)網(wǎng)時代多變的需求。
SkinUI提供了大量功能豐富的UI組件纪挎，開發(fā)者只需要按一定的規(guī)律把這些UI組件組合起來——就像小朋友“搭積木”一樣期贫，把這些UI組件按一定規(guī)律搭建在一起就可以開發(fā)出優(yōu)秀的圖形用戶界面。為了讓這些UI組件響應(yīng)用戶的鼠標(biāo)點擊异袄、鍵盤動作通砍，SkinUI提供了事件響應(yīng)機制，這樣可以方便的響應(yīng)用戶的交互操作烤蜕。
SkinUI致力于做最好用的Windows客戶端界面庫封孙，是現(xiàn)階段界面開發(fā)的不二選擇。
1.3 開發(fā)環(huán)境
SkinUI當(dāng)前版本為2.0讽营，可以從官網(wǎng)下載SkinUI開發(fā)包虎忌，官網(wǎng)地址：www.skinui.cn。當(dāng)前版本僅支持Microsoft Visual Studio 2013橱鹏，SkinUI開發(fā)包不需要安裝膜蠢，解壓下載的壓縮包，開發(fā)環(huán)境就準(zhǔn)備好了蚀瘸。以下是常用的工具：
- SkinUISln++狡蝶，用來新建工程
- SkinUIRes++，用來打包資源文件
- SkinUISpy++贮勃，用來查看組件類型和位置
1.3.1 SkinUISln++
SkinUI使用工具【SkinUISln++】來新建工程贪惹。工具截圖如下：
新建項目的步驟如下：
- 在編輯框輸入工程名稱【MyProject】；
- 單擊按鈕【立即新建】寂嘉；
- 等進(jìn)度條走完奏瞬。
新建項目成功后，工作目錄下多了以下目錄：1）【src】目錄下的源碼目錄【MyProject】泉孩；2）【res】目錄下的資源目錄【MyProject】硼端；3）【skin】目錄下的皮膚目錄【MyProject】。
將源碼目錄【MyProject】下的工程文件加入VS2013的解決方案寓搬，編譯運行即可看到項目的主界面珍昨。開發(fā)者可以根據(jù)自己軟件的需求，隨意修改主界面的布局。
1.3.2 SkinUIrRes++
SkinUI使用工具【SkinUIRes++】來打包資源文件镣典。工具截圖如下：
新建項目的步驟如下：
- 單擊按鈕【立即打包】兔毙；
- 等進(jìn)度條走完。
打包資源文件成功后兄春，【res】目錄下任意資源目錄【AnyProject】將會生成資源包文件【AnyProject.res】澎剥。關(guān)于資源包的用法，我們將在后面的章節(jié)詳細(xì)講解赶舆，此處先略過哑姚。
1.3.3 SkinUIrSpy++
SkinUI使用工具【SkinUISpy++】來查看控件的屬性，包括控件Id芜茵、類型叙量、位置和大小。工具截圖如下：
查看控件屬性的步驟如下：
- 移動鼠標(biāo)到SkinUI窗口夕晓；
- 放在需要查看的控件上宛乃。
觀看上面的截圖，可以看到以下信息：
- 控件的Id為【1】蒸辆；
- 控件類名為【SkinButton】；
- 控件的位置為【199,177,125,30】析既；
- 控件的大小為【125*30】躬贡。
