Creative COW SIGN IN :: SPONSORS :: ADVERTISING :: ABOUT US :: CONTACT US :: FAQ
Creative COW's LinkedIn GroupCreative COW's Facebook PageCreative COW on TwitterCreative COW's Google+ PageCreative COW on YouTube
LIBRARY:TutorialsVideo TutorialsReviewsInterviewsEditorialsFeaturesBusinessAuthorsRSS Feed

Simple Multi-Video Player in AS3

COW Library : Adobe Flash Tutorials : Tony Ross : Simple Multi-Video Player in AS3
Share on Facebook
CreativeCOW presents Simple Multi-Video Player in AS3 -- Adobe Flash Tutorial


www.tonyteach.com
Atlanta Georgia USA

©2009 CreativeCOW.net. All rights reserved.


In this video tutorial, Creative Cow leader Tony Ross demonstrates how to create a simple multi-video player in Flash using Actionscript 3. You'll also learn how to have several videos use a single flv player.



Play Video TutorialDownload Project Files


  View 14 Comment(s)

  Adobe Flash Tutorials   •   Adobe Flash Forum
Reply   Like  
+2
Share on Facebook
Comments

Re: Simple Multi-Video Player in AS3
by Ray Paschal
Hi, I'm kinda new here. but is there a way to make the source of the videos a url like youtube and still maintain the integrity of the script?
-1
Re: Simple Multi-Video Player in AS3
by Cila Smit
Very nice tutorial, and I could make it in my website.

My question is: how to make to stop the FLVPlayback playing when navigation button is clicked. I mean, when I click a button to play an another movie clip, that movie clip is shown, but I can still hear the video playing. How can I stop it?

I tried this:

The FLVPlayer and the nav. buttons are not in the same movie clip.
zanim1_btn and zanim1Down_btn are the navigation buttons which should stop the video and these buttons have another function in the action layer in their own movie clip - opening another movie clip

I am added to the code after your code in the tutorial:


var zanim1_btn:SimpleButton;
zanim1_btn=new SimpleButton();

var zanim1Down_btn:SimpleButton;
zanim1Down_btn=new SimpleButton();

zanim1_btn.addEventListener(MouseEvent.CLICK,stopVideo);
function stopVideo(event:MouseEvent):void {
pubPlayer.stop();
}
zanim1Down_btn.addEventListener(MouseEvent.CLICK,stopVideo);

This is doing nothing.
Please, tell me what shoul I do.
-1
@Cila Smit
by Emilio De La Cruz
Hey Cila,

Did you figure out how to fix this problem? If so, can you please post or e-mail me how you fixed it? Thank you,

Emilio
Re: Simple Multi-Video Player in AS3 make changes?
by glenna french
I would like to increase the size pf the player overall, can you explain how to do this?
Also, I am playing mp4 files and it seems to work.
I am in the process of trying to name the buttons with titles of movies to play. A clue to this would be great!
Thanks
Re: Simple Multi-Video Player in AS3
by David Goodwin
This tutorial is really useful for my website as it is centred around displaying my animated videos. Thanks!

It's a great help as I have been looking all over the net for tutorials for this kind of thing (though it was difficult to look up something I didn't really know the name of).

Just one question: Is it possible to put the buttons into a scrollable Flash pane such as the ScrollPane component or similar without affecting the base coding (I.e. this Actionscript). In my website, I want to make the videos scrollable but the moment I put them in a movie clip, the basic coding goes wrong.

Thanks,

David
Re: Simple Multi-Video Player in AS3
by stephen pannell
Thank you very much for the tutorial Simple Multi-Video Player in AS3. It worked like a dream and I am hopeless when it comes to action script and code! The only thing I couldn't get to work is to make the skin visible once uploaded!! I have pasted the skin into the same directory folder...Any ideas?
Thanks
Stephen
Simple is good
by Richie Cao
Thanks for the tutorial, It actually worked without all the extra fuss. Will watch your other ones now.
Basic. Too basic? It 'works' but without really learning anything.
by Brodd Nesset
This tutorial is very basic, and not the proper way of doing this at all. The good side about the 'basicness' here is that this actually works, kinda at least, with very little effort. At this level it's probably good to avoid introducing "the world" of concepts in AS3. The poor side of it is that you learn nothing about programming here, rather you could pick up bad habits about how you do things from this example.

