发新话题
打印

[教材] 用 Flex3.0 做一个简单 Flv 播放器 ( AIR _ 教程 )

用 Flex3.0 做一个简单 Flv 播放器 ( AIR _ 教程 )

今天早上, 以前高中同学要我教他用 Flex 写一个 flv 播放 器. 网上应该也有不少的教程了, 但, 中午吃完饭后, 觉得自己写写也不错, 毕竟自己很少在自己  博客上写写教程 ,  于是就就写写这了..... ..有错误请高手指出...
以下为我今天写在博客上的一篇简单教程:


        用 AS2.0 做的 flv 播放器不少了, Flex 3.0 早期又出了, 就尝试着做一个 flv 播放器. 用 Flex3.0 写出来的东西, 本人觉得, 其产物可以是 flex , 也可以是 AIR ( 早期的 Apollo ).  好了, 不多说,  先睹为快:
--------------------------------------------------------------------------- [ 出外: www.RIAhome.cn ]

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
  <![CDATA[
     import mx.events.SliderEvent; // 这里是导入所需要的类, 用 import 关键字, 没什么好说的
     import mx.events.VideoEvent;
// 自定义一个 playingMove() 函数, 作用: 影片播放时, id 为 " my_hs " 的HSlider 控件的值为影片的播放时间, 且最大值为影片的总时长
     private function playingMove(event:VideoEvent):void{
        my_hs.value = flvideo.playheadTime;
        my_hs.maximum=flvideo.totalTime;
   }

// 自定义 hs_onChange() 函数, 作用: 当用户拖拉 HSlider 控件使其值发生改变时,  影片的播放头就处于其值处, 即正在播放时间处于其值处
    private function hs_onchange(event:SliderEvent):void{
       flvideo.playheadTime = event.value;
   }
  ]]>
</mx:Script>
<mx:VideoDisplay id="flvideo"  playheadUpdate="playingMove(event)"  x="66" y="38" width="343" height="245" />
<mx:Button  label="Play" click="flvideo.source='targetMovie.flv'" x="223" y="322" />
<mx:HSlider  minimum="0"  id="my_hs"  change="hs_onChange(event)"   x="176" y="302" />
</mx:Application>

---------------------------------------------------------------------------[ 出外: www.RIAhome.cn ]
其中:
<mx:VideoDisplay> 标签内的属性 playheadUpdate="playingMove(event)"  就表明: 当影片在播放时, 执行 playingMove() 函数;
<mx:Button> 标签内的属性 click="flvideo.source='targetMovie.flv'"  表明: 当用户单击按钮后, id 为 " flvideo " VideoDisplay 控件就播放 targetMovie.flv 影片.
<mx:HSlider> 标签内的属性 change="hs_onChange(event)"  表明: 当用户拖拉 HSlider 控件而使其值改变时, 执行 hs_onChange() 函数.
---------------------------------------------------------------------------
详细解释都写在上面了, 认真看就会明白的.  
如有什么错误的地方, 恳请高手们指点一下....
有问题可以到我 博客 留言的. 我每天都会更新内容, 您的留言我肯定会回复的.
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

看来很少人对 Flex 感兴趣......
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

不错.顶下,

TOP

我还在用FLEX2.0B

TOP

引用:
原帖由 8765004 于 2007-6-17 16:37 发表
我还在用FLEX2.0B
嘻嘻...... 一起学习交流. .....
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

最近注意留意了下大家网页上的播放器的代码,大部分还是内用FLASHPLAYER7.0甚至还有用6.0,哈,结果呢,你用AS3.0做出来的东西就很难在其页面上播放,如有一个单位举办FLASH比赛,结果用FLASH9做的作品就没有办法在他页面上在线播放.因为他用的内放播放器是6.0哈.虽然你本机已经更新了播放器也没有用的.

[ 本帖最后由 8765004 于 2007-6-17 17:25 编辑 ]

TOP

同时垮系统的桌面程序运行时框架Appolo什么时候将推出一个新版本?

TOP

引用:
原帖由 8765004 于 2007-6-17 16:54 发表
最近注意留意了下大家网页上的播放器的代码,大部分还是内用FLASHPLAYER7.0甚至还有用6.0,哈,结果呢,你用AS3.0做出来的东西就很难在其页面上播放,如有一个单位举办FLASH比较,结果用FLASH9做的作品就没有办法在他 ...
此问题思考中......
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

不会  学习一下

TOP

我很感兴趣,可是不知道该如何学习,尤其是和数据库相关时如何编写程序(asp、jsp、php都不熟悉),想请教大侠们

[ 本帖最后由 richard_whx 于 2007-6-17 18:54 编辑 ]

