flex播放器(实现播放、缓冲进度条和音频曲线显示)

上传者：冯莹莹
|
上传时间：2015-04-24
|
密次下载

flex播放器(实现播放、缓冲进度条和音频曲线显示)

Flex 播放器(实现播放、缓冲进度条和音频曲线显示)
一时兴起，玩起了Flex，本来还想要做个Flex 博客，不过目前还只能在里面树个公告。。。没
办法做完啊，河蟹的个杯具的！Flex 布局不像是 CSS，精美 Flash 动画不是拖一个两个控件
就能做出来滴，而是一笔一条线绘制出来滴！这些我都还不熟悉，所有折腾快一个星期了，
每天都是搞到头大才睡觉，今天终于能出一个简单的播放器。
一直很喜欢音乐这个东西，喜欢Jay，更喜欢他的歌，也很崇拜小猪，他的一段灰色空间曾
让我激流奋进，想过自己能做个播客放自己喜欢听的歌曲，出于自恋那样会更有一点点满足
感。呃~走神了，前二天无意看到一群教师的个人博客，深深的被他们的博文所吸引，无论
是谈技术还是记录生活的，写得都是那么的真切，还有坚持每日一博的，坚持不放弃
mx:ProgressBar 实现加载歌曲缓冲进度条
ProgressBar 有三大mode 模式，分别为event、manual、polled，event 为基于事件驱动模式，
可设置source 对象自动显示加载进程；manual 为手动模式，需要调用ProgressBar.setProgress()
方法设置滚动条进度；polled 为轮询模式，本例使用的manual 模式，Sound 加载load 请求
歌曲添加一个ProgressEvent.PROGRESS 处理中监听事件，然后根据Sound 已加载的bytes 和
bytesTotal 数，设置 setProgress 进度。这里需要注意在切换歌曲的时候先要移除
ProgressEvent.PROGRESS 事件，否则之前播放歌曲还未加载完又切换 load 新歌曲时回出现
ProgressBar 触发多个PROGRESS 事件被设置进度出现来回滚动的问题。
mx:HSlide 调节滑秆
这个控件在本例中2 处使用，实现对播放进度和声音大小的控制。最一开始调整播放进度的
问题难倒了我很久，因为在歌曲播放过程中 HSlide 要自动滑动当前播放位置，同时又需要
能手动拖动播放位置，HSlide 本来有一个很好的 change 事件用来侦听改变，但是我使用定
时器设置HSlide 的value 的时竟然也给我触发change 事件，参考了Adobe 哥官网的帮助文
档，说是 Slider 组件的值因鼠标或键盘交互操作而改变时调度，如果 liveDragging 属性是
true，则在用户移动滑块时持续调度该事件。如果 liveDragging 是 false，则在用户释放滑
块时调度该事件。但是无论我怎么设置，在代码里改变了HSlide 的value 值怎会触发change
事件，不是说在用户交互操作而改变时调度吗？无赖啊，后来只能折中采取监听thumbDrag
滑秆拖动时事件，这个事件 Adobe 哥的解释是当按下滑块并随后随鼠标移动时调度，这样
会有一个小问题，就是需要拖动滑秆按下时才会触发，点击无效。
http://wendang.chazidian.computeSpectrum()分析音频曲线
本例你看到显示的音频曲线其实是右64 个绘制成条状的Canvas 控件排列而成，然后使用定
时器每间隔100 毫秒重新设置他们的scaleY 位置以呈现出变幻曲线的效果，代码只有三行很
简单，具体可参见我下面源码给出的 timerTick 事件。这里为什么要用定时器呢？在网上看
别人是监听Event.ENTER_FRAME 事件重绘音频曲线的，不想搞那么麻烦就直接用定时器了，
随便根据bytesTotal 和bytesLoaded 计算下歌曲播放时间，使用 100 毫秒的定时器也并好耗
站资源，CPU 没有涨很高。
效果图：

mxml 代码如下：
代码如下:
?xml version="1.0" encoding="utf-8"?
mx:Application xmlns:mx="http:///2006/mxml" verticalGap="0" scroll="false"
backgroundAlpha="0"
horizontalScrollPolicy="off" verticalScrollPolicy="off" verticalAlign="middle"
horizontalAlign="center"

教育资源为主的文档平台

文档分类