イメージ、SWF ファイル、サウンドファイルなど、様々なタイプのメディアを読み込むことができます。

JPEG、GIF および PNG イメージの埋め込み

Flex では、JPEG、GIF、および PNG ファイルの埋め込みがサポートされます。これらのイメージは、アイコン、スキン、およびその他のアプリケーションアセットに使用できます。

埋め込まれたイメージを実行時に操作する必要がある場合があります。これを行うには、イメージを表すオブジェクトのデータ型を判別してから、オブジェクトの適切な ActionScript メソッドおよびプロパティを使用します。

例えば、ActionScript で [Embed] メタデータタグを使用して GIF イメージを埋め込みます。次を参照してください。

[Embed(source="logo.gif")]
[Bindable]
public var imgCls:Class;

この例では、埋め込みイメージを表す imgCls という名前のクラスを定義しています。JPEG、GIF および PNG ファイルを埋め込むときは、mx.core.BitmapAsset クラスのサブクラスへの参照として imgCls が定義されます。mx.core.BitmapAsset クラスは flash.display.Bitmap クラスのサブクラスです。

ActionScript では、埋め込みイメージを表すオブジェクトを作成し、コントロールに渡す前に操作することができます。そのためには、次の例に示すように、埋め込まれるクラス型を持つオブジェクトを作成し、操作してから、そのオブジェクトをコントロールへ渡します。

<?xml version="1.0"?>
<!-- embed/EmbedAccessClassObject.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
        
            import mx.core.BitmapAsset;
        
            [Embed(source="logo.gif")]
            [Bindable]
            public var imgCls:Class;

            public var varOne:String = "This is a public variable";
            
            private function modImage():void {
                // Create an object from the embed class. 
                // Since the embedded image is a GIF file, 
                // the data type is BitmapAsset.
                var imgObj:BitmapAsset = new imgCls() as BitmapAsset;
                
                // Modify the object.
                imgObj.bitmapData.noise(4);

                // Write the modified object to the Image control.
                myImage.source=imgObj;
            }
        ]]>
    </mx:Script>
    
    <mx:HBox>
        <mx:Image id="myImageRaw" source="{imgCls}"/>
        <mx:Image id="myImage" creationComplete="modImage();"/>
    </mx:HBox>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。

この例では、最初の Image コントロールによって変更前のイメージが表示され、2 番目の Image コントロールによって変更されたイメージが表示されます。オブジェクトの変更には、mx.core.BitmapAsset クラスの bitmapData プロパティを使用します。bitmapData プロパティのタイプは flash.display.BitmapData なので、オブジェクトの操作に、BitmapData クラスのすべてのメソッドとプロパティを使用できます。

SVG イメージの埋め込み

Flex は、SVG（Scalable Vector Graphics）イメージや SVGZ ファイル（GZip 圧縮された SVG イメージ）をアプリケーションに読み込むことができます。これにより、SVG イメージを読み込み、読み込みんだ SVG イメージを Flex コントロールのアイコンとして使用することができます。

Flex は SVG 1.1 仕様のサブセットをサポートしているため、計量可能な 2 次元のベクターグラフィックを読み込むことができます。サポートされる内容としては、基本的な SVG ドキュメント構造や CSS（Cascading Style Sheet：カスケーディングスタイルシート）のスタイル設定、変換、パス、基本シェイプ、色の他、テキスト、ペイント、グラデーション、フォントのサブセットなどが挙げられます。Flex は、SVG アニメーション、スクリプト、インタラクティブ機能を含む SVG イメージの読み込みはサポートしていません。

例えば、ActionScript で [Embed] メタデータタグを使用して SVG イメージを埋め込みます。次を参照してください。

[Embed(source="logo.svg")]
[Bindable]
public var imgCls:Class;

この例では、埋め込みイメージを表す imgCls という名前のクラスを定義しています。SVG ファイルを埋め込むときは、mx.core.SpriteAsset クラスのサブクラスへの参照として imgCls が定義されます。mx.core.SpriteAsset クラスは flash.display.Sprite クラスのサブクラスです。したがって、SpriteAsset クラスのメソッドとプロパティを使用してイメージを操作できます。読み込んだイメージを操作する例については、JPEG、GIF および PNG イメージの埋め込みを参照してください。

