云下的天空

坚持 随心而动 走自己的路

 

利用TitleWindow和VideoPlayer组件轻松实现视频弹出播放效果

  原文链接:
http://www.iyoya.com

Adobe在Flex4后提供了一个VideoPlayer组件,它是可以设置外观的视频播放器组件,并支持渐进式下载、多比特率流和流视频。它支持播放 FLV 和 F4v 文件。VideoPlayer控件包含控制视频播放的全能 UI。我们只要利用这个组件就可以快速的创作自己的视频播放器。如果将TitleWindow和VideoPlayer组件接合一起使用便可以轻松的实现视频弹出播放的效果。
下面为一个示例的代码:

组件
CustomTitleWin.mxml
<?xml version="1.0" encoding="utf-8"?>
<!-- Simple custom MXML Spark TitleWindow component.
The TitleWindowApp application displays this component.
You cannot run it independently. -->
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               title="Video Player" width="400" height="300" close="titlewindow1_closeHandler(event)">
    <s:layout>
        <s:VerticalLayout />
    </s:layout>
    <fx:Script>
        <![CDATA[
            import mx.controls.Text;
            import mx.events.CloseEvent;
            import mx.managers.PopUpManager;
 
            [Bindable]
            private static var playState:Boolean=true;
            protected function titlewindow1_closeHandler(event:CloseEvent):void
            {
                video.stop();
                playState=false;
                PopUpManager.removePopUp(this);
            }
        ]]>
    </fx:Script>
    <s:HGroup width="100%" height="100%" paddingBottom="5" paddingLeft="5" paddingRight="5" paddingTop="5">
        <s:VideoPlayer width="100%" height="100%" id="video" autoPlay="{playState}" loop="false" source="rtmp://fmsexamples.adobe.com/vod/mp4:_cs4promo_1000.f4v"/>
    </s:HGroup>
</s:TitleWindow>

主程序SampleApp.mxml

<?xml version="1.0"?>
<!-- Main application to demonstrate Halo TitleWindow layout container. -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               width="500" height="350" backgroundColor="#F3F3F0">
    <fx:Script>
        <![CDATA[
            import flash.events.Event;
 
            import mx.core.IFlexDisplayObject;
            import mx.managers.PopUpManager;
            import spark.components.TitleWindow;
 
            private function showWindow():void {
                var videoWin:CustomTitleWin = CustomTitleWin(PopUpManager.createPopUp(this, CustomTitleWin , true));
                videoWin.x=(stage.stageWidth-videoWin.width)/2;
                videoWin.y=(stage.stageHeight-videoWin.height)/2;
                videoWin.addEventListener("close", closeHandler);
            }
            private function closeHandler(event:Event):void {
                event.target.removeEventListener("close", closeHandler);
                PopUpManager.removePopUp(event.target as IFlexDisplayObject);
            }
        ]]>
    </fx:Script>
    <s:Button id="myButton" label="Play Video" click="showWindow();" horizontalCenter="0" verticalCenter="0"/>
</s:Application>

posted on 2011-06-04 20:41 天空布蓝 阅读(1416) 评论(0)  编辑  收藏 所属分类: Flex4


只有注册用户登录后才能发表评论。


网站导航:
 

导航

统计

常用链接

留言簿

随笔分类

随笔档案

Flex学习链接

搜索

最新评论

  • 1. re: tomcat7的配置
  • 新建变量名: TOMCAT_HOME 应该为CATALINA_HOME
  • --houkai
  • 2. re: tomcat7的配置
  • 确实是的@寒澈
  • --houkai
  • 3. re: tomcat7的配置
  • @ftp123
    你娘里个大雪碧 里面会有common这个文件夹吗 不知道还尼玛在这瞎比比 纯尼玛误导人 我最恶心的就是这样没事装逼的人 艹
  • --cao
  • 4. re: tomcat7的配置
  • 从哪抄来的,是抄的,你也说声啊,要不自己测试下也可以,害人测试半天。
  • --ftp123
  • 5. re: tomcat7的配置
  • %TOMCAT_HOME%\common\lib 从tomcat6.0开始已经没有common文件夹了,直接用\lib,害我找了半天common文件夹啊,赶快改过来吧
  • --寒澈

阅读排行榜

评论排行榜