Adobe Edge Animate 1.0 -- 制作自定義動態菜單
版權聲明:
本文版權屬於 北京聯友天下科技發展有限公司。
轉載的時候請注明版權和原文地址。
之前講過在Edge中使用Bootstrap制作菜單按鈕的例子，那么我們是否可以自主設計並制作一個含有動畫菜單呢？答案當然是可以，下面用一個簡單的例子為大家講解如何制作自定義動態菜單。
一、制作菜單元件：
1.這是菜單元件list：
2.list內部結構：由一個按鈕btn_list和菜單構成
3.btn_list內部結構：
二、為菜單添加動畫：
1.如圖，進入list內部，將播放頭拖至1.0秒處，添加標簽list_open，在list_backgroud上右擊選擇add keyframe -->top，然后將list_backgroud拖到場景之外；
2.拖動播放頭至1.750秒處，然后拖動list_backgroud到途中位置；
3.將播放頭拖至2.0秒處，然后將list_backgroud拖動到最終位置
敲擊空格鍵預覽動畫，可以看到動畫有個彈性緩沖的效果。
4.將播放頭拖至2秒，選中動畫條，復制，然后菜單Edit-->Paste Special-->Paste Inversed，復制一個反向的動畫，添加標簽list_close。
二、添加控制代碼
1.因為我們要點擊按鈕才開始彈出菜單，所以在list元件的開始要添加不播放動畫的代碼：在0秒處添加觸發器；
2.因為我們點擊按鈕的時候，要判斷列表是否已經打開，來決定播放打開還是關閉列表，所以在這里還要添加一個變量來判定：
3.在打開列表動畫結束的時候（2.0秒）將變量修改：
4.在關閉列表動畫結束的時候（3.0秒）修改變量：
5.為按鈕btn_list添加click事件：
6.修改按鈕的鼠標指針為小手，在瀏覽器中預覽效果。
三、制作列表顯示反饋文字：
在舞台中添加一個Text文本，內容為空，用於下面點擊列表內容反饋的信息顯示：
四、添加列表文字：
1.添加一個列表項目文字，為了讓文字跟隨列表背景運動，將list_backgroud的動畫復制到Title_one上：
2.為文字添加控制代碼：mouseover、mouseout
3.添加click事件：
在瀏覽器中預覽，可以看到效果。
4.我們將Title_one復制，調整好位置，改名為Title_two
5.進入click事件，將反饋信息修改為You Click The List Title Two！，將mouseover和mouseout事件里面的Title_one也改為Title_two即可。
在瀏覽器中預覽，可以看到點擊不同的文字，反饋不同的信息，這樣就可以由列表來控制動畫的播放了。
本文地址：
http://www.cnblogs.com/adobeedge/archive/2012/12/07/Adobe_Edge_Animate_List.html
作者：北京聯友天下科技發展有限公司 肖偉民