Homemade Flash FLV Video Player

Source: Internet
Author: User
Tags flv file
Start with Macromedia Flash Player 8 (recommended!

Create a new document, set the background color to black, and create four layers by default.

The first layer is used to place video elements. The method is as follows:

1. on the "Database" Panel ("window"> "Database"), select "new video" from the "Database" pop-up menu ".
2. In the "video properties" dialog box, name the video component and select "video" (controlled by the ActionScript ).
3. Drag the video object from the "Database" panel to the center of the stage to create a video object instance.
4. Name the video element "my_video ".

The second layer is used to place the video address input column. The method is as follows:

1. Use the text tool (shortcut key T) at the bottom left of the stage to draw an address input text box and select "input text" as the type.
2. Select "single line" from the "line type" pop-up menu, and confirm that "show border around text" is selected.
3. For this text box, name the instance "url ".

The third layer is used to play the start button. The method is as follows:

1. on the "Database" Panel ("window"> "Database"), create a component button and create a button style. You can use it for the moment.
2. Drag the new button object from the "Database" panel to the end of the stage address input box to create the play start button.
3. Name the instance play_bt for the start button ".

The fourth layer is used to put all the ActionScript:

// Initialize
// Create a NetConnection object
Var my_nc: NetConnection = new NetConnection ();
// Create a local stream connection
My_nc.connect (null );
// Create a NetStream object
Var my_ns: NetStream = new NetStream (my_nc );
// Write a playflv function ()
Function playflv (flv ){
// The flv parameter indicates the flv video address to be played.
// Trace (flv); // used for testing
// Append the NetStream Video input signal to the Video object, that is, the Video element my_video.
My_video.attachVideo (my_ns );
// Set the buffer time, in seconds. Set it to 3 seconds.
My_ns.setBufferTime (3 );
// Start playing FLV files
My_ns.play (flv );
}
// Click start playback to start playing.
Play_bt.onRelease = function (){
Playflv (url. text );
// Obtain the video file address in the url input box and call the playback function to play the flv video file corresponding to the url.
};

//////////////////////////////////////// //////////////////////////////////////
// At this point, the simplest player has been completed, and more control and performance work is required.
// Here we will make several important aspects. Others need to make better designs based on your imagination.
// Note that the following code is not necessary and has not been tested. We hope you can try it one by one. Pay special attention to the corresponding path and Instance name.

//*********************************
// 1. Playback control, pause, and stop
// Create two buttons, pause_bt and stop_bt. The principle is the same as that of the playback button.

Pause_bt.onRelease = function (){
My_ns.pause ();
};
Stop_bt.onRelease = function (){
My_ns.seek (0 );
// Search for playing from 0
My_ns.pause (true );
// If the parameter is true, it indicates that the video is paused. If the parameter is false, it indicates that the video is paused and continues to be played. If the parameter is not set, it indicates that the video is paused or played.
};

//*********************************
// 2. video download progress
// This is relatively simple. It is similar to the general download progress. The principle is to display the percentage of downloaded and total file sizes during playback.
// Create a new display percentage static text (info) and a progress bar, and adjust its initial status and position

This. onEnterFrame = function (){
Var loadedbytes = my_ns.bytesLoaded;
// Get the downloaded bytes
Var totalbytes = my_ns.bytesTotal;
// Total file size
If (totalbytes = undefined | totalbytes <4000 ){
Info. text = "0% ";
Bar. _ width = 1;
} Else {
Var nowLoadPercent = Math. round (loadedbytes/totalbytes * 100 );
If (isNaN (nowLoadPercent )){
Info. text = "0% ";
Bar. _ width = 1;
} Else {
Info. text = nowLoadPercent + "% ";
Bar. _ width = nowLoadPercent * 35/100;
If (nowLoadPercent = 100 ){
Delete this. onEnterFrame;
}
}
}
}

//*********************************
// 3. Video size correction or adjustment
// This is important because the video size ratio is generally different, so adjust the video size during playback to avoid distortion and deformation.
// The principle is to obtain the flv size, re-adjust the my_video size, center the position, and perform scaling if necessary (omitted here ).

// First, write a function changesize (w, h) for changing the size. w is the width to be changed, and h is the height to be changed.
Function changesize (w, h ){
// Change the size of the input parameter
My_video. _ width = w;
My_video. _ height = h;
// Trace ("w:" + w + "h:" + h); // used for testing
// Center the video. If your video stage is 550 wide and 400 high
My_video. _ x = 550/2-w/2;
My_video. _y = 400/2-h/2;
}
// Then obtain the inherent flv size and call the above function to change it
// This processing function is triggered before the video playback header advances after the my_ns.play () method is called.
My_ns.onMetaData = function (infoObject: Object ){
// Obtain the descriptive information embedded in the FLV file. The width and height are obtained here.
Var flv_width = infoObject. width;
Var flv_height = infoObject. height;
// Change the size
Changesize (flv_width, flv_height );
};

//*********************************
// 4. Playback time and progress
// The principle is similar to the download progress. First, get the total duration, and then get the percentage of the current time. You can also make a progress bar.

// Define the global variable for the total duration and obtain its value.
Var flv_duration;
My_ns.onMetaData = function (infoObject: Object ){
// Obtain the descriptive information embedded in the FLV file. The total duration (in seconds) is obtained here)
Var flv_duration = infoObject. duration;
};
// Note: this can be written together with the obtained width and height.
// Obtain the current playback time
Var flv_thistime = my_ns.time;
// Then you can make the playback progress, which is similar to the download progress.

//*********************************
// 5. Volume Control

// For this complexity, you must first attach the audio from the FLV file to the video clip on the stage and then control it.
// Create a video clip my_ns_mc and append the audio
My_ns_mc.attachAudio (my_ns );
// Create a Sound object for a video clip
Var my_ns_sound = new Sound (my_ns_mc );
// Initialize the volume (80 by default)
Var flv_volume = 80;
My_ns_sound.setVolume (flv_volume );
// Adjust the volume of flv_volume (between 0 and 100) to change the volume.
// This part of production is also omitted. You can use it as needed. You can also use the mute function, that is, the flv_volume value is 0.

//*********************************
// Also, such as fast forward, fast return, and buffer display can be implemented. You can study it on your own.

//////////////////////////////////////// ////
Finally, the preparation of a Flash flvplayer is basically complete. We recommend that you learn the flash Player and do not always download the source code and modify it, in this way, you will not be able to understand many of the secrets!

Add a related question: flv playback has no image and only sound. This is because the flv file is compressed in flash 8 encoding format, and the flash player you released is flash 7 or earlier, upgrade to version 8 or compress the flv file in the flash 7 encoding format.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.