Join Lisa Larson-Kelley for an in-depth discussion in this video Understanding the anatomy of a video player in Flash, part of Publishing Video with the Flash Platform.
- View Offline
Before we dive into actually creating a video player for Flash, it's helpful to understand what the parts of a video player are, what they do, and how they're built. First, I want to clarify the difference between the Flash Player plug-in and a video player built for Flash. The Flash Player plug-in allows your browser to display a video player application, and it's the way your player application that we'll be building in this course. Here's a typical video player application embedded in a web page. This is a simple player that just plays a single video that we specify.
As you can see, this player is embedded in an HTML web page. The HTML code that embeds the player looks like this. It specifies which Flash file to load. A Flash file will have the file extension SWF, or S-W-F. This HTML code can be written in any HTML editor, or even in a text editor. The SWF file contains all of the player logic. This includes the location of the video to play, what the skin looks like, and how to handle player interactivity such as pause, play, rewinding, and so on.
There are many approaches to building SWF files. This SWF file can be created in the Flash Professional authoring environment, or you can use a pre-built video player SWF. And the exercises in this course we'll guide you through both approaches. In Flash Professional, there is a drag and drop FLVPlayback component. This sample video player right here is using it. The FLVPlayback component is embedded inside of the SWF file. This is this part of the player here. The FLVPlayback component contains all the logical code needed for video playback, and using this component saves you all the work of writing this logic yourself in ActionScript. And since video playback requires a lot of logic to handle things like playback errors, bandwidth detection, and user interaction, the FLVPlayback component is quite useful for the novice programmer.
The next element is the video file itself. This exists in a separate file that gets loaded when requested by the video player SWF. This is a great feature as it allows you to have one video player SWF that contains all of the playback logic and then dynamically load in videos as needed without having to create a new SWF for every video you want to play. And finally, when using the FLVPlayback component inside of a video player SWF, as shown here, an additional file is created. This is the skin for the player. It's actually saved by Flash Professional as a separate SWF.
It contains the artwork for the user interface of the player, the buttons, frame, and so on. And this SWF is loaded when the main video player SWF loads. So it does need to be uploaded to your web server along with all of the other files for publishing to the web. And we'll cover the specific files for each video player exercise in detail later, but this should give you an idea of what the elements of a typical video player are and how they're constructed. This will give you a solid foundation for building custom players for Flash, using various approaches we'll explore in the upcoming exercises.
- Converting a video for Flash playback
- Using the Adobe Media Encoder
- Adding custom metadata to a video
- Building a custom player with the FLVPlayback component
- Embedding video in a web page
- Adding navigation cue points
- Publishing with Flash Media and Strobe Media Playback
- Uploading files to a web server