现在的位置: 首页 > 综合 > 正文

打造你完美的音乐播放器 – Flash收音机,聆听电台之声

2013年12月06日 ⁄ 综合 ⁄ 共 3454字 ⁄ 字号 评论关闭

打造你完美的音乐播放器 - Flash收音机,聆听电台之声

打造你完美的音乐播放器 - 从搜索引擎获取MP3地址
打造你完美的音乐播放器 - 从搜索引擎获取LRC歌词
打造你完美的音乐播放器 - LRC歌词与音乐同步播放
打造你完美的音乐播放器 - Flash收音机,聆听电台之声

原文出处:http://www.rogiture.com/blog/article.asp?id=4(转载请注明作者及出处)
作者:Rogiture

要点:
大多数网络电台都是mms流播放的,所以,在flash中无法直接loadSound。
mms流可以在html页面中插入Media Player控件进行播放。
flash与JavaScript可以"畅所欲言"的通信。
JavaScript可以很好的操作Media Player控件。

新建个名为fm.xml的文档,用于记录电台信息。
以下是我搜集的电台信息。(你可以在http://www.chinaradiotv.com/或者搜索引擎中,找到更多的电台地址)

程序代码 程序代码
<?xml version="1.0" encoding="utf-8"?>
    <List>
      <!--属性Name用于记录电台名称,Path为电台地址-->
      <Fm Name="星沙之声" Path="mms://media.csonline.com.cn/fm105"/>
      <Fm Name="湖北交通频道" Path="mms://219.140.196.38/live_JiaoTong"/>
      <Fm Name="星岛中文台" Path="mms://64.71.150.27/canradio"/>
      <Fm Name="QQ之声:欢乐派对" Path="http://qr.fm.qq.com/qqradio?qqradio"/>
      <Fm Name="QQ之声:音乐休闲" Path="http://qr.fm.qq.com/music?qqradio"/>
      <Fm Name="QQ之声:秀radio" Path="http://qr.fm.qq.com/daren?qqradio"/>
      <Fm Name="QQ之声:我的音乐" Path="http://qr.fm.qq.com/mymusic?qqradio"/>
      <Fm Name="QQ之声:幽默相声" Path="http://qr.fm.qq.com/humor?qqradio"/>
    </List>

接着,在flash中读取并解析fm.xml。
然后将电台名称显示出来,当点击电台名称时,播放相应的电台。

新建个名为fm_player.fla的flash文档,
选择主场景第一帧,打开动作面板,输入如下代码:

程序代码 程序代码
//导入包
import flash.external.*;
//创建a标签样式
var cssText:String = "a:link{color:#111111} a:hover{color:#999999} a:active{color:#555555}";
var myStyleSheet = new TextField.StyleSheet();
myStyleSheet.parseCSS(cssText);
/*

*/
//=== 加载电台列表xml ===
//声明xml对象
var fm_xml:XML = new XML();
//设置fm_xml在分析过程中将放弃仅包含空白的文本节点
fm_xml.ignoreWhite = true;
//定义xml对象加载完成事件
fm_xml.onLoad = function(success:Boolean):Void  {
    //如果加载xml成功
    if (success) {
        //获取电台总数
        var sum:Number = this.firstChild.childNodes.length;
        //循环提取电台地址及名称,显示所有电台
        for (var i:Number = 0; i<sum; i++) {
            //创建动态文本,用于显示电台名称
            var txt:TextField = _root.createTextField(i+"_txt"_root.getNextHighestDepth(), 0, i*20+100, Stage.width, 20);
            //文本支持html标签
            txt.html = true;
            //文本居中对齐
            txt.autoSize = "center";
            //文本使用myStyleSheet样式
            txt.styleSheet = myStyleSheet;
            //提取电台名称
            var fmName:String = this.firstChild.childNodes[i].attributes.Name;
            //提取电台地址
            var fmPath:String = this.firstChild.childNodes[i].attributes.Path;
            //显示电台名称,当点击电台名称时,调用playFM函数,播放所选电台
            txt.htmlText = "<a href='asfunction:playFM,"+fmPath+"'>"+fmName+"</a>";
        }
        //删除xml对象
        delete fm_xml;
    }
};
//加载电台列表xml
fm_xml.load("fm.xml");
/*

*/
//播放所选电
function playFM(fmPath:String):Void {
    //调用JavaScript中的playFM函数,并将电台地址传过去,播放所选电台
    ExternalInterface.call("playFM", fmPath);
}

按F12发布你的flash
找到你的fm_player.html,在页面<head></head>标签中插入javaScript函数playFM()。

程序代码 程序代码
<script language="javascript" type="text/javascript">
/*
让id为media的Media Player控件播放在flash中所选电台,函数接收flash传来的电台地址
*/

function playFM(s) {
    media.URL = s;
    media.controls.play();
}
</script>

在页面<body></body>中插入一个id为media的Media Player控件,用于播放mms流,放入不可见的层中。

程序代码 程序代码
<div style="display:none">
  <OBJECT 
  id=media
codeBase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701standby=Loading 
type=application/x-oleobject height=0 width=
classid=CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6 components... Player Media? 
Windows Microsoft?>
  </OBJECT>
</div>

因flash player安全机制的原因,必须在web中浏览fm_player.html。
你可以在rogiture.com进行 预览 下载文件下载源文件

本来还想写篇怎么制作将前几篇所说的功能全整合在一块的播放器,看来是没必要了 ^_^。
搜了一下,制作音乐播放器的教程是在太多了。  

抱歉!评论已关闭.