jump to navigation

Playing YouTube Videos In Flash Using ActionScript 3.0 October 4, 2010

Posted by Tournas Dimitrios in Flash.

This tutorial will teach you how to play a YouTube directly inside your Flash movie without having to navigate to the YouTube website. This is possible to do by using the YouTube API provided by Google for developers to their own websites and applications on top of YouTube.

Unlike the Google Maps ActionScript 3.0 API, the YouTube AS3 API doesn’t require you to download and install a special component for you to be able to play YouTube videos inside your project, instead you directly load a special YouTube file during runtime using the Loader Class and then use that file to play any video you want. You can view the official documentation for the YouTube AS3 API on this page.

The basic process outline for loading the API and using it is as following:

  1. Configure Domain Security to allow YouTube to communicate with our movie.
  2. Create a variable to hold a reference to our YouTube player.
  3. Use the Loader Class to load the YouTube API file
  4. Create event handlers to control the player once the API file has successfully loaded and got initiated.
  5. Order the player to play the specific YouTube video we wish to see.

var my_player:Object;

var my_loader:Loader = new Loader();
my_loader.load(new URLRequest("http://www.youtube.com/apiplayer?version=3"));
my_loader.contentLoaderInfo.addEventListener(Event.INIT, onLoaderInit);

function onLoaderInit(e:Event):void{
my_player = my_loader.content;
my_player.addEventListener("onReady", onPlayerReady);

function onPlayerReady(e:Event):void{
//w w w.youtube.com/watch?v=B7Md_7rOEjI&feature=player_embedded

play_btn.addEventListener(MouseEvent.CLICK, playVid);
function playVid(e:MouseEvent):void {
pause_btn.addEventListener(MouseEvent.CLICK, pauseVid);
function pauseVid(e:MouseEvent):void {

Customizing the Player

The YouTube API provides a number of additional methods to control the player. Namely, the following functions are available:

  • loadVideoById() – This method loads a video and play it instantly once the video is ready to be played.
  • cueVideoById() – This method loads a video, but does not play it automatically. The use will have to use the playVideo() method to play
  • playVideo() – Plays a cued video or a paused video.
  • pauseVideo() – Pauses a video at its current position.
  • stopVideo() – Stops the video and resets it to the beginning.
  • mute() – Mutes the sound of the video.
  • unMute() – Unmutes the sound of the video.

All of these methods can be called only after the player is ready. You can read the whole list of available methods and properties at the official documentation page.

In order to create the player similar to the ones showed in the code example above you will have to place two buttons on the stage and then assign the instance names play_btn and pause_btn then use the code below:



1. LVNM - April 8, 2011

Thanks! Exactly What I Was Looking For

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s