サウンドの埋め込み

Flex では、再生可能な MP3 サウンドファイルの埋め込みをサポートします。次の例では、「再生」および「停止」ボタンを持つ単純なメディアプレイヤーを作成しています。

<?xml version="1.0"?>
<!-- embed/EmbedSound.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Script>
        <![CDATA[
        
            import flash.media.*; 
        
            [Embed(source="sample.mp3")]
            [Bindable]
            public var sndCls:Class;
            
            public var snd:Sound = new sndCls() as Sound; 
            public var sndChannel:SoundChannel;
            
            public function playSound():void {
                sndChannel=snd.play();
            }   
            
            public function stopSound():void {
                sndChannel.stop();
            }   
        ]]>
    </mx:Script>

    <mx:HBox>
        <mx:Button label="play" click="playSound();"/>
        <mx:Button label="stop" click="stopSound();"/>
    </mx:HBox>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。

この例では、埋め込み MP3 ファイルを表す sndCls という名前のクラスを定義しています。MP3 ファイルを埋め込むときは、mx.core.SoundAsset のサブクラスへの参照として sndCls が定義されます。mx.core.SoundAsset は、flash.media.Sound クラスのサブクラスです。

Flex では、ファイル名にスペースや区切り記号が含まれていても、正当なファイル名であれば処理できます。MP3 のファイル名に二重引用符が含まれる場合は、ファイル名を一重引用符で囲んでください。

Flex でサウンドファイルを使用する方法は、サウンドファイルを埋め込む方法だけではありません。Sound クラスを使用して、実行時にサウンドファイルをロードすることもできます。詳細については、『Adobe Flex リファレンスガイド』の Sound クラスを参照してください。

SWF ファイルの埋め込み

Flex は、Flash SWF ファイルの埋め込みを完全にサポートします。様々な種類の SWF ファイルを埋め込むことができます。

Flash Player 8 以前用の SWF ファイルの埋め込み

Flash Player 8 以前用に作成された SWF ファイルを埋め込むことができます。埋め込んだ場合、Flex アプリケーションは、埋め込み SWF ファイルとやり取りできません。つまり、Flash Player 8 以前用に作成された SWF ファイルのプロパティまたはメソッドには、Flex アプリケーション内の ActionScript を使用してアクセスできません。

例えば、ActionScript で [Embed] メタデータタグを使用して SWF ファイルを埋め込みます。次を参照してください。

[Embed(source="icon.swf")]
[Bindable]
public var imgCls:Class;

この例では、埋め込み SWF ファイルを表す imgCls という名前のクラスを定義します。imgCls は、mx.core.MovieClipLoaderAsset クラスのサブクラスへの参照として定義されます。mx.core.MovieClipLoaderAsset クラスは、flash.display.MovieClip クラスのサブクラスです。したがって、MovieClipLoaderAsset クラスのメソッドとプロパティを使用してイメージを操作できます。

SWF シンボルの埋め込み

Flex では、埋め込み SWF ファイルに書き出されているシンボルを参照できます。シンボルに依存ファイルが存在する場合、Flex はそれらの依存ファイルも埋め込みます。それ以外の場合は、指定されたシンボルだけが SWF ファイルから埋め込まれます。シンボルを参照するには、symbol パラメータを指定します。

[Embed(source='SWFFileName.swf', symbol='symbolName')]

この機能は、SWF ファイルに複数のシンボルが書き出されているときに、その一部だけを Flex アプリケーションにロードするような場合に使用します。こうして生成された Flex SWF ファイルは、アプリケーションに必要なシンボルだけがロードされているので、SWF ファイル全体を読み込んだ場合よりも、サイズを小さく抑えることができます。

Flex アプリケーションは、SWF ファイルをいくつでも読み込むことができます。ただし、2 つの SWF ファイルが同じファイル名であり、書き出されたシンボル名が同一である場合、SWF ファイルが別々のディレクトリに存在していたとしても、このように重複したシンボルを参照することはできません。

SWF ファイルに ActionScript コードが含まれる場合は、コンパイル時に警告が出力され、埋め込まれたシンボルから ActionScript が除去されます。これは、埋め込むことができるのはシンボル自体のみであることを意味します。

