1.先来做一个最简单的例子,使用VideoDisplay组件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
<?xml version=
"1.0"
encoding=
"utf-8"
?>
<s:Application xmlns:fx=
"http://ns.adobe.com/mxml/2009"
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
protected
function
button1_clickHandler(event:MouseEvent):
void
{
vd.play();
}
protected
function
button2_clickHandler(event:MouseEvent):
void
{
vd.pause();
}
protected
function
button3_clickHandler(event:MouseEvent):
void
{
vd.stop();
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:VideoDisplay id=
"vd"
source=
"http://localhost/flex/M2U00883.flv"
x=
"59"
y=
"83"
width=
"496"
height=
"335"
autoPlay=
"false"
>
</s:VideoDisplay>
<s:BorderContainer x=
"63"
y=
"427"
width=
"496"
height=
"43"
>
<s:Button x=
"105"
y=
"10"
label
=
"播放"
click=
"button1_clickHandler(event)"
/>
<s:Button x=
"212"
y=
"10"
label
=
"暂停"
click=
"button2_clickHandler(event)"
/>
<s:Button x=
"327"
y=
"10"
label
=
"停止"
click=
"button3_clickHandler(event)"
/>
</s:BorderContainer>
</s:Application>
|
这个例子非常简单,就是设置好Flv文件的位置,然后通过三个按钮控制视频播放
2.不妨改用VideoPlayer组件,一般的视频控制都有了:播放、暂停、进度拖动、声音控制、是否全屏
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<?xml version=
"1.0"
encoding=
"utf-8"
?>
<s:Application xmlns:fx=
"http://ns.adobe.com/mxml/2009"
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:VideoPlayer id=
"vd"
source=
"http://localhost/flex/M2U00883.flv"
x=
"59"
y=
"83"
width=
"496"
height=
"335"
autoPlay=
"false"
>
</s:VideoPlayer>
</s:Application>
|
执行一下看看效果,很简单吧!
3.VideoPlayer组件添加全屏按钮tooltip,以及在视频播放完毕时执行事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
<?xml version=
"1.0"
encoding=
"utf-8"
?>
<s:Application xmlns:fx=
"http://ns.adobe.com/mxml/2009"
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import
mx.controls.Alert;
import
mx.events.FlexEvent;
import
org.osmf.events.TimeEvent;
protected
function
vd_initializeHandler(event:FlexEvent):
void
{
vd.fullScreenButton.toolTip =
"进入全屏"
;
}
protected
function
vd_completeHandler(event:TimeEvent):
void
{
Alert.show(
"视频播放完毕"
);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:VideoPlayer id=
"vd"
source=
"http://localhost/flex/M2U00883.flv"
x=
"59"
y=
"83"
width=
"496"
height=
"335"
autoPlay=
"false"
initialize=
"vd_initializeHandler(event)"
complete=
"vd_completeHandler(event)"
>
</s:VideoPlayer>
</s:Application>
|