Preorder Estimated Availability Date. Your credit card will not be charged until the product is shipped. Estimated availability date is subject to change.Preorder Estimated Availability Date. Your credit card will not be charged until the product is ready to download. Estimated availability date is subject to change.

User level

Required products

In this article, you'll learn how to create a simple video player that streams Adobe HTTP Dynamic Streaming (HDS) video to Internet-connected televisions, set-top boxes, and other devices. Playing video content on devices requires the AIR for TV (A4TV) 2.5.1 or later runtime. This article describes how to configure Adobe Flash Builder to develop and compile a simple player for A4TV using the Open Source Media Framework (OSMF).

The A4TV runtime requires developers use the proper AIR namespace in their application descriptor file. OSMF facilitates player development for consuming HDS content that cannot be consumed by the popular FLVPlayback or VideoDisplay components. The sample project described in this article uses the following:

Install Flash Builder to the desired location on your machine. Your install directory is known as $FlashBuilderRoot.

Flash Builder 4.5 uses the Flex 4.5 SDK by default. The minimum namespace requirement for AIR applications by the Flex 4.5 SDK is AIR 2.6. Since A4TV 2.5.1 requires the AIR 2.5 namespace to run properly, you must use the Flex 3.6 SDK—which has a minimum requirement of AIR 1.5 namespace. Then it is necessary to overlay the AIR 2.5 SDK on the Flex 3.6 SDK to ensure the proper functionality for A4TV 2.5.1 is included when the project is compiled.

Follow these steps to set up AIR 2.5 SDK on the Flex 3.6 SDK:

Download and install the Flex 3.6 SDK. Unzip the package to $FlashBuilderRoot\sdks (or save it to the desired directory).

Download the AIR 2.5 SDK. Overlay it onto the Flex 3.6 SDK by opening the AIR 2.5 SDK ZIP file.

Copy each file from the AIR 2.5 SDK into the corresponding directory within the Flex 3.6 SDK you installed in Step 1.

Note: If you are working on a Mac, be advised that copying a directory over another with the same filename will replace the original directory. Take care to copy only the individual files from the AIR 2.5 SDK into the corresponding directories in the Flex 3.6 SDK to ensure that you do not overwrite the directories.

The AIR 2.5 runtime adds Stage Video support for AIR applications. OSMF build 1.6 automatically enables Stage Video whenever it is available for performance improvements using hardware rendering and decoding of H.264 video. The Flex 3.6 SDK does not support OSMF, so it is necessary to import the OSMF 1.6 SWC file. Follow these steps:

Create a new ActionScript Project by choosing File > New > ActionScript Project.

Enter a project name, tvPlayer, and choose the location to save the project.

Choose Desktop as the Application type.

In the Flex SDK version section, click the Configure Flex SDKs link to open the Preferences dialog box.

Click the Add button and then click the Browse button and navigate to select the newly configured Flex 3.6 SDK. Select the folder and then click OK.

If desired, modify the Flex SDK name and click OK to return to the New ActionScript Project properties dialog box.

Click the Use a specific SDK option and then use the menu to select the Flex 3.6 SDK.

Click the Next button. In the Library path tab, click the Add SWC button.

In the Add SWC dialog box that appears, click the Browse button and navigate to select the OSMF.swc file you downloaded previously. Select the OSMF.swc file and click OK. Then click OK again to close the Add SWC dialog box.

Click Finish to close the New ActionScript Project dialog box.

Now set the compiler directive to require Adobe Flash Player 10.2:

Open the tvPlayer project properties by right-clicking the project name in the Package Explorer and selecting Properties.

Select the ActionScript Compiler category in the Properties dialog box.

Add the following line to the Additional compiler arguments field:

-target-player=10.1

Next, set the application profile to TV in the launch configuration:

In the properties dialog box, select the Run/Debug Settings category.

Select the tvPlayer project, then click Edit to open the Edit Configuration dialog box.

Enter tv in the Profile options, click OK to close the Edit Configuration dialog box, and then click OK again to close the Properties dialog box.

At this point, you've finished setting up the development environment. In the next section, you'll learn how to create the OSMF video player.

Creating a simple OSMF Player

To build this sample project, you'll use the OSMF MediaPlayerSprite (MPS) class. MPS is a wrapper class that provides access to the core functionality of the MediaPlayer, MediaContainer, and MediaFactory classes. The code calls for the URL to a manifest file (.f4m) in order to play HDS content; however, you can also use URLs for progressive download or RTMP streaming from Flash Media Server (FMS).

Follow these steps to create the video player:

Open the tvPlayer.as file in your Flash Builder project.

Place your cursor after the opening curly brace for the tvPlayer class (near line 6) and press the Enter key.

While your cursor is at that location, enter the following code to declare the following variables:

Where to go from here

After completing the steps provided in this article, you should have successfully created a simple, full-screen, skinless, Stage Video–enabled video player for AIR for TV devices using the OSMF MediaPlayerSprite class in Flash Builder 4.5.

If you'd like to research further, experiment with this sample project by extending this code to add functionality. You can also skin the video player and deploy it on AIR for TV–enabled devices.