• 微课视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
微课江湖
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 微课视频
  • photoshop
  • Fireworks
  • CorelDraw
  • Illustrator
  • Painter
  • Freehand
  • Indesign
  • flash
  • maya
  • autocad
  • 3dmax
您的位置:首页 > 平面设计 >flash > Flash AS3创建一个横向滑动的导航条菜单

Flash AS3创建一个横向滑动的导航条菜单

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-05-24

佚名 向大家分享了Flash AS3创建一个横向滑动的导航条菜单,其中包含flash as3教程,flash as3 api,flash as3帮助,flash as3视频教程,flash游戏修改器as3等知识点,遇到此问题的同学们可以参考下

在这篇教程里我们将学会如何利用Flash AS3创建一个横向滑动的导航条菜单,教程制作的导航条非常棒,方法也很简单,转发过来,希望对大家有所帮助。

最终效果预览让我们看一看我们将要做的作品的最终效果



第一步:创建文本新建一个600*300px的Flash Actionscript3.0文件,首先,选择文本工具并输入你的导航菜单文字,在这个教程中,我用的是Button1|Button2|Button3|Button4,字体选择Arista Light,大小为30点,颜色选择#999999.然后进入对齐面板(如果你看不到它的话就点击窗口>对齐),使文本相对于舞台水平中齐,垂直中齐。



第二步:画一个按钮

将当前的图层重新命名为文本并将其锁定,这样就不会误将其修改。然后创建一个名为按钮的新图层。选择矩形工具并在button

1″的边缘外画一个矩形(任意颜色)。这将是你菜单条中可以点击的区域。



第三步:完善按钮选中你刚刚画的矩形,执行修改>转化为元件,并将其命名为按钮。确保注册点在中间(你可能还要使用对齐面板)

然后,在属性面板中,将其实例名称命为button1″并将alpha值设为0%。



第四步:添加更多的按钮复制你的无形的按钮,并将其粘贴到其它三个按钮中,并分别将其实例名称命为button2,button3,button4″使用任意变形工具将它们放大或缩小,使它们正好在菜单条的外框,且每个之间没有间隔。



第五步:画条栏(bar)还是选择矩形工具,将矩形边角半径设为5pixels并画一个高为4pixels,宽和第一个按钮差不多的矩形。

把它放在第一个按钮的下面,点击修改>转化为元件并将其命名为bar。确保注册点在中间。

将它的实例名称命为bar,且和那些按钮一样alpha值为0%。将按钮图层锁定,并创建一个新的图层命名为动作也将这一层锁定。现在在你新建的动作图层上的第一帧上单击右键,并点击动作。



第六步:输入类


我们需要使用这些代码和补间类让条栏动起来,所以将这些导入。这个缓动类也是必须的,这样我们就可以明确所使用的补间动作类型。

第七步:定义变量


为补间条栏定义这些变量

第八步:添加事件监听器


看起来好像有很多代码,但是它们确实很简单

首先我们添加一个事件监听器,当鼠标滚动到Button 1的时候就执行rollOverHandler函数。然后我们添加另一个事件监听器,当鼠标在Button 1范围之外时就执行rollOutHandler 函数。像这样这些监听器可作用于这四个按钮。

第九步:函数

引用:

当鼠标在按钮之上时,将执行rollOverHandler
功能,这将使条栏从它当前的位置运动到鼠标当前所指的按钮的位置。如此以来这个条栏就会平稳水平地运动。然后,条栏的alpha值将会从当前值变到1(100%alpha),宽将从当前值变到与引发Handler功能的按钮相同的宽度。

当我们将鼠标移出按钮时,rollOutHandler功能将被执行,条栏的alpha值将会从当前值变到0(全透明)。

由于按钮之间没有缝隙,紧贴在一起,所以如果你立刻将鼠标移出所有按钮所在的区域,你只会看到条栏消失了,否则它又会太快的显示出来,这样你就看不见了。

总结:

现在你应该可以得到与教程上差不多的作品了。很棒。你已经学会了如何使用ActionScript 3.0中的补间类创建有效的动画菜单,这与众不同的菜单将更吸引人们的目光。

后续:为每一个按钮添加一个鼠标点击监听器和执行器当我们在其上点击的时候出现不同的动作如何?

教程结束,以上就是Flash AS3创建一个横向滑动的导航条菜单过程,希望大家喜欢这篇教程!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • flash文本竖排效果实现as3代码
  • Flash AS3 连锁反应的粒子动画
  • Flash AS3 制作文字飞出动画
  • Flash AS3 快速制作烟雾动画
  • Flash AS3代码实现鼠标跟随喷枪涂鸦效果
  • Flash AS3的parameters对象处理网页参数
  • FLASH AS3与网页JS参数值传递的问题
  • 从基础开始深入学Flash AS3教程(6)(译文)
  • Flash as3教程:OutDisplay类
  • 从基础开始深入学Flash AS3教程(7)(译文)

相关文章

  • 2017-05-24用flash制作一种从一种颜色变化的七彩文字动画
  • 2017-05-24Flash鼠绘技巧:红绿色的树叶
  • 2017-05-24在flash中制作由花生组成的好看花型
  • 2017-05-24Flash制作一幅诗意的水墨卷轴展开的动画
  • 2017-05-24Flash cs3鼠绘教程:绘制一只可爱猴子的动画技巧介绍
  • 2017-05-24Swf2Gif快速将flash动画变成GIF格式
  • 2017-05-24Flash几张图片首尾连接循环滚动
  • 2017-05-24Flash AS特效:超绚丽的闪字动画
  • 2017-05-24flash cs6怎么新建影片剪辑元件?
  • 2017-05-24利用flash制作百叶窗效果

文章分类

  • photoshop
  • Fireworks
  • CorelDraw
  • Illustrator
  • Painter
  • Freehand
  • Indesign
  • flash
  • maya
  • autocad
  • 3dmax

最近更新的内容

    • Flash AS3.0构建声音可视化程序(波形图)教程
    • 用纯Flash Actionscript做的火柴棍小人跑的动画
    • Flash AS入门教程:Flash AS3.0制作有年份有日期的时钟
    • flash制作出来的小动画怎么导出正常清晰(无色差)GIF图片
    • 教你用Flash AS行代码简单画一棵漂亮的树
    • flash制作旋转飞舞的雪花
    • Flash游戏开发教程:第三节
    • Flash怎么把素材导入库?
    • flash绘制势能动能相互转化的动画效果
    • 从基础开始深入Flash AS3教程(2)(译文)

关于我们 - 联系我们 - 免责声明 - 网站地图

©2015-2018 All Rights Reserved. 微课江湖 版权所有