11-12課按鈕的制作二

1、第課時月日(星期)累計_個教案課題第11-12課時 按鈕的制作二課型新授課1、復習掌握簡單按鈕的應用教學目標2、介紹一些簡單的動作語句3、學會按鈕上的一些簡單語句的應用教學簡單的動作語句的使用教學重點難點教學方法講練結(jié)合與手段動作語句的應用1、press在鼠標指針經(jīng)過按鈕時按下鼠標按鈕。play(); / 按鈕響應后執(zhí)行play (播放)動作on (release) / 當鼠標按下釋放的時候，執(zhí)行下面的語句動作。play(); / 按鈕響應后執(zhí)行play (播放)動作。板 書 設(shè) 計on (releaseOutside) /當鼠標在按鈕外部釋放的時候執(zhí)行下面的語句。play(); / 按鈕響應

2、后執(zhí)行播放動作。on( rollover) /當鼠標滑動到按鈕上時執(zhí)行下面的動作。play(); / 按鈕執(zhí)行播放動作。on( rollOut) /當鼠標滑動到按鈕上并離開時執(zhí)行下面動作。Play(): / 按鈕響應播放動作。on (Drag Over) /當鼠標拖過的時候執(zhí)行下面的動作。play(); / 執(zhí)行播放動作。on (dragOut) /當鼠標拖離按鈕時執(zhí)行下面的動作。play(); / 執(zhí)行播放動作on (keyPress "p") / 當按下鍵盤中的“ p”健時執(zhí)行下面的動作。play();/執(zhí)行播放動作一、復習掌握簡單按鈕的應用1、復習簡單動態(tài)按鈕的制作主

3、要通過一些實例的制作來鞏固練習先講一下上節(jié)課存在的問題：在動態(tài)按鈕中，我們說要制作一個影片剪輯，這個按鈕才會動 起來。有幾個同學另外的都完成了，但是還是不會動，原因就是大家在制作元件的時候選了 圖形而不是影片剪輯，所以才使動畫不動。我們只要把元件的類型轉(zhuǎn)為影片剪輯就可以了， 當然要重新放入到相應的地方才行，不然還是原來的那個。（可以通過實例來講解，以后學 生在做的過程中碰到這類問題就不用重新做過了，在原來的基礎(chǔ)上稍作一下改動就可以。） 動態(tài)按鈕鞏固實例一技術(shù)分析：結(jié)合上周課講的動畫和按鈕結(jié)合來完成第一個按鈕為按下去后動畫（字向兩邊擴散，并變淡）的出現(xiàn)； 第二個按鈕是鼠標放上去后動畫（字變大并變

4、淡的效果）的出現(xiàn)。大家可以根據(jù)平時所學的動畫知識，應用到按鈕中，可以充分發(fā)揮大家的想象力，作出各類 按鈕，這些按鈕在我們以后各式網(wǎng)站的制作，特別是一些比較有特色的網(wǎng)站的制作中用的較 多。2、綜合按鈕的制作（實例二）技術(shù)分析：主要是背景的繪制以及按鈕的動畫（按鈕放上去擴散效果）制作 主要步驟：背景黑條的繪制，畫兩個圓角矩形疊加，刪除重疊部分即可； 小球的繪制，黑球上放白球，上面再寫上字母e； 按鈕的制作，擴散效果的制作，小球填充效果第一幀用調(diào)色工具縮到最小，最后一幀用調(diào) 色工具調(diào)到適當效果，創(chuàng)建變形動畫； 按鈕的彈起狀態(tài)中放入元件大圓和小圓以及數(shù)字，在指針經(jīng)過中放上剛完成的 擴散效果動畫。（動畫

5、只要一次，用stop動作）在此要注意按鈕中的分層，原理同普通的分 層，我們可以把擴散動畫放在下面一層，透過大圓展現(xiàn)出來。 按鈕的小圓動畫制作，綠色變色小球為背景，黃色的曲線作水平轉(zhuǎn)動動畫二、簡單動作介 紹（按鈕制作實例源文件）1、復習上節(jié)課的按鈕，做出禮花 實例三，比較發(fā)現(xiàn)問題，引入動作語句的應用2、on動作命令下面我們就詳細地向大家介紹一下這八種事件的使用。1、press在鼠標指針經(jīng)過按鈕時按下鼠標按鈕。單擊 press，然后選擇動作語句，雙擊 【全局函數(shù)】|【時間軸控制】中的play命令。完整的action是：on （press） / 設(shè)定鼠標事件為按下，然后執(zhí)行大括號里面的語句。play

6、（）; / 按鈕響應后執(zhí)行play （播放）動作press動作當然，在大括號里面還可以用其他的語句，比如說，gotoA ndPlay（youframe）; /點擊按鈕后，就會從你設(shè)置的幀播放。2、 release 在鼠標指針經(jīng)過按鈕時釋放鼠標按鈕。單擊選擇release然后與第一個事 件相同加入play命令。完成的語句如下：on （release） /當鼠標按下釋放的時候，執(zhí)行下面的語句動作。play（）; /按鈕響應后執(zhí)行play （播放）動作。release 動作可以看到，當鼠標左鍵按下按鈕的時候，并沒有激發(fā)播放動作，而是當鼠標左鍵放開的 時候，執(zhí)行了播放動作。這也是與“ press ”事