次の例は、各種シェイプのライブラリを含む SWF ファイルから緑色の四角形を読み込みます。

<?xml version="1.0"?>
<!-- embed\EmbedSWFSymbol.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >

    <mx:VBox id="vBox0" width="300" height="300" >
        <mx:Image id="image0" 
            source="@Embed(source='circleSquare.swf', symbol='greenSquare')"
        />
    </mx:VBox>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。

ActionScript の [Embed] メタデータを使用してシンボルを埋め込む場合は、そのシンボルを表すオブジェクトにアクセスできます。次のコードを参照してください。

[Embed(source='shapes.swf', symbol='greenSquare')]
[Bindable]
public var imgCls:Class;

この例では、埋め込みシンボルを表す imgCls という名前のクラスを定義しています。内部では、次のいずれかのクラスのサブクラスへの参照として imgCls が定義されます。

SpriteAsset シングルフレームの SWF ファイル用です。

MovieClipLoaderAsset マルチフレームの SWF ファイル用です。

Flex アプリケーションを表す SWF ファイルの埋め込み

Flex アプリケーションを表す SWF ファイルを埋め込むことができます。例えば、ActionScript で [Embed] メタデータタグを使用して SWF ファイルを埋め込みます。次を参照してください。

[Embed(source="flex2.swf")]
[Bindable]
public var flexAppCls:Class;

この例では、埋め込み SWF ファイルを表す flexAppCls という名前のクラスを定義します。flexAppCls は、mx.core.MovieClipLoaderAsset クラスのサブクラスへの参照として定義されます。mx.core.MovieClipLoaderAsset クラスは、flash.display.MovieClip クラスのサブクラスです。したがって、MovieClipLoaderAsset クラスのメソッドとプロパティを使用して埋め込み SWF ファイルを操作できます。

通常、Flex アプリケーションを埋め込むのは、埋め込む側のアプリケーションと埋め込まれる側のアプリケーションがやり取りする必要がない場合です。埋め込む側のアプリケーションと埋め込まれる側のアプリケーションのやり取りが必要な場合は、独立したアプリケーションとしてではなく、カスタムコンポーネントとしてアプリケーションを実装することを検討する必要があります。

または、SWFLoader コントロールを使用して Flex アプリケーションを実行時にロードする場合は、埋め込む側のアプリケーションが、ロードされる側のアプリケーションとやり取りして、そのアプリケーションのプロパティとメソッドにアクセスにアクセスできます。詳細および使用例については、ロードした Flex アプリケーションの操作を参照してください。

埋め込みイメージでの 9 つのスライスの拡大 / 縮小の使用

Flex は、埋め込みイメージの 9 つのスライスの拡大 / 縮小をサポートします。この機能を使用すると、1 つのイメージを、それぞれ独立して拡大 / 縮小する 9 つのセクションに分割して定義できます。9 つの領域は、イメージ内に引かれた 2 本の水平グリッドと 2 本の垂直グリッドで定義されます。イメージの内側に 縦 3 × 横 3 のグリッドができます。イメージに囲み枠や四隅の飾りがある場合、グラフィック全体を拡大 / 縮小するよりも、9 つのスライスの拡大 / 縮小を使用する方が柔軟に操作できます。

次の例は、あるイメージと、そのイメージが 9 つのスライスの拡大 / 縮小のグリッドで定義された領域に分割された状態を示します。

9 つのスライスの拡大 / 縮小を使用する埋め込みイメージを拡大 / 縮小すると、すべてのテキストおよびグラデーションが通常どおり拡大 / 縮小します。ただし、他のタイプのオブジェクトには次のルールが適用されます。

• 中央領域のコンテンツは通常どおり拡大 / 縮小します。
• 左上、右上、左下、右下のコンテンツは拡大 / 縮小しません。
• 上側領域と下側領域にあるコンテンツは水平方向にのみ拡大 / 縮小します。左側領域と右側領域にあるコンテンツは垂直方向にのみ拡大 / 縮小します。
• すべての塗り（ビットマップ、ビデオ、グラデーションを含む）は、形状に収まるように伸縮されます。

イメージを回転した後で拡大 / 縮小を適用すると、すべて通常の拡大 / 縮小になり、9 つのスライスの拡大 / 縮小が定義されていない場合と同じ結果になります。

