PHP產生Flash動畫的實現代碼

其中有一組映射到 SWF 動畫中的資料類型的對象：子圖形、圖形、文本、位元影像等等。在本文中，我使用了先行編譯的擴充 php_ming.dll 庫用於 Windows 版本的 PHP。

清單 2 顯示了使用 Ming 庫實現的 HelloWorld 樣本。

清單 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' ); ?>

在命令列中運行這段代碼將組建檔案 hello.swf。當我在 網頁瀏覽器中開啟該檔案時，看到了圖 1 所示的結果。

圖 1. 使用 Ming 的 HelloWorld 樣本

回過頭來查看這段代碼，我做的第一件事是建立指向一個內建字型（_sans）的指標，然後建立文字欄位，設定字型、顏色和大小，最後為其提供 一些常值內容（“Hello World”）。再接下來建立了一個 SWFMovie 對象並設定其尺寸。最後，向動畫中添加了文本元素並將動畫儲存到檔案中。

作為直接構建檔案的替代性方法，也可以使用下面的代碼，使 SWF 動畫像頁面那樣輸出，而無需使用 save 方法：

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

此過程類似於使用 PHP 中的 ImageMagick 庫來構建位元影像。對於所有 Ming 樣本，我都將使用 save 方法，但您可以根據喜好來選擇是否使用 save 方法。

讓文本動起來

只是將一些文本放入 Flash 動畫中是沒有多大意義的，除非您能讓它動起來。因此我整合了清單 2 中的樣本，它包括兩段文本：一部分開始很小後來變得越來越大，而另一部分保持靜態。

清單 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' ); ?>

在命令列中執行這段代碼時，它將產生 text.swf。在 網頁瀏覽器中開啟該檔案時，我看到了圖 2 所示的圖片。

圖 2. text.swf 檔案

文本 “1000” 開始時很小，大小為 350 個點。然後使用 scaleTo() 方法使其增大為 750 個點，方法是對動畫對象使用 nextframe() 方法。

要理解其工作原理，需要瞭解一點 Flash 製作動畫的方法。Flash 中的動畫就像電影中的動畫一樣運行：按幀運行。子圖形將按幀在動畫架構中移動。一個主要差別是 Flash 不擷取每幀的快照。它儲存子繪圖物件在每幀的狀態。

您可能會注意到，我有一個名為 $pt 的變數，該變數具有文本 “1000”。隨後當我把 $pt 添加到動畫中時，獲得了通過 add() 方法返回的名為 $pts 的新對象。該對象是 SWFDisplayItem， 表示子圖形的執行個體。然後我可以圍繞動畫架構的表面逐幀移動執行個體。 這有點兒混亂，但我可以擁有同時移動的多個版本的 “1000” 文本子圖形或 “points” 文本子圖形。

繪製一些圖形

接下來要處理的是向量圖形。首先僅繪製一條簡單的直線，它從架構的左側頂部到右側底部。

清單 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' ); ?>

在命令列中運行此指令碼，然後查看輸出的 .swf 檔案，效果 3 所示。

圖 3. 繪製簡單的直線

好的 —— 這十分簡單，也不怎麼令人激動。那麼我做了什嗎？建立了一個新的 SWFShape 對象，然後向其中添加了一些筆觸移動和直線。然後我將其作為子圖形添加到了動畫中。

為了讓它變得更有趣，我使用了與剛才文本中使用的相同的幀式動畫。但在本例中，我用下面所示的代碼使這條直線圍繞動畫的中心旋轉。

清單 5. 旋轉直線

<?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' ); ?>

在本例中，我從 -100, -100 到 100, 100 畫了一條直線。這將把直線的中心放在座標 0,0 處。這樣，當我在旋轉圖形時，直線的中心將發生旋轉。

當我向動畫中添加圖形時，將移動返回到架構中心的 SWFDisplayItem。然後用 rotate() 方法使它旋轉並每旋轉一周就增大其架構。

使用圖片

文本和諸如直線、圓、弧、曲線和矩形之類的簡單向量圖形都是十分優秀的，但在理想的情況下，您必須能訪問這些 Flash 動畫中的圖片。值得慶幸的是，Ming 庫使您可以輕鬆的使用圖片，如下所示。

清單 6. 使用圖片

<?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' ); ?>

在命令列中運行此指令碼並在瀏覽器中查看 image.swf，結果 4 所示。

圖 4. 產生的圖片動畫

此指令碼在開始時讀取了本地的 .jpeg 檔案（在本例中，是我女兒 Megan 的照片）。然後建立一個矩形，並在其中填充圖片。在那之後，它在10 幀處使用了位移效果使圖片稍微調動。

繼續移動

我只是觸及了 Ming 庫可為您提供的操作的表面。在這裡我沒有展示互動部分，在互動部分您可以將簡單的指令碼與元素串連起來。（但是，如果換成是互動操作，如果您有一個十分複雜 的 Flash 動畫，則可能需要考慮使用 Flash 開發工具來構建 Web 應用程式內與 Web 服務對話的 Flash 動畫。）

構建更加複雜的 Flash 動畫的另外一種選擇是使用諸如 Adobe Flex 或 Laszlo 之類的製作工具，這兩種工具都提供了用於為 Flash 動畫的使用者介面布局的 XML 文法以及一個更輕鬆地常式，可用於開發為介面提供互動操作的 JavaScript。