Controlling Animated GIFs

July 31, 2001
by Will Turnage

Dear Multimedia Handyman,

Is there any way to set an Animated GIF to paused at first, and later to give some command to start it to play?

Thanks!

Michael Nadel

Dear Michael,

Animated GIFs can be pretty convenient to use in your Director projects. They're small, relatively easy to make, and can be used in Web sites too. So if you're building a Shockwave piece to go along with a Web site, then it makes perfect sense that you should use Animated GIFs in Director. But once you've loaded the Animated GIFs into your movie, you will probably want to gain some control over them. First, you should start with the basics.

Starting, Stopping, and Rewinding

The three basic Lingo commands to control Animated GIFs are pause, resume, and rewind. The thing to keep in mind when using these commands is that they only work when used in conjunction with a sprite. For instance, you could say:

sprite (10).resume ()

sprite (10).pause ()

however, you cannot use these functions when referring to a cast member. So if you typed

member ("animGIF").resume ()

Director will return an error saying that the handler was not found in the object.

One easy way to use pause and resume in a movie is to create a behavior that you place on the Animated GIF itself. This behavior will pause the GIF when the GIF is playing and start the GIF if it is paused. The code for that behavior looks like this:

property pPlayState

on beginSprite me

pPlayState = true
me.updateGIF ()

end

on mouseUp me

pPlayState = not pPlayState
me.updateGIF ()

end

on updateGIF me

  if pPlayState then
    sprite (me.spriteNum).resume ()
  else
    sprite (me.spriteNum).pause ()
  end if

end

This behavior starts by setting the pPlayState variable equal to true and then calling the updateGIF handler. This handler then checks if pPlayState is true or not. If it's true, then it plays the Animated GIF, otherwise it pauses the Animated GIF. Finally, whenever you click on the GIF, it toggles the value of pPlayState and then either plays or pauses the Animated GIF by calling the updateGIF handler.

Controlling the Speed of Animated GIFs

If you want to control the speed of an Animated GIF, then there are two Lingo terms you need to use: playBackMode and fixedRate.

The playBackMode has three different options which control how an Animated GIF plays. The first option, #normal, ujses the Animated GIF's own timing information to determine when frames are displayed. The second option, #lockStep, plays each frame of the Animated GIF at the same rate as the Score of the Director movie. This option is used to make sure that animations are in sync with other frame-based animations in your movie. The downside to this option is that if your Animated GIF has frames of different lengths, then it will play much differently that it would if the playBackMode were set to #normal.

The final option for playBackMode is #fixed. When you've set the playbackMode of an Animated GIF to #fixed, then you can control the playback of the Animated GIF through another Lingo property called fixedRate. The fixedRate property is a number that represents the individual frame rate of an Animated GIF. Keep in mind when setting the fixedRate that it has to be an integer and that it can't be zero -- it has to be at least one. If you want to stop an Animated GIF, you have to use the pause command.

The biggest difference between the pause, resume, and rewind commands and the playBackMode and fixedRate properties is that the playBackMode and fixedRate are properties of the cast member, not the sprite. So in your code you could say,

member ("animGIF").playBackMode = #fixed
member ("animGIF").fixedRate = 20

But if you tried to say

sprite (10).playBackMode = #fixed

And the member in sprite 10 was not an Animated GIF, then you would get an error.

When you put everything together, you'd be amazed at the control you can have over an Animated GIF. Here's a movie that demonstrates all of this Lingo in action.

The GIF tempo slider is only active when the playbackMode is #fixed.

Using Animated GIFs in your Director movie is a great way to reduce file size, and potentially save you lots of time because you don't have to recreate existing Animated GIFs inside of Director. The only drawback to Animated GIFs is that you don't have full control over them. You can't tell an Animated GIF to jump to a certain frame, and you also can't easily know which frame an Animated GIF is on. If you need that kind of functionality in your program, then you have two options. You will either have to remake the Animated GIF inside Director using bitmaps and film loops or you can just import the Animated GIF as a Quicktime movie inside Director. But this last options requires that the user have Quicktime installed on his or her machine.

A sample Director 8 movie is available for download in Windows or Macintosh format.

Will Turnage is a multimedia programmer based in New York City. In addition to his weekly role as Director Online's Multimedia Handyman, he is also the Technology Director for Sony Music's Client Side Technologies Group. You can read more about his work at http://will.turnage.com/.