PHP Flash Animation Generation implementation code

There is a set of objects mapped to the Data Type in the SWF animation: Child graphics, graphics, text, bitmap, and so on. In this article, I used the pre-compiled extension php_ming.dll library for PHP in Windows.

Listing 2 shows the HelloWorld example implemented using the Ming library.

Listing 2. Hello. php

<?php $f = new SWFFont( '_sans' ); $t = new SWFTextField(); $t->setFont( $f ); $t->setColor( 0, 0, 0 ); $t->setHeight( 400 ); $t->addString( 'Hello World' ); $m = new SWFMovie(); $m->setDimension( 2500, 800 ); $m->add( $t ); $m->save( 'hello.swf' ); ?>

Run this code in the command line to generate the hello.swf file. When I open the file in a Web browser, I see the result shown in Figure 1.

Figure 1. HelloWorld example using Ming

Looking back at this code, the first thing I do is to create a pointer pointing to a built-in font (_ sans), then create a text field, and set the font, color, and size, finally, it provides some text content ("Hello World "). Then createSWFMovieObject and set its size. Finally, add text elements to the animation and save the animation to the file.

As an alternative method for directly building files, you can also use the following code to make SWF animation output as a page without using the save method:

header( 'Content-type: application/x-shockwave-flash' ); $m->output( );

This process is similar to using the ImageMagick library in PHP to build bitmap. For all the Ming examples, I will use the save method, but you can choose whether to use the save method based on your preferences.

Make the text dynamic

It doesn't make much sense to put some text into a Flash Animation unless you can make it work. Therefore, I integrated the example in Listing 2, which contains two text segments: some of which grew larger at the beginning, while the others remained static.

Listing 3. Text. php

<?php $f = new SWFFont( '_sans' ); $pt = new SWFTextField(); $pt->setFont( $f ); $pt->setColor( 0, 0, 0 ); $pt->setHeight( 400 ); $pt->addString( '1000' ); $tt = new SWFTextField(); $tt->setFont( $f ); $tt->setColor( 192, 192, 192, 90 ); $tt->setHeight( 350 ); $tt->addString( 'Points' ); $m = new SWFMovie(); $m->setDimension( 2500, 800 ); $pts = $m->add( $pt ); $pts->moveTo( 0, 0 ); $tts = $m->add( $tt ); $tts->moveTo( 1300, 200 ); for( $i = 0; $i < 10; $i++ ) { $m->nextframe(); $pts->scaleTo( 1.0 + ( $i / 10.0 ), 1.0 + ( $i / 10.0 ) ); } $m->save( 'text.swf' ); ?>

When you execute this code in the command line, it generates text.swf. When you open the file in a Web browser, I see the image shown in figure 2.

Figure 2. text.swf File

The text "1000" is very small at the beginning and the size is 350 points. Then usescaleTo()Method to increase it to 750 points, the method is to use the animation objectnextframe()Method.

To understand how it works, you need to understand how Flash animation is made. The animation in Flash runs like an animation in a movie: by frame. The child image is moved by frame in the animation frame. One major difference is that Flash does not get snapshots of each frame. It stores the status of the sub-image object in each frame.

You may notice that I have$ptVariable, which has the text "1000 ". Then$ptWhen added to the animationadd()The name returned by the method is$pts. This object isSWFDisplayItem, Indicating the child image instance. Then I can move the instance frame by frame around the animation frame. This is a bit confusing, but I can have multiple versions of the "1000" text book graph or the "points" text book graph simultaneously.

Draw some images

Next we will deal with vector graphics. First, draw a simple straight line from the top left of the frame to the bottom right.

Listing 4. Line. php

<?php $m = new SWFMovie(); $m->setDimension( 300, 300 ); $s = new SWFShape(); $s->setLine( 10, 0, 0, 0 ); $s->movePenTo( 10, 10 ); $s->drawLineTo( 290, 290 ); $m->add( $s ); $m->save( 'line.swf' ); ?>

Run the script in the command line and view the output. swf file. effect 3 is shown.

Figure 3. Draw a simple line

Okay-this is very simple and not very exciting. So what did I do? A newSWFShapeObject, and then add some strokes and straight lines to it. Then I add it to the animation as a child image.

To make it more interesting, I used the same frame animation that was used in the text just now. However, in this example, I use the code shown below to rotate this line around the center of the animation.

Listing 5. rotating a straight line

<?php $m = new SWFMovie(); $m->setDimension( 300, 300 ); $s = new SWFShape(); $s->setLine( 5, 0, 0, 0 ); $s->movePenTo( -100, -100 ); $s->drawLineTo( 100, 100 ); $ts = $m->add( $s ); $ts->moveTo( 150, 150 ); for( $i = 0; $i < 100; $i++ ) { $ts->rotate( 10 ); $m->nextframe(); } $m->save( 'rotate.swf' ); ?>

In this example, I draw a straight line from-100,-100 to 100,100. This places the center of the straight line at coordinates 0, 0. In this way, when I rotate the image, the center of the straight line will rotate.

When I add a graphic to an animation, I move it back to the frame centerSWFDisplayItem. Then userotate()Method To make it rotate and increase its frame every week.

Use Images

Text and simple vector graphics such as straight lines, circles, arcs, curves, and rectangles are excellent, but ideally you must be able to access the images in these Flash animations. Fortunately, the Ming library allows you to use images easily, as shown below.

Listing 6. Using images

<?php $img = new SWFBitmap( file_get_contents( 'megan.jpg' ) ); $s = new SWFShape(); $imgf = $s->addFill( $img ); $s->setRightFill( $imgf ); $s->movePenTo( 0, 0 ); $s->drawLineTo( $img->getWidth(), 0 ); $s->drawLineTo( $img->getWidth(), $img->getHeight() ); $s->drawLineTo( 0, $img->getHeight() ); $s->drawLineTo( 0, 0 ); $m = new SWFMovie(); $m->setDimension( $img->getWidth() * 2, $img->getHeight() * 2 ); $is = $m->add( $s ); $is->moveTo( $img->getWidth() / 2, $img->getHeight() / 2 ); for( $i = 0; $i < 10; $i++ ) { $is->skewx( 0.02 ); $is->skewy( -0.03 ); $m->nextframe(); } $m->save( 'image.swf' ); ?>

Run this script on the command line and view image.swf in the browser, as shown in result 4.

Figure 4. generated image Animation

At the beginning, this script reads the local. jpeg file (in this example, it is a photo of my daughter Megan ). Create a rectangle and fill the image with it. After that, it used the displacement effect at 10 frames to make the image move slightly.

Continue to move

I just touched the surface of the operations that the Ming library can provide for you. The interaction section is not displayed here. In the interaction section, you can connect simple scripts with elements. (However, for interactive operations, if you have a very complex Flash animation, you may need to consider using Flash development tools to build Flash animations for dialog between Web applications and Web services .)

Another option for building more complex Flash animations is to use production tools such as Adobe Flex or Laszlo, both tools provide XML syntax for the layout of the Flash Animation user interface and a simpler routine for developing JavaScript that provides interactive operations for the interface.