9 つのスライスの拡大 / 縮小を使用するには、埋め込みステートメント内で scaleGridTop、scaleGridBottom、scaleGridLeft および scaleGridRight の 4 つのパラメータを定義します。これらのパラメータの詳細については、埋め込みパラメータを参照してください。

Adobe Flash Professional を使用して指定された 9 つのスライスの拡大 / 縮小情報が、埋め込み SWF ファイルに既に含まれている場合があります。こうした SWF ファイルでは、埋め込みステートメントで指定した 9 つのスライスの拡大 / 縮小のパラメータは無視されます。

次の例は、枠線を持つ Flex ロゴを作成します。9 つのスライスの拡大 / 縮小を使用して、イメージのサイズを変更しても、枠線のサイズが変わらないようにしています。

<?xml version="1.0"?>
<!-- embed\Embed9slice.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    width="1200" height="600"> 

    <mx:Script>
        <![CDATA[
            [Embed(source="slice_9_grid.gif", 
                scaleGridTop="25", scaleGridBottom="125", 
                scaleGridLeft="25", scaleGridRight="125")]
            [Bindable]
            public var imgCls:Class;            
        ]]>
    </mx:Script>
    
    <mx:HBox>
        <mx:Image source="{imgCls}"/>
        <mx:Image source="{imgCls}" width="300" height="300"/>
        <mx:Image source="{imgCls}" width="450" height="450"/>
    </mx:HBox>
</mx:Application>
前の例で実行する SWF ファイルは以下のとおりです。

元のイメージは 30 × 30 ピクセルです。上記のコードでは、5 ピクセルの枠線のサイズが維持される、サイズ変更可能なイメージが生成されます。

9 つのスライスの拡大 / 縮小を省略すると、拡大 / 縮小されたイメージが元のイメージとまったく同じに表示されます。次の図を参照してください。

この例では、埋め込みイメージを表す imgCls という名前のクラスを定義しています。イメージが、9 つのスライスの拡大 / 縮小を使用する SWF ファイルの場合は、mx.core.SpriteAsset クラスのサブクラスとして imgCls が定義されます。mx.core.SpriteAsset は、flash.display.Sprite クラスのサブクラスです。したがって、そのオブジェクトの操作には、SpriteAsset クラスのすべてのプロパティとメソッドを使用できます。

他のすべてのファイル種類の埋め込み

Flex アプリケーションには、任意のタイプのファイルをビットマップ配列として埋め込むことができます。ただし、Flex は、前述した以外のファイルを認識または処理しません。それ以外のタイプのファイルを埋め込む場合は、トランスコードロジックを用意してアプリケーションユーザに正しく表示する必要があります。

Flex でサポートされないタイプのファイルをロードするには、[Embed] メタデータタグを使用して、ソースファイルと MIME タイプ「application/octet-stream」を定義します。次に、埋め込まれたファイルの新しいクラス変数を定義します。埋め込みオブジェクトは、ByteArrayAsset タイプのオブジェクトです。

次のコードは、ビットマップ（.bmp）ファイルを埋め込み、「Show Properties」ボタンがクリックされると、埋め込まれたオブジェクトのプロパティを表示します。他の方法でこのオブジェクトを表示または使用するには、サポートされるオブジェクトタイプを作成するためのコードを用意する必要があります。

<?xml version="1.0"?>
<!-- embed\EmbedOtherFileTypes.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> 
 
    <mx:Script>
        <![CDATA[
  
            import mx.core.UIComponent;
            import mx.core.BitmapAsset;
   
            [Embed(source="logo.bmp",mimeType="application/octet-stream")]
            private var FileClass : Class;
   
            private function captureEmbeddedImage():void {
                var fileByteArray:Object = new FileClass();
                myTA.text+= "File length:  " + String(fileByteArray.length) + "\n";
                myTA.text+="File type:  " + 
                    String(getQualifiedSuperclassName(fileByteArray)) + "\n";
            }   
        ]]>
    </mx:Script> 
 
    <mx:Button
        id="showProperties" 
        label="Show Properties" 
        click="captureEmbeddedImage();"/>
        
    <mx:TextArea id="myTA"
        width="75%"
        height="100"/>        
</mx:Application>