用Fireworks製作一款漂亮按鈕

來源:互聯網
上載者:User
按鈕   開始教程之前,還是先來看按紐的幾款效果圖

  通過效果的觀察,想必大家對於上面這些按鈕的製作方法已經有了一些初步的想法,好,那麼就請看看下面的操作步驟是否和你的想法相吻合~~
  1、開啟FW,建立一個檔案,檔案的大小為100*100,背景色採用了白色。
  2、選取工具箱的矩形工具,配合Shift鍵,在編輯區繪製出一個正方形,選中正方形分別開啟Stroke面板和Fill面板進行設定。Stroke選項選擇None,不要描邊;Fill選項中填充方式選擇Linear(線性漸層填充),填充方案可以選擇“Black,White”方案,也可以點擊“Edit”按鈕,進行顏色列的編輯,這裡我採用的顏色方案是“#DADADA--#000000”,具體設定如下圖所示:

  3、此刻正方形的填充效果是預設的由上向下的填充,不符合我們的要求,我們需要將填充方向進行調整,記得在“一款立體字的製作”的教程中,給大家介紹了使用油漆桶工具進行填充方向調整的簡單方法,大家可以在這裡實踐一下了:從左上方的方向向右下角的方向拖動油漆桶,就產生了我們需要的斜向漸層色填充的效果,如下圖所示:

  4、選定正方形對象,開啟Fill填充面板,將Edge選項進行調整,將其設定為“Feather(羽化)”,羽化數值不要太大,這裡我們定為1,如下圖所示:

  5、好了,接下來選定正方形對象,執行功能表命令“Edit--Clone(編輯--複製)”(快速鍵“Ctrl+Shift+D”),原地複製一個正方形對象,然後選定複製的對象,依次點擊工具列的左右調整、上下調整的按鈕,這樣就將複製對象的填充方向作了一個調整。
  當然,如果不使用位置調整按鈕的話,同樣可以使用油漆桶工具從右下角向左上方進行拖動,從而實現漸層方向的調整。
  6、選定複製對象,執行功能表命令“Modify--Alert Path--Inset Path”,在彈出的對話方塊中進行設定:注意Direction(方向)為Inside(向內);Width的數值不要設定的太大,這裡採用了6像素大小,其餘設定請參看下圖:

  7、同時選定編輯區的兩個正方形對象,執行功能表命令“Modify--Group(修改--組合群組)”(快速鍵為“Ctrl+G”)或者直接點擊工具列的組合群組按鈕即可。
  8、選定組合對象,開啟Effect(效果)面板,執行其中的“Effect--Adjust Color--Hue/Saturation(色調/色相飽和度)”效果命令,在彈出的Hue/Saturation設定的對話方塊中進行設定,你可以自行調節進行設定,這裡採用的各項數值的大小如下圖所示:

  8、經過效果命令調整後,編輯區的組合對象已經發生了變化,我覺得這個變化是很奇妙的~~(別笑話我啊,呵呵……):),如下圖所示:

  9、好了,添加上一些相關的文字吧,最終效果如下圖所示:

  10、儲存輸出即可。[補充說明:]這樣我們應該理解文章開始給大家看的效果圖的製作方法了,呵呵,不用太複雜,只要調整我們已經完工的按鈕的Hue/Saturation(色調/色相飽和度)的值即可了~~真是太方便了!!希望各位能夠靈活掌握這種Effect效果命令的使用操作啊。
  源檔案:


相關文章

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。