|
在“側邊條按鈕”圖層里我們已經準備好了來自“qq2004 icon.psd”文件里的QQ側邊條按鈕圖標。而在這個“藍色暢想”的QQSkin中，我沒有對側邊條按鈕像工具欄按鈕那樣做過多的“外包裝”。因此我們只需將這些側邊條按鈕的圖標放置在QQ主窗體的左側位置上，并進行垂直對齊與均勻分布后即可為其建立導出切片，如圖50。
圖50 同樣的，在導出這些按鈕切片時要以這些按鈕所對應的功能來命名，并在名移中注明“觸發(fā)狀態(tài)”。
導出這些按鈕后，我們再將這些圖標同時選中，然后把這些圖標的不透明度降至50%，并把這些圖標以側邊條按鈕處于未觸發(fā)時的狀態(tài)進行導出。這樣一來，側邊條按鈕的制作也就輕松完成了！
繪制“狀態(tài)按鈕”
在“騰訊QQ2004皮膚編輯器”里把“在線”、“離開”、“隱身”和“離線”稱為用戶在使用QQ時的四種不同狀態(tài)。這四種狀態(tài)都可以在“狀態(tài)按鈕”中依據個人的QQ頭像生動的表現出來。而不管你選用的是哪一個QQ頭像，在狀態(tài)按鈕里都只有24*24大小。因此我所要繪制的這個“狀態(tài)按鈕”，實際上只是作為24*24這個QQ頭像在不同狀態(tài)時的襯托背景而已。
先用“橢圓形”工具在QQ主窗體的右上角畫一個32*32大小的圓形，然后對其使用由#FFFFFF至#5991EC的橢圓形漸變，描邊色為#0F4099。如圖51。
圖51 為使這個狀態(tài)按鈕具有水晶球的立體感，我們再繪制兩個分別為29*29和36*36大小的圓形。接著把這兩個圓形進行垂直和頂端對齊，然后將36*36的大圓向下移動3個像素，如圖52。
圖52 將這兩個圓同時選中后使用“修改—組合路徑—打孔”命令。然后把新形成的路徑進行無描邊的白色實心填充，羽化值為1，并用“縮放”工具進行一定角度的旋轉后，放到狀態(tài)按鈕的左上角上，如圖53。
圖53 用“鋼筆”工具在這這個狀態(tài)按鈕的左下角上繪制一個實邊的白色三角形。然后將這個三角形復制一份，改用#053585填充后向左平移1個像素，如圖54。
圖54 然后我們把這一狀態(tài)按鈕建立切片并以“狀態(tài)按鈕”為名進行導出。接下來我們再來繪制造狀態(tài)按鈕的觸發(fā)狀態(tài)。將橢圓形填充的圓形對象改用由#FFFFFF至8BB2F2進行填充。而原來用#053585進行實邊填充的三角形，則改用#2776F8進行填充。完成后再次建立切片將該按鈕的觸發(fā)狀態(tài)進行導出，如圖55。
圖55
出處：太平洋電腦網
責任編輯：藍色
上一頁 繪制工具欄按鈕 下一頁 后期處理
◎進入論壇Photoshop、Fireworks版塊參加討論
|
第 1 頁 
第 6 頁 排列側邊條按鈕、狀態(tài)按鈕
