您的位置:首页网页设计Flash → Flash MX实战精选:从前有座山

Flash MX实战精选:从前有座山

时间:2004/11/7 2:19:00来源:本站整理作者:蓝点我要评论(0)

  实例说明



  制作一本可以翻页的书,讲述一个古老的故事。



  有关知识



  隐形按钮,tellTarget的应用,对象的缩放、变形及中心点编辑,关键帧动画等。



  制作过程



  步骤1:打开flash MX,按Ctrl+M,在电影属性对话框设置播放速度:18fps;大小:450px*300px;背景颜色:白色。



  步骤2:从菜单栏中选择插入>添加符号(Insert>New Symbol),在出现的对话框中选图像(Graphic),命名为cover,用绘图工具在舞台画一本书的封面,左上角对齐舞台的中心点,如图1所示。

图1制作图书封面




  步骤3:制作书的内页。新建图像符号page,用矩形工具绘制大小和cover相等的矩形, 左上角对齐舞台的中心点。



  步骤4:新建隐形按钮button, 选取Hit帧,按F6插入一个关键帧,在舞台用矩形工具画一长方形,如图2所示。

图2制作隐形按钮


  步骤5:新建电影片断pages,新建book层,将第1帧设为空白帧(blank keyframe),Actions设置为停止(stop)。



  在第2帧处按F7插入空关键帧,将图像cover放置在舞台内,左上角和舞台中心点对齐。



  在第3帧处按F7插入空关键帧,将图像page放置在舞台内,并和图像cover对齐。



  在第8帧按F5插入帧,使book层的帧长度为8帧,如图3所示。

图3制作层book,对齐中心点


  步骤6:新建button&page层,放置在book层上面,同样将第1帧设为空白帧,在第2帧处插入关键帧,将隐形按钮button放置在层中,并利用缩放工具将按钮大小拉伸为和cover同样大小并覆盖在cover上方。



  在3,4,5,6,7,8帧处分别建立关键帧,用文字工具写上书的页数1, 2, 3, 4, 5, 6。如图4所示。

图4给电影加上隐形按钮和页数


  步骤7:新建text层和pagebutton层,其中text层加入文字,而pagebutton层放入对应的按钮。在第4、第5帧处建立关键帧,制作书本的向后翻页按钮next; 在第5、第7帧处建立关键帧,制作书本的向前翻页按钮pre;在第8帧处建立按钮close,作用是当按下此按钮,书本关上,返回到初始状态。如图5所示。

图5建立关闭书本按钮


  步骤8:新建电影片断book,帧长度为37帧。增加cover层,将图像cover放置在舞台内,左上角和舞台中心点对齐。第2至37帧为空白帧。如图6所示。



  步骤9:新建rightflip层,将电影片断pages放置在舞台内,和舞台中心点对齐。在属性面板将其命名为rightflip。如图6所示。

图6 rightflip的位置


  提示:因为电影片断pages第一帧为空白帧,所以在舞台上只能看到一个小空心圆。



  步骤10:在rightflip层下新建leftpage层。将电影片断pages放置在舞台内,并在Instance面板将其命名为leftpage,如图7所示。

图7放置rightpage


  提示:leftpage水平方向和rightflip平行,并相距一本书的距离。也就是当这本书打开以后,左边的效果要由leftpage完成,所以位置一定要放好.。



  步骤11:在rightflip层上方新建leftflip层。将电影片断pages放置在舞台内,和rightflip对齐,并将其命名为leftflip,这个层主要是用来表现翻页效果。



  提示:因为电影片断pages第一帧是空白帧,表现在层中是一个小空心圆,效果很不直观,这时如果先将pages的第1帧删除,就能更直观的调整效果了(光盘中的d.fla为已删除第1帧的源程序),当然在做好电影片断book后,别忘了再将第1帧还原为空白帧。如图8所示。

图8好象两本书并排,效果更直观


  选中第2帧、第9帧,按F6将其分别设为关键帧。在Transform面板,将第9帧处的pages的水平缩放设置为85%,垂直变形设置为-85,如图9所示。

图9设置变形


  在第10帧建立空关键帧,将电影片断pages放置在舞台上,水平方向和第2帧对齐,垂直方向在第2帧的左边一本书的距离,选择修改>变形>编辑中心点(Modify>Transform>Edit center)命令,将pages的中心点移至右上角,如图10所示。

图10编辑中心点


  选中第18,19,20,29帧,按F6建立关键帧。



  将第10,第29帧处pages的Transform设置为:水平缩放85%;垂直变形85。如图11所示。

图11设置Trnsform


  将第19帧的pages拖放在舞台外。



  拷贝第9帧至30帧;拷贝第2帧至36帧;拷贝第19帧至37帧。



  第36帧处pages的Transform设置为:水平缩放95%;.垂直变形-10。



  在Frame面板中,将第2至9,10至18,20至29,30至36帧的渐变设置为移动(Motion),如图12所示。

