音量滑块的实现
调节音量时,通常都是用鼠标直接拖拽,而不是输入数字。所以,前面的设计还是太简陋了。当然,饭要一口一口的吃,遵循这个原则,我也尽量使用循序渐进的办法完成本教程。现在进入主题: 一、外观设计 在这里牵扯到拖拽,只有影片剪辑才可以有。所以,必须将滑块制作成影片剪辑。另外,为了方便最终的功能整合,我们将滑块和凹槽整个都制作成影片剪辑。所以,步骤如下: 1、制作影片剪辑用来容纳整个滑块: 按Ctrl+F8键插入一个影片剪辑【“名称”里输入“滑块”(不是必须的,但是强烈推荐重新命名,方便后期的调试)】 2、制作凹槽: 使用矩形工具,去掉边框色,填充设置为黑色,绘制一个矩形。搞定后,用选择工具选中,在属性面板内设置宽度为104,高度为6,然后Ctrl+k,调整位置 由于凹槽不参与任何的交互,因此,不用转换成元件。直接保持“形状”属性即可 3、制作滑块: 新建一个图层,用矩形工具绘制一个小小的矩形充当滑块,设置其宽度为4,高度为18 说明:凹槽的宽度104=100+4 这个4就是滑块的宽度。这样设计的目的是,当滑块拖到最右侧时,正好是100个像素的长度,和音量能对应起来,方便编程。 然后按F8键,转换成影片剪辑【名称里输入“方形滑块”,注册点设置为左侧中央,如下图所示】 搞定后,在属性面板内更改一下该方形滑块的x坐标为60(这样就可以让声音的默认音量为60%)。并设置一个实例名,假设是fxhk 二、代码编写 用选择工具单击舞台上的方形滑块,打开动作面板,输入代码如下: 本帖隐藏的内容需要回复才可以浏览 三、大功告成,测试影片。效果出来了吧。 该滑块文件独立下载------> 本帖隐藏的内容需要回复才可以浏览
最近访问本帖者列表: | |||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||
四、现在,我们将这个“滑块”影片剪辑整合入前面制作的播放器内
1、在库面板内复制,然后打开前面制作的播放器,新建一个图层,然后舞台上直接粘贴,打开属性面板,设置实例名为hk 2、关闭制作的滑块fla文档,现在操作播放器fla文件了 3、在代码图层,加上如下一行: mymusic.setVolume(hk.fxhk._x) 4、进入滑块影片剪辑内,单击方形滑块后,代码修改为如下: 本帖隐藏的内容需要回复才可以浏览 5、测试影片,效果出来了 五、源码下载:该源码将频谱修改为Part3续里的样式。由于是用代码生成的,为了控制其是否动起来,专门制作了 一个影片剪辑,方便用代码操控。 本帖隐藏的内容需要回复才可以浏览 | |