You can set many options like autoplay on/off, loding buffertime etc. directly in the playback component very conveniently. The tutorial doesn't mention this at all. Huge oversight IMO.

I have a modification which I think will work more elegantly. It even gets away with the repeated typing you need here if you add more buttons; this is so wrong!

Wrap all buttons in one master MovieClip and call this 'mc_buttons'. You can add or remove individual buttons inside this MC at wish - with no additional scripting needed. That's flexible scripting. Name / rename the individual buttons the name of the FLV. A limitation here is that the name can't start with a number, it has to be a letter. So "vid247-24h" is fine, but "247vid" is not.

In the script window:

mc_buttons.addEventListener(MouseEvent.CLICK, newVid);

function newVid(e:MouseEvent):void {
var newVidName:String = e.target.name + ".flv";
myPlayBackComponent.source = newVidName;
}

This is all you need to get the same functionality as in the tutorial, with less scripting. If you add ten buttons or twenty, or reduce it to two - it doesn't matter; just leave it.

A more pro approach would probably be to use an Array and a Switch statement - but that can wait.

Adding a progressbar component
by Tim Jordan
This was a great tutorial. I manage to take it a step further and build a custom playing. But I am having problems applying a progressBar component. I would like for the viewer to see a count to when the video will be done loading. The videos I’m using are big around 6min long. Do you have a video or any thoughts on how on how to solve this?
or.......
by Vicky Hunter
another question opposed to making first video appear, how to make control bar not show until button is clicked? similar to this player?
http://www.davidgilmour.com/gdansk/index.html
make first video open on page load?
by Vicky Hunter
First I want to THANK YOU!!! I have tried for months without success to do ANYTHING in flash! I'm still twiddling trying to make backgrounds and align etc. But this tutorial was so easy for me to follow; even tho it was a bit different using cs4, most leave out tiny details assuming everyone will know what to do.
My only concern is when the page opens, you don't see a player, just the control bar. What am I doing wrong? I made a background telling folks to click a numbered box to start, but not really liking that. Is there anything I can do?
Frineds who want an easy way to do this
by Shirley Kyrnm
It is a good tutorial. However, some friends here might want easier way to do this to save both their time and money.
An easy way is without Javascript or Actionscript, check playerdiy.com, it is a web FLV player creator and no code knowledge is needed. Here is the tutorial - http://www.playerdiy.com/support/tutorial/customize-flash-video-player.html
Doesn't work so easy
by Rolf Diederichs
This lesson looks nice, but it is not for practical use. Week points are:
The first video starts always playing.
You can't click to play the same videos again.
This script does not work for one button for to start the video playing via this button.

Where to find usable scripts not just for nice lessons?


Simple Multi-Video Player in AS3
by nicolas francis
Very well explained,wow i got it the first time i watch your tutorial, unlike some others who dont take their time to explain it.I think ill buy one of your dvds on as 3.0 ..thx Ross :)


Related Articles / Tutorials:
Adobe Flash
Adobe Edge Animate/The Missing Manual Software/Book Review

Adobe Edge Animate/The Missing Manual Software/Book Review

Increasingly, web developers are being asked to create sites that are viewable on tablets and mobile devices, as well as desktops and laptops running Windows, OS X or Linux. One of the challenges in creating a site like that is animation. Flash, for many years the preferred cross-platform animation solution, is no longer supported on many tablets and mobile devices. Michael looks for - and finds - answers within Adobe's Edge Animate.

Review, Editorial
Adobe Flash
HTML5 (CreateJS): Interactivity and Debugging

HTML5 (CreateJS): Interactivity and Debugging
  Play Video
