当前位置: 电脑软硬件应用网 > 设计学院 > 网页设计 > 正文 |
|
|||
用Flash快速制作个性化时间显示器 | |||
2005-12-30 19:14:03 文/45IT收集 出处:电脑软硬件应用网 | |||
跟我一步一步来做个个性时间显示器吧! 打开Flash5,新建一个文件,用[Ctrl+M]修改影片属性,帧频不用默认的12,而改为30,这样才比较符合人的视觉差,然后把尺寸改为150×200,其他参数不变,单击确定。建立四个层,在每个层中依次画一个大圆、一个小椭圆、一个三角形和一个长方形,但要注意先后叠加顺序,小椭圆在最上面一层,其次是大圆,最后两层是三角形和长方形,调整这四个图形位置,使它们拼成一个时钟模样。再按[S]键选中墨水瓶工具,用[Ctrl+Alt+I]调出[信息]面板,单击[描绘],选择下面的虚线,然后在每个形状上单击鼠标进行外轮廓的填充,最后效果如图1。 时钟有了,好像还少一个钟摆,下面就来画钟摆。用[Ctrl+F8]新建一个电影剪辑,命名为Arrow。在Arrow的第一帧画一个箭头形状,再按[F8]将箭头转换为符号,并使其稍向左倾斜,然后在第15帧和第30帧上各按[F6]插入一个关键帧,把第15帧的箭头放正,使箭头朝正下方。在第1帧到第15帧以及第15帧到第30 帧之间的任意点上分别右击鼠标,选择[创建动画动作],使他们形成钟摆摆动效果。卧龙传说提醒:箭头符号的中心位置,也就是小十字符号一定要在箭头的尾部,如果不在,可以单击?修改?→?转换? →?编辑中心?来进行修改。 制作时间显示框 按[Ctrl+E]回到主场景,新建一个层,用[Ctrl+L]打开元件库,找到我们建立的Arrow这个电影剪辑,将它拖到刚刚做好的时间显示器的中心位置,然后把该层拖到有大圆层的下面,使大圆遮住部分箭头,而正方形又处于箭头的下方状态。再新建一个层放文本框,按[T]键选中文本工具,画5个文本选项为[动态文本]的文本框,并分别将变量名设为Year、Month、Day、Week和Time。然后将这些文本框相对位置、大小和颜色进行些调整。我们将Year文本框放在三角形上,Month和Day文本框分别放在大圆的上下位置,Week文本框放在小椭圆上,Time文本框放在长方形上。因为这些文本框内显示的是最后的时间和日期。最后,在变量为Day的文本框后面画一个静态文本框,在其中写上[日]字。OK,外观就设计完成。 实现时间显示 在每个层的第3帧上按[F5]键,使第2、3帧都有每个层的第一帧内容。新建一个层,命名为[脚本]。并在第1帧到第3帧上都按[F7]键,都建立空白关键帧。然后在第一帧双击,在打开的帧动作窗口输入以下脚本:(//号后为脚本的解释) mymonths = new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"); myweeks = new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六"); //创建两个数组,用来存放中文自定义的月份和星期。 输完后不要关闭此窗口,单击[脚本]层的第二帧,输入以下脚本: mydate = new Date(); //获取当前时间和日期,并赋给mydate变量。 同样在[脚本]层第三帧输入以下脚本: myseconds = mydate.getseconds()<10 ? ("0"+mydate.getseconds()) : mydate.getseconds(); myminutes= mydate.getminutes()<10 ? ("0"+mydate.getminutes()) : mydate.getminutes(); myhours = mydate.geth-ours()<10 ? ("0"+mydate.gethours()) : mydate.gethours(); //自定义秒、分、时的形式,如果秒分时小于10,则其数前加个'0'的符号。 time = myhours+":"+myminutes+":"+myseconds;//生成时间,时分秒之间用冒号(:)隔开。 year = mydate.getfullyear(); //获取当前完整四位数年份。 month = mymonths[mydate.getmonth()]; //从自定义数组中得到当前月份。 day=mydate.getdate(); //获取当前日期。因为只有数字,所以我们在前面步骤三中要在变量名为day的文本框中自行写一个[日]字。 week = myweeks[mydate.getday()]; //从自定义数组中得到当前星期。 观看动画效果 到此为止,所有脚本输入完成。整个动画也完成了,赶快用[Ctrl+Enter]试试吧,是不是可以看到效果了?最后再按[Ctrl+Alt+Shift+S]输出这个动画,这样就可以将其插入网页中了,具体的插入步骤许多书上就有介绍,这里就不再评述,插入的效果如图2,最后祝你成功! |
|||
最新热点 | 最新推荐 | 相关文章 | ||
解决Fla文件编译SWF后体积过大 Flash代码收集及常见问题解决方法 网页不能播放flash的解决 flash9.ocx 加载错误解决方法 IE(浏览器)无法显示Flash文件 新鲜玩法 Flash动画用电视观看 Flash制作地室中的幽灵火焰 用Flash制作即指即现的广告条 经典!给FLASH初学者的10点制作经验 javascript的下雨效果,比flash的… |
关于45IT | About 45IT | 联系方式 | 版权声明 | 网站导航 | |
Copyright © 2003-2011 45IT. All Rights Reserved 浙ICP备09049068号 |