wiki:SeamlessLooping

Seamless looping in Flash for external video files

back

Demo

Adaptive Streaming is a prime example that needs seamless transitions between video segments. Basically we're looking for a solution that Adobe has added to their Flash Media Server namely the play2 function in the NetStream class, but then one that is working for files streamed using the HTTP protocol.

The problem

A seamless video loop or transition from one video clip to another is impossible (reference: search for 'flash seamless loop') for external video clips. After reading a lot of posts and starting out with a horrible transition in my first example, what follows are some implementation notes on how to get the transition as seamless as possible.

Try 1: Double stream buffering

I started out with a simple and the most obvious implementation. Just simply double buffer the video streams and switch to the next stream when the current one ends.

Try 2: Double stream buffering with two Video objects

We can only attach the next stream to the video when the previous stream has already stopped playing. To remove this delay we can double buffer the Video object as well and instead toggle the visibility of the video objects.

  • start loading of stream 1, attach the stream to video 1 (Video.attachNetStream()) and make it visible.
  • loop:
  • start preloading of stream 2, attach the stream to video 2 (Video.attachNetStream()) and make it invisible.
  • on NetStream.PlayStop resume stream 2 and make video it visible, and hide stream 1.
  • close stream 1.
  • advance segment
  • goto loop;

Try 3: Double stream buffering with three Video objects

A curious thing I noted was that when I left out the hiding out of the previous video stream this would remove some blank frames being displayed during the transition. The solution to this is to delay the hiding of the video by one. So now we use three video objects.

  • start loading of stream 1, attach the stream to video 1 (Video.attachNetStream()) and make it visible.
  • loop:
  • start preloading of stream 2, attach the stream to video 2 (Video.attachNetStream()) and make it invisible.
  • on NetStream.PlayStop resume stream 2 and make video it visible.
  • close stream 1.
  • advance segment
  • start preloading of stream 3, attach the stream to video 3 (Video.attachNetSteram()) and make it invisible.
  • on NetStream.PlayStop resume stream 3 and make video it visible.
  • close stream 2.
  • advance segment.
  • goto loop;

Try 4: Setting visibility a different way (addChild/removeChild)

The previous method doesn't loop correctly, for some reason it doesn't make the first video object visible the next time around. The solution is to use addChild/removeChild instead of toggling the visibility.

Final notes

Smoothing

Enabling smoothing (Video.smoothing) on the video object introduces artifacts as well.

Clearing the video

Also, clearing the video Video.clear()) before removing it as child from the display removes some artifacts.

Preloading a stream paused mode

When you start loading a stream with NetStream.play() and immediately follow it by a NetStream.pause() the stream may already have played a few frames. This seems to be mostly noticeable in Internet Explorer. I haven't found a solution to this.

Questions

If you have any questions, ideas for improvements, helpful links, etc..., do not hesitate to leave a message on on our forum.

Last modified 13 years ago Last modified on 04/28/09 22:24:26