Building on two previous tutorials on CreateJS for Flash Pro CS6, Creative COW leader Michael Hurwicz introduces interactivity (specifically, responding to a mouse click), debugging using the JavaScript "alert" statement, and assigning names to objects exported from Flash. Project files included.

Tutorial, Video Tutorial
Adobe Flash
HTML5 (CreateJS): Animate with JavaScript

HTML5 (CreateJS): Animate with JavaScript
  Play Video
Building on a previous introductory tutorial on CreateJS for Flash Pro CS6, Creative COW leader Michael Hurwicz shows how to modify the JavaScript exported from Flash, to change attributes such as position, speed, wait time, and color. Project files are included.

Tutorial, Video Tutorial
Adobe Flash
HTML5 (CreateJS) for Adobe Flash Professional CS6

HTML5 (CreateJS) for Adobe Flash Professional CS6
  Play Video
Creative COW leader Michael Hurwicz provides a brief introduction to CreateJS, an extension for Adobe Flash Professional CS6 that allows you to export Flash projects as HTML and JavaScript, even on platforms that do not support the Flash Player.

Tutorial, Video Tutorial
Adobe Flash
Building an Interactive Whiteboard in Flash: Part Two

Building an Interactive Whiteboard in Flash: Part Two
  Play Video
In part two of this series, Justin Junda walks you through the necessary steps to connect the graphical elements from part one, with Actionscript 3.0 using the Flash drawing API in order to bring this whiteboard to life.

Tutorial, Video Tutorial
Adobe Flash
Building an Interactive Whiteboard in Flash: Part One

Building an Interactive Whiteboard in Flash: Part One
  Play Video
In this tutorial, Justin Junda takes you through the step by step process on how to build and interactive whiteboard. These whiteboard are often seen in drawing applications, scratch pads, and educational sites. This is part one of a two part series. Part one takes you through setting up all the graphical elements within the stage. Then part two shows a user how to connect the graphics to Actionscript using flashes drawing API to make this whiteboard truly interactive.

Tutorial, Video Tutorial
Adobe Flash
Embedding a Speech Transcript in a Flash Video with Adobe CS5

Embedding a Speech Transcript in a Flash Video with Adobe CS5
  Play Video
In this tutorial, Creative COW Leader Michael Hurwicz shows you how to create a scrolling transcript synced with a Flash video, using Adobe Creative Suite 5 (Story, OnLocation, Premiere Pro, Soundbooth and Flash Professional).

Tutorial, Video Tutorial
Adobe Flash
Inverse Kinematics - Springs

Inverse Kinematics - Springs
  Play Video
Springs are a new feature for Inverse Kinematics in Flash CS5. In this video tutorial, Creative COW leader Michael Hurwicz shows you a simple technique for implementing springs, as well as several other "tricks and traps" to make your work with Inverse Kinematics in Flash easier, more flexible and more powerful.

Tutorial, Video Tutorial
Adobe Flash
Inverse Kinematics - Control Points

Inverse Kinematics - Control Points
  Play Video
Fine-tune your Inverse Kinematics animations in Flash CS5 by working with control points. In this Adobe Flash video tutorial, Creative COW leader Michael Hurwicz shows you how to associate bones with control points, how to move, add and delete control points, and how to adjust control point handles.

Tutorial, Video Tutorial
Adobe Flash
Inverse Kinematics

Inverse Kinematics
  Play Video
Inverse Kinematics allows you to create structures of bones and joints and use them to animate characters in Flash. Fun and easy! Creative COW leader Michael Hurwicz shows you how in this video tutorial, step by step. Learn some basic ActionScript, too!

Tutorial, Video Tutorial
MORE


FORUMSTUTORIALSFEATURESVIDEOSPODCASTSEVENTSSERVICESNEWSLETTERNEWSBLOGS

Creative COW LinkedIn Group Creative COW Facebook Page Creative COW on Twitter
© 2014 CreativeCOW.net All rights are reserved. - Privacy Policy

[Top]