层次菜单控制部分的制作

楼主^#

更多发布于：2011-12-15 23:32

[] 1


	我们对Windows风格的菜单可以说是极其熟悉了，它良好的交互性以及科学的空间利用率使得操作系统的人机界面非常清晰合理。在我们处理WWW这个操作平台时，能否也创建这么一个使用界面呢？答案当然时肯定的！在网络时代，只有你想不到的，没有你作不到的！　动态菜单的制作关键是熟悉按钮的使用以及MovieClip的嵌套关系等等。下面我们进行教程的制作。按钮的制作：　 FLASH中，按钮可以说是事件触发的最佳工具，我们的菜单当然也需要它。创建任意两个按钮，但是要注意按钮的形状最好可以在组合时重叠上。这样我们就可以省下一些额外的时间。关于这点，我们今后的教程会详细解释。本例中的两个按钮如下所示：图片：66_3710_7f326d8f37e812a.gif 　注意：不要在按钮上安放任何文字。按钮是要重复利用的。层次菜单的布局设置　下面我们来生成层次菜单的框架结构。（注意：本教程为了计量减小图片尺寸，教程中只使用了两桢。在实际应用中，这样作可扩展方面表示很灵活。请读者注意！）　新建一MovieClip并且命名为track。在track中，建立5层，分别命名如图所示：图片：66_3710_37d93a26fe82b12.gif 　现在，以mainbutton层为活动层，放置一个按钮main并且在text层上的相应位置设置说明这个主菜单的文字。本例中，操作结果如下：图片：66_3710_646b67271815c74.gif 　现在以subbutton为活动层，在第二桢增加一个关键桢。以子菜单数为n（注意：此处n仅仅是一个数字，本教程中n为4），在第二关键桢中放置n个sub按钮。为了节省时间，不要将这四个按钮的边际间留有空隙。最后一不工作就是在text层上进行相应的菜单文字注解。本例结果如下：图片：66_3710_fb8a7201e62f9d5.gif 首先我们进行整体控制的制作。在control层的第一桢设置动作为：Stop()，并且生成一个新的关键桢2设置LABEL为showsub。　现在以mainbutton为活动层。我们知道主菜单的作用就是当鼠标经过或点击后显示它所包含的子菜单。因此，对于它的动作我们要达到在鼠标点击它时影片前进到显示子菜单的那一桢。因此我们设置main按钮的动作如下： On (Release) Go to and Stop ("showsub") End On 其中，标记为“showsub”的桢就是对应于整个菜单显示的桢。　以subbutton层为活动层。我们试想当鼠标点击了子菜单中的某一个后，会发生什么呢？当然是整个子菜单要全部隐藏起来，也就是说回复到不显示子菜单的第一桢了。设置每个子菜单行为如下： On (Release) Go to and Stop (1) End On 改进工作　到这里我们以可以进行测试了！看看你的菜单有什么问题？当你的鼠标离开菜单区域会发生什么问题呢？菜单无法消隐! 　针对子菜单的消隐问题，一般的最简单解决方法是使用一个按钮来得到鼠标离开菜单区域这一事件，并进行消隐操作。这里我们使用了一个矩形按钮并且放置在invibutton层上。对这个invibutton进行缩放使它稍微大于整个菜单区域。对invibutton这个按钮赋予相应的行为： On (Roll Over) Go to and Stop (1) End On 图片：66_3710_a13186d0d085bcc.gif 　另外一个问题，即菜单回馈问题我们这里使用一种比较简单的解决方案：变量设置。在每个子菜单对应的按钮中设置相应的行为为： Set Variable: "/:out" = "你选择了第n个教程！祝贺你，这是一个明智的选择！" 其中变量out为主时线上的一个变量名称，这里我们使用了EditableTextFeild来进行输出（使用方法以及设置方法略）。这样我们就可以从菜单得到相应的反馈了！图片：66_3710_f5658314fa54cf3.gif 　到这里我们的教程基本结束了，下面的工作就是将track的一个实例放置到相应的场景中并根据相应的反馈来进行不同的跳转、处理等等了。　现在让我们来测试一下我们的成果吧！