Flash製作實例 - 《網頁製作技巧》動態圓形按鈕 - Flash製作 - Adobe系列學院 - 頂客論壇 ,免費遊戲,免費交友,免費空間,免費部落格,免費相簿,免費開店 - 頂客社區 dk101.com 最用心的華人社群網站
發新話題

Flash製作實例 - 《網頁製作技巧》動態圓形按鈕

Flash製作實例 - 《網頁製作技巧》動態圓形按鈕

●預覽成品:

訪客無法瀏覽此圖片或連結,請先 註冊登入會員


●逐步說明:
  1)選擇菜單File->New,建立一個新電影。


  2)選擇菜單Modify->Movie,彈出電影屬性對話框,設置如圖所示。

  3)執行Insert->New Symbol,

在對話框中輸入此圖符的名稱為circle,屬性為「Graphic」,單擊OK按鈕。

  4)選擇工具欄中的圓形工具,點擊參數欄中的邊框顏色按鈕,在彈出的菜單中選擇左上角的黑框,表示所畫的圓形沒有邊框
  5)在工作區中畫出一圓形圖片。點擊工具欄中的油漆桶工具,選擇參數欄中填充顏色按鈕,在彈出的顏色菜單中選擇自定義顏色按鈕,切換到Gradient選項卡,新增一漸層顏色如圖所示。左邊顏色箭頭的RGB值為(209,185,221);右邊顏色箭頭的RGB值為(103,27,109)。

  6)用鼠標左鍵點擊圓形圖片,填入漸層顏色。

製作完畢,點擊等時線左上角的Scene1,切換到場景1。
  7)開始按鈕的製作:選擇菜單Insert->New Symbol,輸入它的名稱為btn,屬性為button,

點擊OK按鈕,這時進入圖符btn按鈕編輯模式。

   8)選擇菜單Window->Library,

調出圖符資料庫,點擊Name欄中的circle,拖動上方的圖形到工作區中的適當位置。

  9)選擇工具欄中的箭頭工具,選中圓形圖片,按鍵盤的Ctrl+D鍵,複製它。點擊常用工具欄中的Scale按鈕,這時圖片周圍出現六個白色的小方塊,用鼠標按住位於四個頂點的白色小方塊的任意一個並向中心處拖動。這時您將看到圓形面積縮小。

  10)用鼠標右鍵點擊Over影幀,在彈出的菜單中選擇Insert Keyframe項。選擇菜單Modify->Break Apart,將此圓形圖片打散。

  11)選擇工具欄中的墨水瓶工具,把參數欄中的邊框顏色設置成黃色,線寬設置成8,線型設置成Solid。

移動鼠標並單擊圖形的外圍輪廓,這時您將看到圖形的邊緣出現一個黃色光環。這就是按鈕在「鼠標經過(Over)」時的模樣。

  12)用鼠標右鍵點擊圖層Layer1的「Down」影幀,在彈出的菜單中選擇Insert Keyframe,使「Down」影幀變為關鍵幀。

  13)選擇菜單Window->Inspectors->Transform,

在彈出對話框的Scale域中輸入85.0,

即縮小到原來的85%。這就是按鈕在「按下(Down)」時的模樣。
  14)點擊等時線左上角的Scene1按鈕,切換到場景1。選擇菜單Window->Library,打開圖符資料庫,

從中拖出btn按鈕到工作區的中央。利用步驟13中的方法,調整按鈕的大小為原來的70%。

  15)選擇菜單Control->Test Movie,即可看到所製作的按鈕效果。

TOP

發新話題

本站所有圖文均屬網友發表,僅代表作者的觀點與本站無關,如有侵權請通知版主會盡快刪除。