読者です 読者をやめる 読者になる 読者になる

【Flex】【ActionScript】画像埋め込みの落とし穴

画像埋め込みの落とし穴にはまっていました…。
swfで画像が表示されず、しばらく格闘していました…。

AIRでは、画像は、画像ファイルが入っているフォルダごとコンパイルしますが、swfで出力すると、外部のフォルダを参照する設定になってしまうようです。
今までswfファイルを作って使うときは、Flexで保存した後に、パッケージ内のbin-debugの中にあるswfをコピーして、デスクトップ貼付けてサーバにアップロードなどしていました。
swfの動きの確認は、Flex内の実行ボタンを使っていたので、画像が表示されないことに気付いていませんでした。

今回のまずいコード

<mx:Image id="image" source="img/icon_048.png" x="7" y="4"/>

これだと、同じディレクトリに有る、imgフォルダのicon_048.pngファイルを参照して表示します。
サーバーに同じフォルダ+画像をアップロードすれば一応は表示されますが、D&Dできなくなりました。

正しいコード

<mx:Image id="image" source="@Embed('img/icon_048.png')" x="7" y="4"/>

@Embedを記述しています。
これは参考サイトに分かりやすく述べられていました。
していファイルを埋め込んでコンパイルしてくれるようです。
※ただし、Flexのパッケージ内のbin-debugの中にあるswfをコピーして、デスクトッ(ry)という上に書いたような、ただ単にコピペしたswfでは、画像が組み込まれていないようでうまくいきませんでした。
そのため、「リソースビルドの書き出し」を行って、編集していたMXMLファイルと同じファイル名のswfを利用して下さい。
それなら、画像ファイルも込のコンパイルが行われるようです。

リソースビルドの書き出しは、AIRだけでなくswfにも出来ると言うことに今更気づいて恥ずかしいです…