Flex Gumbo – Displaying a video using the VideoElement

The following example shows how you can display a video using the chromeless VideoElement control in Flex Gumbo.

[ad]

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/05/14/displaying-a-video-using-the-videoelement-control-in-flex-gumbo/ -->
<s:Application name="Spark_VideoElement_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/halo">

    <mx:ApplicationControlBar width="100%" cornerRadius="0">
        <s:Button id="playBtn"
                label="play"
                click="videoElement.play();" />
        <s:Button id="pauseBtn"
                label="pause"
                click="videoElement.pause();" />
        <s:Button id="stopBtn"
                label="stop"
                click="videoElement.stop();" />
        <s:CheckBox id="mutedCheckBox"
                label="muted"
                selected="true"
                click="videoElement.muted = mutedCheckBox.selected;" />
        <s:Graphic>
            <s:SimpleText id="playheadTimeLabel"
                    text="{videoElement.playheadTime.toFixed(3)}" />
        </s:Graphic>
    </mx:ApplicationControlBar>

    <s:Group horizontalCenter="0" verticalCenter="0">
        <s:VideoElement id="videoElement"
                autoRewind="true"
                source="http://helpexamples.com/flash/video/cuepoints.flv"
                muted="true"/>
    </s:Group>

</s:Application>

[ad]