2013年2月23日土曜日

Flashの画像を差し替える

ソースリストなど一切失われてしまって手元にあるのはSWFだけ。その上のビットマップを張り替える必要が生じて、いろいろ試行錯誤しました。

  • swfmill
  • swfmill on Moutain Lion
  • 画像差し替えのために
  • どうやってPNGをエンコードするか
  • Mountain Lion上で動かして見る



■ swfmill ■

というオープンソースのツールがあります。これはSWF<->XMLを相互に変換できるという素晴らしいものです。コマンドラインツールでソースとMac版 /  Windows版が配布されています。Windows版はdylibも含んでいて、インストーラを動かせばすぐ使えるようになるはずです(私の環境ではdylibをインストールする時にアンチウィルスさんに怒られる)。

Macでは以下のような作業が必要になります。
  1. サイトからMac版バイナリをダウンロード&解凍
  2. ターミナル上で必要なdylibを用意して、swfmillを実行
…と書くと簡単なんですが。

■ swfmill on Mountain Lion■

配布されているのはコマンドラインツールのバイナリです。前述の通りlibfreetype6などのdylibが/usr/local/libにインストールされている必要があります。いろいろ試行錯誤しましたが、結果としてこんな感じ
  1. http://xquartz.macosforge.org/landing/からXQuartzをダウンロード&インストール
  2. MacPortsをインストール
  3. ターミナル上で準備
    1. MacPortsを最新版にアップグレード
      • sudo port self update
    2. 必要なdylibを読み込むためにportを実行
      • sudo port libfreetype +universal
      • sudo port libpng +universal
    3. portが読み込みディレクトリとswfmillが想定するディレクトリが異なるのでシンボリックリンクを置く
      • sudo ln -s /usr/X11/lib/libfreetype.6.dylib /usr/local/lib/
      • sudo ln -s /usr/X11/lib/libpng12.0.dylib /usr/local/lib/
    4. swfmill起動してdylibが足りないというエラーが出たら、2のようにdylib名称の尻尾を取ってportし、3のようにしてシンボリックリンクを置く
これで使えるようになるはずです。

swfmillの使い方は、またターミナル上での作業ですが、
  • SWFからXMLへの変換
    • swfmill swf2xml source.swf result.xml
  • XMLからSWFへの変換
    • swfmill xml2swf source.xml result.swf
と実行するだけです。他にも沢山機能があるようですが、今回使ったのはこれだけ。

蛇足ですがswfmillをダウンロード&解凍したディレクトリの中で作業するのであれば、
  • ./swfmill
とする必要があります。

変換処理を確認するためにSWFからXMLに変換したものをそのままSWFに変換しなおして動作確認してみてください。私の場合は多少SWFのサイズが変わったものの、動作が変わらなかったので一応OKとしました。

■画像差し替えのために■

XMLをエディタなどで開きます。PNG/GIF画像はDefineBitsLossless2のタグ内にbase64でエンコードされています。私の場合、対象画像のwidthから一発で目的の画像を探し当てることが出来たのですが、そういうヒントがない場合はバイナリのサイズなどから虱潰しに試してみるしかないかもしれないですね…みなさんのご健闘を祈ります。さて、あとは、差し替える画像をテキストに変換するだけです。

■どうやってPNG画像をエンコードするか■

ここは悩みました…。JPEGは比較的カンタンで、単純にBase64に変換してその文字列を<data></data>タグで挟めば良いらしいです。でも、GIF / PNGに関しては、技術的な解説記事が出ているし、Rubyでのライブラリもあるんですが…「ドラッグ&ドロップとは言わないが、せめてコマンドライン一発で変換するツール」みたいなのは見当たりません。

SFWMILLの解説ページにXMLに新しい画像ファイルを取り込む方法は書いてあるのですが、いろいろタグの書き方を変えてみたもののうまくいきません。楽をするためならどんな苦労をすることも厭わないので、帰りの電車で眉間に縦ジワ寄せつつ考えていたら…ひらめいた。画像を入れたSWFを作って、それをswfmillで変換すれば良いということにw

  1. 元の画像をswfmillでXMLに変換しておく
    • swfmill swf2xml Source.swf Source.xml
  2. FlashBuilderを起動、新しいFlashプロジェクトを作る
  3. 画像ファイルをプロジェクトに追加
  4. デザインビューでImageを貼り、さっきの画像ファイルをEmbed
  5. あとは何もいじらないで、リリースビルド
  6. bin-releaseの中の <project-name>.swfをXMLに変換
    • swfmill swf2xml image.swf image.xml
  7. 変換したXML(image.xml)をエディタで開き<data>タグを探す。
  8. 新しい<data><data>....</data></data>を古いものの上にコピペ
  9. swfmillでXMLをSWFに変換
    • swfmill xml2swf Source.xml Result.swf

■Mountain Lion上で動かして見る■

そういえばコントロールパネルからapacheを起動できなくなったんですね。これまたターミナルから、

で起動させて、ブラウザ上で
    http://localhost/
とタイプし「It works!」が表示されれば起動は成功。あとはさっき出来上がったswfを
    sudo cp test.swf /Library/WebServer/Documents/
などとコピーして、ブラウザでURLを入力します。
    http://localhost/test.swf
これで思った通りに画像が差し替わっていれば出来上がりです。

それにしても…オレもいろんなことやるなぁ…。

0 件のコメント:

コメントを投稿