The objective of this exercise is to learn how to create a simple video playback system in Flash. This will not embed the video in the Flash file, but load it from an external source, as in the precious sound exercise. .flv or .mov (h264 preferrably) are ideal for this, due to their small size and high quality. Unlike other exercises, there is no code, therefore no files will be included for download.
1. First, some thoughts on Flash and video. The good implementation of video in Flash in the early 2000’s, coupled with Flash’s strengths in creating a graphical user interface for video playback, was an important factor for the popularization of video on the web. The adoption of Flash video by YouTube since its inception also contributed to the success of Flash video, to the point that Flash is often strongly associated with video.
Now, with Apple’s push for h264 (and exclusion of Flash in its iOS), and the possible adoption of a video standard for HTML5 (there is still not a consensus around it), Flash video is also at a crossroads. But for now it is still an important element of Flash, and of video on the web.
2. To import video into Flash, select File > Import > Video.
3. The following window appears:
If the video file is in your computer, keep the video file under the same folder of your Flash file, to ensure that if the folder is moved (for example, to a server), the path to the file is not lost.
Browse to your video file, or indicate a URL for the video. Then press “Continue”.
4. The following window appears:
Pick a suitable skin from the menu, customize the color if needed, and press “Continue”.
There is also the option to use your own custom skin. All ready-made skins are located in the Flash application directory, and can be edited. The skin used will be copied to the folder where you have saved your project, and should be kept there, even when moving (for example, to a server).
5. The following window appears:
As stated in the above window, even if you move the video file out of its original structure, you can always correct the file path in the component inspector (menu Window > Component Inspector), after selecting the video player. The path option is available under “source”:
6. The end result should look like this: