這個(gè)節(jié)點(diǎn),本教程為你準(zhǔn)備了必須的素材文件
。打開(kāi)之后應(yīng)該長(zhǎng)這樣:
這套包含了單個(gè)示例和矢量圖標(biāo)的素材方便你隨時(shí)查閱,這些素材都是在教程前后使用的。
Tab Bar
的圖標(biāo)顏色變化是基于選中狀態(tài),但是一些圖標(biāo)有太多的空間,所以顏色變化太微妙。在這種情況下,蘋果的人機(jī)界面指南
推薦使用單獨(dú)填充版本作為selectedImage
。RWDevCon
應(yīng)用的樣本都有各自的Tab Bar
獨(dú)立版本。
在剛才下載的素描文件里,有一個(gè)被稱為日歷入門的畫板,日歷圖標(biāo)其中包含幾個(gè)幾何圖形合并的而來(lái)的圖標(biāo)。就是一些簡(jiǎn)單的幾何圖形拼湊而已,前面已經(jīng)很好的演示過(guò)來(lái)。 下面我們來(lái)創(chuàng)建日歷圖標(biāo):
日歷入門 - Calendar Starter
畫板。日歷主體 - Calendar Body
部分和分割線 - Separator
部分。相差 - Subtract
功能。Shift
再選中Right Hole
圖層,還是使用相差 - Subtract
功能。Left Hole
圖層也重復(fù)上述步驟。Shift
再選中Right Ring
圖層使用融合 - Union
功能。Left Ring
圖層也這么照做。通過(guò)相差和融合操作,現(xiàn)在的日歷入門的畫板上就只剩一個(gè)包含了剛才所有圖層的單圖層了,一切都看著泛綠。如果按照上述步驟操作之后和效果圖有什么出入,可以參照畫板下方的實(shí)例對(duì)照。 現(xiàn)在,來(lái)搞一個(gè)填充的圖標(biāo)。是時(shí)候重新調(diào)整一下,讓其看起來(lái)像示例版本了。
日歷填充 - Calendar Fill
。日歷填充 - Calendar Fill
。日歷主體 - Calendar Body
圖層,并選擇分割線 - Separator
圖層。分割線 - Separator
圖層高度
設(shè)置為35
即可。調(diào)整分割線高度的時(shí)候,Sketch不會(huì)有明確的高度指示,所以你可以選擇直接輸入數(shù)值。