图12产生移动渐变


  新建Actions层,在第1,2,10,18,19,20,29,37帧处建立关键帧,并分别设置其Actions:



  第1帧:



stop (); //停止



tellTarget ("rightflip") { //告知目标(“rightflip”)



  nextFrame (); //跳至下一帧



}



  第2帧:



tellTarget ("rightflip") { //告知目标(“rightflip”)



  nextFrame (); //跳至下一帧



}



tellTarget ("rightflip") { //告知目标(“rightflip”)



  nextFrame (); //跳至下一帧



}



tellTarget ("leftflip") { //告知目标(“leftflip”)



  nextFrame (); //跳至下一帧



}



  第10帧:



tellTarget ("leftflip") { //告知目标(“leftflip”)



  nextFrame (); //跳至下一帧



}



  第18帧:



tellTarget ("leftpage") { //告知目标(“leftpage”)



  nextFrame (); //跳至下一帧



}



tellTarget ("leftpage") { //告知目标(“leftpage”)



  nextFrame (); //跳至下一帧



}



  第19帧:



stop (); //停止



  第20帧:



tellTarget ("leftpage") { //告知目标(“leftpage”)



  prevFrame (); //跳至上一帧



}



tellTarget ("leftpage") { //告知目标(“leftpage”)



  prevFrame (); //跳至上一帧



}



  第29帧:



tellTarget ("leftflip") { //告知目标(“leftflip”)



  prevFrame (); //跳至上一帧



}



  第37帧:



tellTarget ("leftflip") { //告知目标(“leftflip”)



  prevFrame (); //跳至上一帧



}



stop (); //停止



tellTarget ("rightflip") { //告知目标(“rightflip”)



  prevFrame (); //跳至上一帧



}



tellTarget ("rightflip") { //告知目标(“rightflip”)



  prevFrame (); //跳至上一帧



}



  步骤12:回到电影片断pages,在层button&page的第2帧处,将按钮button的Actions设置为:



on (release) { //当鼠标放开



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (2); //跳至并播放帧(2)



  }



}



  提示:因在电影片断book中使用pages,所以告知目标(“..”)表示告知电影片断book。



  步骤13:在pagebutton层,分别设置按钮的Actions。



  第3帧按钮next的Actions:



on (release) { //当鼠标放开



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (2); //跳至并播放帧2



  }



}



  第4帧按钮pre的Actions:



on (release) { //当鼠标放开



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (20); //跳至并播放帧20



  }



}



  第5帧按钮next的Actions:



on (release) { //当鼠标放开



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (2); //跳至并播放帧2



  }



}



  第6帧按钮pre的Actions:



on (release) { //当鼠标放开



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (20); //跳至并播放帧20



  }



}



  第7帧按钮close的Actions:



on (release) { //当鼠标放开



  tellTarget ("../leftpage") { //告知目标(“../leftpage”)



    gotoAndStop (1); //跳至并停止帧1



  }



  tellTarget ("../leftflip") { //告知目标(“../leftflip”)



    gotoAndStop (2); //跳至并停止帧2



  }



  tellTarget ("../rightflip") { //告知目标(“../rightflip”)



    gotoAndStop (4); //跳至并停止帧4



  }



  tellTarget ("..") { //告知目标(“..”)



    gotoAndPlay (32); //跳至并播放帧32



  }



}



  这样,当按下按钮 next时产生向后翻页动作;当按下按钮pre时,产生向前翻页动作;按下按钮close时,回到初始状态。



步骤14:回到场景中,将电影片断book放置在场景中,摆放好位置,.如图13所示。

图13将电影片断拖入场景


  步骤15:现在可以按Ctrl+Enter测试效果。



  当然输出效果是在内页里是添加了一些图形后的形成的,可以在电影片断pages中另放一些画面,以表达一个完整的故事,页数也可以设定。

相关阅读 Windows错误代码大全 Windows错误代码查询激活windows有什么用Mac QQ和Windows QQ聊天记录怎么合并 Mac QQ和Windows QQ聊天记录Windows 10自动更新怎么关闭 如何关闭Windows 10自动更新windows 10 rs4快速预览版17017下载错误问题Win10秋季创意者更新16291更新了什么 win10 16291更新内容windows10秋季创意者更新时间 windows10秋季创意者更新内容kb3150513补丁更新了什么 Windows 10补丁kb3150513是什么

文章评论
发表评论

热门文章 没有查询到任何记录。

最新文章 Flash CS4基础入门 如何在Flash中打开一个定制的浏览器新窗口?学习ActionScript 3.0的6个好处几个小技巧精简Flash文件体积在Flash动画中添加“加为收藏”和“设为首页

人气排行 Flash游戏制作--小熊拼图用Flash实现几种镜头效果Flash制作动画知识:遮罩Flash如何做鼠标指针样式Flash制作环形文字Flash制作声情并茂的电子相册实例讲解flashMTV制作全过程(3)鼠标效果系列教程:游动的鱼