TOP

一点儿都看不懂,呵呵!!
纯顶了!

TOP

恩,这里用的是flex自带的VideoDisplay 组件,然后添加相关的触发事件

假如用Apollo或者MDM来打包制作,这样就是个桌面小程序了,也能open路径进行浏览本地文件,

效果和其他程序制作出的播放器功能就差不多了,呵呵~
寻觅终生伴侣!

my blog

TOP

引用:
原帖由 终极讨厌 于 2007-6-17 18:53 发表
一点儿都看不懂,呵呵!!
纯顶了!
也谢谢讨厌的支持!

楼上的说得没错, 可以做个桌面应用程序. 做客户端的. 不过现在 apollo 已经改为 AIR 了.
Flex3 是一个很不错的东西..
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

演示在哪里呢 没找到啊

TOP

引用:
原帖由 jevin 于 2007-6-18 10:19 发表
演示在哪里呢 没找到啊
不好意思.....
没放上演示....... 请您直接复制代码到 Flex 上运行一下 .....
AS3,flex等等...技术博客: www.RiaHome.cn
rss阅读地址: http://feed.feedsky.com/youngboy

TOP

我有兴趣

TOP

我也在学习 Flex  不过还是2.0 的
FLASH Everyday

TOP

好东西!

TOP

我照你的代码写的为什么拖动没有效果啊

TOP

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()">
        <mx:Script>
                <![CDATA[
                        import mx.binding.utils.BindingUtils;
                        import mx.events.SliderEvent;
                        import mx.controls.Alert;
                        import mx.events.VideoEvent;
                        private var i:int=0;
                        [Bindable]
                        private var total:String="";
                        private function init() : void
                        {
                                myVid.addEventListener(VideoEvent.COMPLETE, function(event : VideoEvent) : void
                                        {
                                                Alert.show("complete!");
                                                //myVid.source=null;
                                                //myVid.source="phone.flv";
                                        }
                                );
                                myVid.addEventListener(VideoEvent.READY, function(event : VideoEvent) : void
                                        {
                                                Alert.show("ready!",myVid.totalTime.toString());
                                                my_hs.labels=['0',formatTimes(myVid.totalTime)];
                                        }
                                );
                        }
                         private function playingMove(event:VideoEvent):void{
                               
                         my_hs.value = event.playheadTime;   
                                my_hs.maximum=myVid.totalTime;   
              
                           }  
                           
                      private function playUrl(url:String):void  
                            {   
                            Alert.show("dddd",url);
                                if(myVid.playing)   
                                 myVid.stop();   
                           
                        myVid.source = url;   
                        myVid.play();   
                    }   
                        private function formatTimes(value:int):String{   
                var result:String = (value % 60).toString();   
                  
                if (result.length == 1){   
                    result = Math.floor(value / 60).toString() + ":0" + result;   
                } else {   
                    result = Math.floor(value / 60).toString() + ":" + result;   
                }   
                return result;   
            }
                           private function hs_onchange(event:SliderEvent):void{   
                               myVid.playheadTime = event.value;   
                           }
                           private function video_ready():void{
                                   Alert.show("ready!");
                           }
                ]]>
        </mx:Script>
            <mxanel title="VideoDisplay Control Example" height="75%" width="75%"
        horizontalAlign="center"
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

       <mx:Text width="75%" color="blue"
           text="Use the buttons to control the video. The Stop button resets the video to the beginning."/>

                <mx:VideoDisplay id="myVid"  height="158" width="211" playheadUpdate="playingMove(event);" source="http://www.helpexamples.com/flash/video/water.flv" autoPlay="true"  />
                <mx:HBox>
                    <mx:Button label="lay" click="myVid.play();"/>
                    <mx:Button label="ause" click="myVid.pause();"/>
                    <mx:Button label="Stop" click="myVid.stop();"/>
                </mx:HBox>
         <mx:ControlBar id="ctrlBar1" x="10" y="357" width="545" height="52">   
        <mxabel x="480" y="341" id="playtime"   
        text="{formatTimes(myVid.playheadTime)} : {formatTimes(myVid.totalTime)}"  
        color="#ffffff"/>   
        <mx:HSlider minimum="0" value="{Number(formatTimes(myVid.playheadTime))}"  id="my_hs" maximum="{Number(formatTimes(myVid.totalTime))}"  change="hs_onchange(event)" width="179"/>   
         
    </mx:ControlBar>  
        </mxanel>
</mx:Application>
这是我的代码 你能帮我看哈错在哪里啊

TOP

T_T
我说楼上。。。
先看看顶的是哪年的帖子好不。。

TOP

不错
学习

TOP

发新话题