7、件不同的地方。3、releaseOutside 當鼠標指針在按鈕之內(nèi)時按下按鈕后，將鼠標指針移到按鈕之外， 此時釋放鼠標按鈕。添加語句的方法同上。完整的語句如下：on (releaseOutside) /當鼠標在按鈕外部釋放的時候執(zhí)行下面的語句。play(); / 按鈕響應后執(zhí)行播放動作。releaseOutside 動作通過這個例子我們知道，當鼠標左鍵在按鈕上按住并移動到按鈕以外的地方放開后，觸 發(fā)了按鈕的動作。這是一個具有非常想象力的事件，大家可以利用on的這個事件來制作游戲。4、 rollOver鼠標指針滑過按鈕區(qū)域。制作方法同上，完整的 as語句為：on( rollover) /當鼠標

8、滑動到按鈕上時執(zhí)行下面的動作。play(); /按鈕執(zhí)行播放動作。rollOver 動作當鼠標指針從按鈕上滑過的時候，動畫就開始執(zhí)行播放動作了，而不需要點擊它。我們 可以利用on的這個特點來制作一些圖示板，非常簡單有效。5、 rollOut鼠標指針滑出按鈕區(qū)域。制作方法同上，完整的 as語句為：on( rollOut) /當鼠標滑動到按鈕上并離開時執(zhí)行下面動作。Play(): /按鈕響應播放動作。rollOut 動作滑離與滑過并不是相同的，滑離是指鼠標滑動到按鈕上并離開以后開始響應，而滑過是 指只要鼠標滑到按鈕上，就開始執(zhí)行動作。6 dragOver在鼠標指針滑過按鈕時按下鼠標按鈕，然后滑出此

9、按鈕區(qū)域，再滑回此按 鈕。完整的as是：on (Drag Over) /當鼠標拖過的時候執(zhí)行下面的動作。play(); /執(zhí)行播放動作。dragOver 動作拖過的效果是在按鈕上點擊并按住鼠標不放，移出按扭區(qū)，再移回按鈕上觸發(fā)的事件。7、dragOut在鼠標指針滑過按鈕時按下鼠標按鈕，然后滑出此按鈕。完整的 as是： on (dragOut) /當鼠標拖離按鈕時執(zhí)行下面的動作。play(); /執(zhí)行播放動作dragOut 動作拖離與拖過有所不同，只要在按鈕上按住鼠標左鍵然后移動到按鈕外就會響 應。與滑離的區(qū)別在于拖離需要按住鼠標左鍵。8、keyPress ("key")按下

10、指定的鍵。對于此參數(shù)的 key部分，需指定鍵控代碼或鍵常 量。我們在(“ key”)中鍵入“ p”。完整地as語句為：on (keyPress "p") /當按下鍵盤中的“ p”健時執(zhí)行下面的動作。play(); / 執(zhí)行播放動作3、結(jié)合動態(tài)按鈕綜合實例應用來說明上述的動作語句（實例四）實例演示：禮花的綻放效果（鼠標點擊，禮花綻放）技術(shù)分析：鼠標點擊引發(fā)的事件，即在按鈕的，即為熱區(qū)，按鈕的動作就在這個熱區(qū)觸發(fā)。 由于是鼠標點擊下去才有禮花綻放的效果，所以在禮花綻放的影片剪輯中，第一幀是放入已 做好熱區(qū)的按鈕。第二幀開始才是禮花綻放的動畫，就是禮花這個圖形的放大動畫。然后在

11、幀上及按鈕上加上簡單代碼即可。主要步驟：新建一個按鈕元件，在第四種狀態(tài)“點擊”中畫一個實心區(qū)域（這里可畫一個 白色的長方形） 新建一個影片剪輯，第一幀放入剛做好的按鈕，因為不點擊的時候事件（禮花綻放）不觸發(fā)，第一幀加入動作stop，同時按鈕的動作是點擊就觸發(fā)禮花綻放的事件，因此 在按鈕上加上動作on（press）gotoandplay（2）;這個動作語句可在動作面板中選擇輸入，不用自己輸入（自己打入容易錯，可用腳本校對）on （press）gotoa ndpla y（ 2）;意思是按下按鈕，開始第二幀動作 在第二幀開始禮花的變化，導入禮花圖片并轉(zhuǎn)化為元件，然后作放大的動畫 最后在場景中拖入已經(jīng)完成的影片剪輯，注意在鋪滿整個場景，點擊的時候才 能保證無論點哪里都有禮花綻放，比較逼真些。鋪滿時可用多次復制粘貼。三、小結(jié)注 意一一在給動畫作品添加按鈕的時候應該放到單獨一層，這樣便于修改。提 示一一on為按鈕上的動作，所以我們必須首先要選中按鈕，以后才可以添加on語句。有的朋友在論壇里面提問，“為什么我的on為灰色不可選狀態(tài)？”原因就是你沒有選中 按鈕。技巧在一般flash作品中，大家不會有意區(qū)分這些on的功能的，一般采用默認的 語句。如果沒有特殊說明，你使用了拖離，滑離等事件來制作“ replay ”按鈕，會讓人們摸 不著頭腦的。試一試 一一我們了解了 on