みなさんお久しぶりです。
２度目の投稿になる「井筒」です。
今回は「Swiffy編」ということでコンテンツとして利用する上で必要な画像置換や出力方法をご紹介します。
Swiffyで変換したものをイジってみよう
まずSwiffyで変換したHTMLファイルのソースを見てみましょう。
変換後のソース・・・とてつもない量になってますよね・・・
１４行目の青い枠で囲まれている部分を「Swiffyランタイム」といい、１７行目から赤い枠で囲っている部分（長すぎて囲えていませんが・・・）を「JSONオブジェクト」といいます。
つまりSwiffyはSWFをJSONデータに変換してSwiffyランタイムで再生するという仕組みになるわけです。
では本題の「画像置換」について書いていきましょうか。
「JSONオブジェクト」の中に”data”:”data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD～～となっている部分があるかと思います。この部分は何かというとですね・・・画像ファイルそのものをbase64変換をしたものなんですね。
じゃあこれを入れ替えたい画像をbase64変換したもにすれば入れ替えれるんじゃない？・・・その通り！入れ替えれます。
では実際にPHPを使った置換部分を見てみましょう。※ここで読み込みに使用しているテキストファイルにはJSONオブジェクトが入っています。
ソース ※json.txtにはJSONオブジェクトの部分が入っています
$swiffyTag = file_get_contents('json.txt');
$img = "sample.gif";
$ext = "gif";
$encode = "data:image/".$ext.";base64,".base64_encode(file_get_contents($img));
$swiffyTag = str_replace("%sampleImg%", $encode, $swiffyTag);
ソースの解説
ではこのソースは何をしているのか・・・まずはjson.txtから説明しましょう。上部で掲載しているSwiffyの「JSONオブジェクト」をそのままテキストファイルに突っ込んで変換したい部分を置換しやすいように「%sampleImg%」に変更してあります。具体的には「data:image/jpeg;base64,～base64変換画像データ～」の部分です。
そして変換する際に気をつけなければいけないことがいくつかあります。
- jpegと表記されている部分は使用する画像の拡張子に合わせる。
- 置換する画像が複数ある際にもしプログラムによって使用しない箇所でも置換しやすいような文字列（base64変換した画像データ以外）になっている部分がある場合、その部分もなんらかの画像をbase64変換した画像データと置換してやらなければSwiffyランタイムが正常に動作しません。
上記２点を守れば大抵のものは大丈夫です。
実際にコンテンツとして使用するにはFlash側での対応も必要になってきます。
Flash側の対応については好井さんが書かれたSwiffyで画像を差替える際のFlash側の対応を参考にしてみてください。
次回の私のブログでは表示のiPhoneとandroidの表示の対応とandroidでFlashを扱う上での注意点をご紹介します。
