Flex中标签Embed的几种使用方式

 

可以在Flex应用程序中嵌入各种元素。被嵌入的元素将编译进SWF文件。它们不是在运行时载入的,所以不必为应用程序部署原元素。

可以嵌入的图像格式有PNG、JPEG、GIF。嵌入后可以同时使用它的多个实例。

下面的例子使用[Embed]原标签经image嵌入应用程序,并且采用绑定ActionScript类的形式。这就可以绑定Image控件的source属性到Logo类。可以绑定Logo类到任何可以使用image的组件属性上,比如Button控件的icon属性。

例子:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    viewSourceURL="src/EmbeddingImages/index.html"
    layout="horizontal" width="350" height="250">
   
    <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}"/>

</mx:Application>
-----------------------------------------------------------------
如果想只使用一个实例的话,可以使用内部@Embed直接将图像嵌入Flex应用程序。
下面的例子添加了一个Image组件,并且使用@Embed直接定业了它的source属性。要使用相同的image,就必须再次将此image嵌入到那个组件中。
如果想显示一个嵌入image的多个实例,可以用[Embed]原标签代替。
例子:<?xml version="1.0" encoding="utf-8"?>
<mx:Application <!-- http://yecon.blog.hexun.com/29628260_d.html -->
    xmlns:mx="http://www.adobe.com/2006/mxml"
    viewSourceURL="src/EmbeddingAnImage/index.html"
    width="200" height="240">
    <mx:Image id="myLogo" source="@Embed('assets/logo.png')"/>

</mx:Application> -----------------------------------------------------------------可以在Flex应用程序中嵌入image,并且可以将它应用于组件的皮肤。可以定义一个CSS选择器,以设置所有组件的皮肤。在下面的例子中,为Button控件创建了一个CSS选择器。例子:<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    viewSourceURL="src/EmbeddingImagesCSS/index.html"
    layout="horizontal" width="270" height="100"
    horizontalAlign="center" verticalAlign="middle">

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

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

        }
    </mx:Style>
   
    <mx:Button/>
   
    <mx:Text text="Roll over and click the box!"/>

</mx:Application> -----------------------------------------------------------------嵌入SWF文件的方法与嵌入IMAGE的方法差不多,只是可以把已嵌入的SWF文件实例当做MovieClip类。(不可直接访问嵌入SWF文件的属性和方法,但是可以使用LocalConnection来允许他们之间的通信) 例子: <?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
     viewSourceURL="src/EmbeddingSwfFiles/index.html"
    layout="horizontal" width="290" height="290"
    horizontalAlign="center" verticalAlign="middle"
 >

    <mx:Script>
    <![CDATA[
            [Embed(source="assets/hourglass.swf")]

            [Bindable]
            public var Hourglass:Class;           
        ]]>
    </mx:Script>

    <mx:Image id="hourglass" source="{Hourglass}"/>
</mx:Application> -----------------------------------------------------------------可以嵌入存在于应用程序的SWF文件库里的特殊标签。Flash定义了三种类型的标签:Button、MovieClip、Graphic。可以嵌入Button和MovieClip标签到Flex应用程序,但是不不能嵌入Graphic标签。 例子:<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    viewSourceURL="src/EmbeddingSwfLibraryAssets/index.html"
    layout="horizontal" width="450" height="240"
    horizontalAlign="center" verticalAlign="bottom">
 
    <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"/>   

</mx:Application> ----------------------------------------------------------------- 可以通过使用[Embed]原标签的方法在Flex应用程序中嵌入MP3文件。 例子:<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"    layout="vertical" horizontalAlign="center" verticalAlign="center"    viewSourceURL="srcEmbeddingSoundFiles/index.html">

    <mx:Script>
        <![CDATA[
            import mx.core.SoundAsset;
            import flash.media.*;

            [Embed(source="assets/pie-yan-knee.mp3")]

            [Bindable]
            public var Song:Class;

            public var mySong:SoundAsset = new Song() as SoundAsset;
            public var channel:SoundChannel;
           
            public function playSound():void
            {

                // Make sure we don't get multiple songs playing at the same time
                stopSound();
               
                // Play the song on the channel
                channel = mySong.play();
            }
           
            public function stopSound():void
            {

                // Stop the channel, but only if it exists
                if ( channel != null ) channel.stop();
            }

        ]]>
    </mx:Script>
   
    <mx:HBox>
        <mx:Button label="play" click="playSound();"/>

        <mx:Button label="stop" click="stopSound();"/>       
    </mx:HBox>
   
    <mx:Text width="348" textAlign="center" color="#ffffff">

        <mx:htmlText>
            <![CDATA[<a href="http://derekaudette.ottawaarts.com/music.php">Pie-Yan-Knee Written and Performed by: Derek R. Audette (c) 2004 (Creative Commons Attribution License)</a>]]>
        </mx:htmlText>
    </mx:Text>
   
</mx:Application> -----------------------------------------------------------------可以在Flex应用程序中嵌入SVG文件 例子:<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="horizontal"
    viewSourceURL="srcEmbeddingSvgFiles/index.html"
    width="600" height="470"

>
    <mx:Script>
    <![CDATA[
            [Embed(source="assets/frog.svg")]

            [Bindable]
            public var SvgFrog:Class;           
        ]]>
    </mx:Script>

    <mx:Image id="smallFrog" source="{SvgFrog}" width="128" height="130"/>

    <mx:Image id="largeFrog" source="{SvgFrog}"/>
</mx:Application> -----------------------------------------------------------------可以在Flex应用程序中嵌入字体 例子:<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html -->
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="horizontal"
    horizontalAlign="center"
    verticalAlign="center"
    viewSourceURL="src/EmbeddingFonts/index.html">

    <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%"/>   

</mx:Application>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值