Tile Image

With Ming, it is also possible to create animations using images. This example uses an animated Santa gif where all of the images were separated into 10 different images. For this lesson, I will be using a square function as introduced in the Notes to the lesson on drawing squares. However, instead of filling it with color, we will fill it with an image using the addFill($img, SWFFILL_TILED_BITMAP) function. Ming will accept bmp and gif images. Some newer versions also accept jpg images. Regardless of the type of image, the code remains the same, SWFFILL_TILED_BITMAP. We will be using gif images. Below is the function we need to place into our movie.

function tileSq($image,$W,$H){
$bitmapfilename = $image;
$fob = fopen($bitmapfilename,"rb");
$img = new SWFBitmap($fob);
$squareshape = new SWFShape();
$squareshape->setRIGHTFill($squareshape->addFill($img, SWFFILL_TILED_BITMAP));
$squareshape->setLine(1,0,0,0,0);
$squareshape->drawLine($W,0);
$squareshape->drawLine(0,$H);
$squareshape->drawLine(-$W,0);
$squareshape->drawLine(0,-$H);
return $squareshape;
}

Once the function is available, we can call on it to load our image into the movie. We need to load every image we are going to use, in the following manner.

$SantaGuitar1=$myMovie->add(tileSq('SantaGuitar1.gif',188,220));
$SantaGuitar1->moveTo(-188,-220);

Where $SantaGuitar1 is the name of our variable, SantaGuitar1.gif is the name of our image, and should be in quotes (single or pleural), as well as the width (188) and height (220) of our image. The image is then placed off the screen at -188, -220, but is readily available for Ming to use when called to. There should be 2 lines of code for each image loaded. Notice this example uses "moveTo" as opposed to just "move". MoveTo is static and places the top left corner of the image at the pixel requested and keeps it there until moved or removed.

Once the images are loaded, then we can begin to animate them within our movie frames as follows:

for($i=0; $i<5; $i++){
$myMovie->nextFrame();
$SantaGuitar1->moveTo(50,15);
}

The above line shows the first image for a time span of 5 frames. This slows it down a bit from showing an image in every frame. That image will need to be removed and replaced with the second image in the next frame.

for($i=0; $i<5; $i++){
$myMovie->nextFrame();
$SantaGuitar1->moveTo(-188,-220);
$SantaGuitar2->moveTo(90,15);
}

Here we removed the first image and placed it off the page, and replaced it with the second image, placed in the same location. This example only goes through the sequence of 10 images once. For a longer movie, you will need to repeat the codes until the desired length of time is achieved.

At the end of the animation, this next line will tell Ming to go to the next frame and stop our movie and not repeat it from the beginning. You can leave this line out if you want the movie to keep repeating, however, it will blink between each repetition of the swf.

$myMovie->add(new SWFAction("gotoFrame(nextframe); stop();"));
$myMovie->nextframe();

You can change the background color in the html file, as shown below and in the notes to Lesson 1.
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0" ID=objects WIDTH=300 HEIGHT=250>
<PARAM NAME=movie VALUE="Santa.swf">
<PARAM NAME=BGCOLOR VALUE="#ff0000">
<EMBED src="Santa.swf" WIDTH=300 HEIGHT=250 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" BGCOLOR="#ff0000">
</EMBED>
</OBJECT>


You can also place an image behind the santa within the Ming movie by tiling that too onto a square, so long as it is placed in the movie before the santa images; otherwise the background will cover the santa.

You can ccp the code summary below to use with your own images, or download zip file which contains the images, Ming code file for Lesson 16 (Santa.php), the html file to display the swf (Santa.html), as well as the swf.

Result:
Refresh Animation