Adding Centered Play Button
Updated: Mar 20, 2008
Views: 3015
Description: In this tutorial we will walk through the steps on adding a large play button. It will disappear once a play state has entered. This button also works in full screen mode.
The Completed Project
Complete Code:
Setting up the FLV Player and Setting the Source
Before you begin, make sure that you have the FLV Player and your purchased installed using the extension manager and have created a new Flash ActionScript 3.0 File. Also that you have dragged an instance of the FLV Player onto the stage from the Component Panel (Window > Components).
After you have successfully added the FLV Player to the stage, The first thing you need to do is set the source to your FLV video. These can be found in the component inspector (Window > Component Inspector) or parameters panel (Window > Properties > Parameters) under the property source with the instance of your player selected. Or you can set this in Action Script (make sure to give your player the instance name myPlayer).
Creating Play Button
Create a movie clip to be used as Play button. When creating this movie clip please also make sure you have setup the linkage. You will only need this in the library so it is not required to have on stage. to setup linkage open yur library (Window > Library) and finding our Movie Clip that we created and right clicking and selecting Linkage. Check the box Export for ActionScript, make sure Export for first frame is checked, and give it a Class name of PlayButton.
We need to import the overlay class that is required.
Download the PlayButton Class File Here and have the folder structure in your local directory of your file. Then in flash import your classes.
Initiating and adding the Play Button to Player
Here we will need to create a variable that will initiate and add the button. Please note that we have named given a player an instance name of myPlayer and your play Button has a linkage of PlayButton.
Complete Code:
/* Global stage settings */
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
/* Import required packages */
import com.afcomponents.flvplayer.overlays.PlayButtonOverlay;
import fl.video.VideoEvent;
/* Initiate required objects */
var overlayPB:PlayButtonOverlay = new PlayButtonOverlay({player:myPlayer,button:PlayButton, stage:stage});
myPlayer.source = "http://www.afcomponents.com/flv/vid/sample.flv";
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
/* Import required packages */
import com.afcomponents.flvplayer.overlays.PlayButtonOverlay;
import fl.video.VideoEvent;
/* Initiate required objects */
var overlayPB:PlayButtonOverlay = new PlayButtonOverlay({player:myPlayer,button:PlayButton, stage:stage});
myPlayer.source = "http://www.afcomponents.com/flv/vid/sample.flv";
Setting up the FLV Player and Setting the Source
Before you begin, make sure that you have the FLV Player and your purchased installed using the extension manager and have created a new Flash ActionScript 3.0 File. Also that you have dragged an instance of the FLV Player onto the stage from the Component Panel (Window > Components).
After you have successfully added the FLV Player to the stage, The first thing you need to do is set the source to your FLV video. These can be found in the component inspector (Window > Component Inspector) or parameters panel (Window > Properties > Parameters) under the property source with the instance of your player selected. Or you can set this in Action Script (make sure to give your player the instance name myPlayer).
myPlayer.source = "http://www.afcomponents.com/flv/vid/sample.flv";
Creating Play Button
Create a movie clip to be used as Play button. When creating this movie clip please also make sure you have setup the linkage. You will only need this in the library so it is not required to have on stage. to setup linkage open yur library (Window > Library) and finding our Movie Clip that we created and right clicking and selecting Linkage. Check the box Export for ActionScript, make sure Export for first frame is checked, and give it a Class name of PlayButton.
Download the PlayButton Class File Here and have the folder structure in your local directory of your file. Then in flash import your classes.
/* Import required packages */
import com.afcomponents.flvplayer.overlays.PlayButtonOverlay;
import fl.video.VideoEvent;
import com.afcomponents.flvplayer.overlays.PlayButtonOverlay;
import fl.video.VideoEvent;
Initiating and adding the Play Button to Player
Here we will need to create a variable that will initiate and add the button. Please note that we have named given a player an instance name of myPlayer and your play Button has a linkage of PlayButton.
/* Initiate required objects */
var overlayPB:PlayButtonOverlay = new PlayButtonOverlay({player:myPlayer,button:PlayButton, stage:stage});
var overlayPB:PlayButtonOverlay = new PlayButtonOverlay({player:myPlayer,button:PlayButton, stage:stage});
