Jump to content


Load Img Based From Current Video Frame

Recommended Posts

Hi again!


Tonight's challenge - Let's say I have VideoLoader playing along and I also have an asset folder with a still frame for each and every frame of said video. How would I go about setting up my code so that when the video is paused, the current frame is read and the matching still frame is loaded?


The only methods I can think of involve embedding the video in the SWF, which would be too large. I'm hoping there is a way to leverage VideoLoader to do this. Also, there could potentially be 6000 jpg stills, I'd need a way to short-hand the code.


Any ideas or suggestions on something like this? Thanks!!!

Link to comment
Share on other sites



Can you elaborate on why you need to do this? It will help us tailor a solution. Do you have higher resolution stills you want to load?


I think even if what you wanted to do were possible, the implementation would be highly impractical and require a massive video as you would have to encode keyframes for every frame thus having a massively large video.


check out the 'keyframes' section here:



By having keyframes for each frame, you are basically back at square 1 of having 6000 individual images (as embedding the video in a swf/movieclip would create) and you would have none of the advantages of video compression :(


good conversation of people discussing how you can only seek to a keyframe:



Hopefully the links above shed more light on the subject. I'm really not an expert on Flash video.

Link to comment
Share on other sites

Hi Carl,


Yes, that is exactly why. I'd like to be able to load a hi-res jpg dynamically of the currently paused VideoLoader frame. Does VideoLoader have any feature to track frame count/current frame? Maybe it's something that could be done by time? That would be 24-30 frames in each second though...


I'm only intermediate with AS3 and newer to Greensock, but I'd assume we would code something like:


function onPause(e:LoaderEvent):void
  if (currentFrame=="_____")
	  currentImage = new ImageLoader("_____", {...});
	  setChildIndex(currentImage.content, 1);
function onResume():void
  TweenLite.to(currentImage.content), 1, {autoAlpha:0, onComplete:onPlay});
function onPlay():void


Just as a basic idea. I clearly don't quite grasp the logic yet. How do we match up the "_____" in my example? Maybe set up some kind of array and reference an XML file?


As a specific example, I'd like to achieve something similar to:


Link to comment
Share on other sites

the videoLoader has a videoTime property which will tell you the position of the video's playhead in seconds. You could convert that time to the most recent whole second by converting to uint:




var imageNum = uint(myVideoLoader.videoTime); 10.2345 will be 10

var frameImage:ImageLoader = new ImageLoader("frame" + imageNum + ".jpg", {});


note that assumes you have a jpg for every second of video not every frame of the the video (30 per second).

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.