Flash電子書鼠標(biāo)拖拽翻頁效果原理_Flash教程
推薦:制作無限級菜單原來是三級菜單,寫書時(shí)想把它做為例子(第5章的第4個(gè)例子中),于是用遞歸改成無限級的首先得預(yù)備xml文件部分載圖圖片如下:核心代碼:functionaddMenu(m
最近要做些電子書,本來預(yù)備去網(wǎng)上買現(xiàn)成的翻頁效果的組件,但一看報(bào)價(jià)嚇一跳,而且執(zhí)行效率也不高,一個(gè)叫AsFlipPage4.0的組件CPU占用率高居70%,喊價(jià)1000RMB,真是黑心商人。下載了幾個(gè)開源的程序自己也看不懂。于是一咬牙自己做了一個(gè),并放上源程序。過兩星期再把變量接口做好,免費(fèi)發(fā)布。
設(shè)置遮罩和陰影之后的最終品:

主要原理:
- 將電子書分為3個(gè)內(nèi)容層,疊放順序如圖.第一層為當(dāng)前頁面層,是現(xiàn)在正在顯示的頁面;第二層是隨鼠標(biāo)拖拽時(shí)卷起的頁角,第三層是當(dāng)頁角卷起時(shí),露出下一頁的層。
- 設(shè)置遮罩:當(dāng)頁邊卷起時(shí),層1僅顯示四邊形FBDE內(nèi)部分,層2僅顯示ABCD部分,層3僅顯示BGHD部分.
- 旋轉(zhuǎn):層2內(nèi)的內(nèi)容要隨著鼠標(biāo)運(yùn)動(dòng)而不停變換傾斜角度,其角度始終與AC邊斜度一致.
- 翻頁:當(dāng)頁面完全翻過時(shí),層1的當(dāng)前頁數(shù)=當(dāng)前頁數(shù) 1
程序的核心在于如何獲得四個(gè)點(diǎn)ABCD的坐標(biāo),我使用的是求垂直平分線的方法,既:點(diǎn)C是鼠標(biāo)位置,點(diǎn)H是頁角位置,BD既為此兩點(diǎn)間的垂直平分線.由已知的C,H坐標(biāo)求出直線BD的一次函數(shù)y=kx b以后再求出其與FG,EH的切點(diǎn),既得點(diǎn)B,D坐標(biāo),點(diǎn)A是點(diǎn)G于直線BD的對稱點(diǎn),通過求點(diǎn)G對BD的對稱點(diǎn)既可得點(diǎn)A坐標(biāo).
demo1: 4個(gè)頂點(diǎn)的計(jì)算:將鼠標(biāo)移到黃色熱區(qū)并拖動(dòng)
其他幾個(gè)要點(diǎn):
限制C點(diǎn)范圍:當(dāng)鼠標(biāo)在下圖灰色區(qū)域內(nèi)時(shí),點(diǎn)C的坐標(biāo)既等于鼠標(biāo)坐標(biāo),當(dāng)鼠標(biāo)離開灰色區(qū)域時(shí),點(diǎn)C必須停留在區(qū)域內(nèi).弧KML是以點(diǎn)J為圓心,KJ為半徑的圓,弧KNL是以點(diǎn)I為圓心,IK為半徑的圓(demo1既未限制C點(diǎn)范圍,若鼠標(biāo)超過弧形區(qū)域就會(huì)出錯(cuò).

響應(yīng)事件:設(shè)置4個(gè)熱區(qū),分別位于書的4個(gè)頂點(diǎn),分別設(shè)置rollOver,rollOut,releaseOutside,release事件函數(shù).事實(shí)上這一部分函數(shù)編寫極費(fèi)時(shí)間,需要考慮各種各樣的可能性和針對性的處理方法.
鼠標(biāo)吸附及黏滯:當(dāng)鼠標(biāo)進(jìn)入熱區(qū)和快速移動(dòng)時(shí),頁角是逐漸黏附向鼠標(biāo)的,這樣可以使動(dòng)畫看上去更流暢.demo4設(shè)置了吸附,demo1沒有設(shè)置.
陰影:翻頁時(shí)的陰影須時(shí)刻與直線BD的位置保持一致,書的背景陰影要考慮到首頁和末頁兩個(gè)非凡情況.
首頁與末頁:在翻動(dòng)到首頁與末頁時(shí)層3遮罩須重新設(shè)置為整本書寬的1/2
分享:用Flash9/as3跟蹤音頻波形Actionscript3.0提供的新功能,其中用到了ByteArray、SoundMixer。代碼如下:functionfunc(a:Number){returnnum*Math.sin(a);}functiondrawFunction
Flash教程Rss訂閱網(wǎng)站制作教程搜索
Flash教程推薦
猜你也喜歡看這些
- 2005新東方考研Flash課件(英語、政治)
- 精通Flash動(dòng)畫設(shè)計(jì)(附光盤腳本分鏡頭設(shè)計(jì)與典型案例)》
- 新東方4+1flash全部教程
- Flash.ActionScript3.0從入門到精通
- Flash CS4中文版入門與提高
- 閃魂:Flash CS4完美入門與案例精解
- Flash CS3動(dòng)畫設(shè)計(jì)入門提高與技巧(光盤).
- Flash卡通動(dòng)畫設(shè)計(jì)-隨書光盤
- FIF小組FLASH MX 2004實(shí)例視頻教程
- Authorware 7.0 Flash MX 2004多媒體創(chuàng)作實(shí)例導(dǎo)學(xué)
- 相關(guān)鏈接:
- 教程說明:
Flash教程-Flash電子書鼠標(biāo)拖拽翻頁效果原理
。