なんとなくサンプルに出てきていたから使っていた「Embed」ですが、なんだか使い方は様々だったようです。
実際使う時絶対忘れそうなので覚書。

1.　ActionScript ファイルまたは MXML ファイルの ブロック内にアセットを埋め込む場合に使用する時
[Embed(parameter1, paramater2, ...)] メタデータタグ

2.　MXML タグ定義で使用する時
@Embed(parameter1, paramater2, ...) ディレクティブ

3.　MXML ファイルの <mx:Style> ブロック内で使用する時
Embed(parameter1, paramater2, ...) ディレクティブ

ちょっとずつEmbedの書き方が違いますよね。

例えば 1. の書き方で画像を読み込んだ場合

<mx:Script>
<![CDATA[
[Embed(source="assets/logo.png")]
[Bindable]

public var Logo:Class;
]]>
</mx:Script>

<mx:Image id="myLogo" source="{Logo}"/>

<mx:Image id="myLogo2" source="{Logo}"/>

とidを別の名前でふってあげると画像をコピー出来るんですが、
2. のやり方で書くと

<mx:Image id="myLogo" source="@Embed('assets/logo.png')"/>

直接書いてしまうので、もちろん画像を１つだけしか使えません。

1. の使い方でもう一つ。
上記の
[Embed(source="assets/logo.png")]
の部分をswfにするともちろんswfファイルが読めるのですが、もうひとつ加える事によって、そのswfファイルの中にあるButton および MovieClip シンボルだけを読み込む事が出来るようなのです。
ただし、Graphic シンボルは ActionScript 用にエクスポートできないので、埋め込むことはできません。
となっていました。
回避方法は探すとみつかるとは思いますが、基本の方法では無理なようです。

<mx:Script>
<![CDATA[
[Embed(source="assets/library.swf", symbol="BadApple")]

[Bindable]
public var BadApple:Class;

[Embed(source="assets/library.swf", symbol="Pumpkin")]

[Bindable]
public var Pumpkin:Class;

]]>
</mx:Script>

<mx:Image id="badApple" source="{BadApple}" width="150" height="151.8"/>

<mx:Image id="pumpkin" source="{Pumpkin}" width="150" height="131.7"/>

symbol プロパティにシンボルのリンケージ名を書いてやる事で、それだけを使用する事が出来るようです。
これ、どうするんだろうとちょっと思っていたので、すっきりです。

mxmlコンポーネントButtonに対して画像を当てはめる場合。

<mx:Style>
Button
{
upSkin: Embed("assets/box_closed.png");

overSkin: Embed("assets/box.png");
downSkin: Embed("assets/box_new.png");

}
</mx:Style>

<mx:Button/>

と書けばButtonをデフォルトからグラフィカルに変化！！です。
これもすっきり。

あと、フォントの読み込み。
これも疑問に思っていた内容なので、覚書です。

1. の書き方なのですが、

[Embed(source='myfont.ttf', fontName='foo', mimeType='application/x-font')]
var myfont:Class;

MainTextField.defaultTextFormat=new TextFormat("font", 12, 0x000000);
MainTextField.embedFonts = true;

source にハードディスク上のフォントファイルにあるTrueTypeのフォントを指定します。
読み込めるフォントタイプはTTFだけです。これも要注意！！
で、TextFormatに読み込んだファイルのClass名をしていてあげて、embedFontsを”true”にしてやればOK。

フォントもMXML ファイルの での読み込みも出来ます。

<mx:Style>
@font-face
{
font-family: Copacetix;

src: url("assets/copacetix.ttf");
unicode-range:
U+0020-U+0040, /* Punctuation, Numbers */

U+0041-U+005A, /* Upper-Case A-Z */
U+005B-U+0060, /* Punctuation and Symbols */
U+0061-U+007A, /* Lower-Case a-z */
U+007B-U+007E; /* Punctuation and Symbols */

}

.MyTextStyle
{
font-family: Copacetix;
font-size: 24pt;
}

</mx:Style>

<mx:Text styleName="MyTextStyle" text="Embedded fonts rock!" width="100%"/>

ううん〜〜
色々方法がありますねぇ。
使い方、使いどころ、考える事が多いですなぁ。

最後に
MIME タイプについて

指定しなければFlex側でファイルの拡張子に基づいて、読み込むファイルのタイプを推測してくれるようです。
指定した場合はオーバーライドで書き換えてくれるみたいです。

  • application/octet-stream
  • application/x-font
  • application/x-font-truetype
  • application/x-shockwave-flash
  • audio/mpeg
  • image/gif
  • image/jpeg
  • image/png
  • image/svg
  • image/svg-xml

上記すべてを参考にさせてもらったサイト様

タグ:, , , , , ,