本文的目的是解決在使用storyboard和xib開發(fā)界面時顏色設(shè)置時的困擾卧斟∏艟郏可能很多小伙伴更喜歡用代碼設(shè)置控件顏色值跨晴,因為只需要一個十六進制色值即可,但其實在storyboard或xib設(shè)置控件顏色值更快速更簡單栖榨。文中使用Xcode為Xcode8昆汹。那么進入正題明刷。
初識Xcode調(diào)色板
如上圖所示婴栽,在Xcode中點擊顏色選擇左邊的色塊即可打開調(diào)色板。調(diào)色板頂部的TabBar有五個選項辈末,從左向右分別是:
- 餅狀圖調(diào)色器(自取名字愚争,歡迎更正)
- Slider調(diào)色器
- 預(yù)設(shè)色值選擇器
- 圖片取色器
-
蠟筆取色器
底部是公共區(qū)域,顏色透明度調(diào)節(jié)slider挤聘、顯示當前色彩以及取色筆
如下圖所示:
調(diào)色板簡介
下面開始逐一了解每個功能轰枝。
功能詳解
1. 餅狀圖調(diào)色器
這個比較簡單,餅圖內(nèi)選擇色彩组去,中間slider選擇灰度鞍陨,底部選擇透明度選擇。這個工具顏色選擇很直觀,但是不準確诚撵,比如不能準確的選擇設(shè)計稿上的顏色缭裆,所以這個工具不常用。
2. Slider調(diào)色器
如上圖所示寿烟,Slider調(diào)色器可以通過四種方式選擇顏色澈驼,但常用的是第二個RGB Sliders,這里只介紹RGB Sliders得使用筛武,其他三種很少使用并且使用方式相同所以不做介紹缝其。
如下圖,RGB Sliders設(shè)置顏色的方式分為兩種:第一種是這是Red Green Blue三種顏色的值來確認顏色徘六;第二種是使用十六進制色值確認顏色内边。
RGB Sliders還可以進行一些設(shè)置,點擊小齒輪進行設(shè)置待锈,設(shè)置分為兩部分:第一是色值范圍假残,默認是0255,可以選擇0.01.0炉擅,都可以辉懒;第二部分應(yīng)該是色值的標準,具體我也不太清楚谍失,使用默認即可眶俩。
3. 預(yù)設(shè)色值選擇器
這里面系統(tǒng)預(yù)設(shè)了很多顏色值供我們選擇,但這里面的顏色用的很少快鱼,用的最多的功能是自己預(yù)設(shè)常用的色值颠印。在APP開發(fā)中一般都會有主題色、深灰抹竹、灰色线罕、淺灰、背景色等常用色值窃判,這些色值在代碼中我們可以使用宏定義保存钞楼,但在XIB和storyboard中不能使用宏,那么在預(yù)設(shè)色值選擇器中預(yù)設(shè)常用色值能達到宏定義色值的效果袄琳。
想要自己預(yù)設(shè)色值询件,首先要創(chuàng)建色值容器文件,點擊"小齒輪"設(shè)置按鈕唆樊,選擇"New"宛琅,創(chuàng)建了一個名為"Unnamed"的色值容器,這個容器會保存在"~/Library/Colors"目錄下逗旁,文件名為色值容器名字嘿辟,后綴為".clr"。新建操作如下圖所示:
在設(shè)置按鈕中還可以對色值容器重命名、刪除操作以及導入红伦。"Open..."選項即為導入功能介陶,可以導入.clr文件。
容器創(chuàng)建好了就可以添加色值了色建,色值添加分為幾個步驟:確定色值哺呜、添加色值、重命名箕戳,如下圖所示:
刪除顏色只需要選準要刪除的顏色某残,點擊減號即可。
4. 圖片取色器
這個工具可以直接從圖片中選擇顏色陵吸。在色值較多的界面玻墅,可以將設(shè)計稿圖片導入圖片取色器,就可以直接取色壮虫,很方便澳厢。操作如下圖所示:
該工具的缺點是沒辦法放大圖片,取一些細節(jié)上的色值時不太方便囚似,解決方法是放大窗口或者將圖片局部放大截取并保存成圖片然后再導入剩拢。導入的圖片同樣會保存在"~/Library/Colors"目錄下,并以".tiff"為后綴名饶唤。
5. 蠟筆取色器
不過多介紹徐伐,很簡單,如下圖:
總結(jié)
靈活運用調(diào)色板募狂,能使取色事半功倍办素,希望本文能幫助到你。如有講解錯誤請留言指正祸穷,謝謝性穿!