Saturday, April 4, 2009

FLVPlayback 2.5 make video easy with Flex 3

OK so your developing an application and you need a video component for Flex? Well do not go past GO go straight FLVPlayback 2.5. Back in late 2007 I was evaluating Flex with FMS 2 using Flex's video component. I must admit the Flex 2/3 video component is pretty average compared to standard of the other components in the Flex component framework. Simple video functionality was missing in the standard component and to do anything average just required too much effort. It made more sense to use Flash's video component to create a quick video player.

I'm not much of a designer but watching a design college skin FLVPlayback just look so effortless. To say I'm impressed with what FLVPlayback can do is an understatement. I know there have been a few blogs of using FLVPlayback so I'm not going to show an example (See Flex Examples). Also there is plenty of documentation with component itself. One little cool thing that I wanted to point out is to resize the component to the video's correct/preferred size.

In the below example you can see how you can resize your component to play the video in it's preferred size. Note this excerpt highlights that you resize your component after the video is loaded.

private var vid:FLVPlayback = new FLVPlayback();

private function onCreationComplete():void
{
...
vid.addEventListener( fl.video.VideoEvent.READY , readyToPlay);
...
}

private function readyToPlay(e:fl.video.VideoEvent):void {
...
this.width = vid.preferredWidth;
this.height = vid.preferredHeight; // Add the skin's control bar height
...
}

If more detail is required I will added it but this should be enough for the concept.

No comments: