小小菜鸟的web菜园子

专注FLEX,AIR,FLASH

统计

留言簿(8)

积分与排名

AMF

FLASH

FLEX

FMS

Friends

开源框架

设计之美

数据库相关

我的作品

阅读排行榜

评论排行榜

设置Image控件加载图片完毕后的效果.

Image控件的completeEffect属性.
示例:

代码:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/29/setting-a-complete-effect-on-an-image-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout
="vertical"
        verticalAlign
="middle"
        backgroundColor
="white">

    
<mx:Script>
        
<![CDATA[
            private function button_click(evt:MouseEvent):void {
                image.load("assets/Fx.png");
            }
        
]]>
    
</mx:Script>

    
<mx:ApplicationControlBar dock="true">
        
<mx:Button id="button"
                label
="Load Image"
                click
="button_click(event);" />
    
</mx:ApplicationControlBar>

    
<mx:Image id="image"
            completeEffect
="Fade"
            maintainAspectRatio
="true"
            width
="100%"
            height
="100%" />

</mx:Application>

也可以通过as和mxml结合的方法.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/29/setting-a-complete-effect-on-an-image-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout
="vertical"
        verticalAlign
="middle"
        backgroundColor
="white">

    
<mx:Script>
        
<![CDATA[
            import mx.effects.*;

            private function init():void {
                image.setStyle("completeEffect", Fade);
            }

            private function button_click(evt:MouseEvent):void {
                image.load("assets/Fx.png");
            }
        
]]>
    
</mx:Script>

    
<mx:ApplicationControlBar dock="true">
        
<mx:Button id="button"
                label
="Load Image"
                click
="button_click(event);" />
    
</mx:ApplicationControlBar>

    
<mx:Image id="image"
            maintainAspectRatio
="true"
            width
="100%"
            height
="100%"
            initialize
="init();" />

</mx:Application>

使用as实现
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/06/29/setting-a-complete-effect-on-an-image-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout
="vertical"
        verticalAlign
="middle"
        backgroundColor
="white"
        initialize
="init();">

    
<mx:Script>
        
<![CDATA[
            import mx.containers.ApplicationControlBar;
            import mx.controls.Button;
            import mx.controls.Image;
            import mx.effects.*;

            private var button:Button;
            private var image:Image;

            private function init():void {
                button = new Button();
                button.label = "Load Image";
                button.addEventListener(MouseEvent.CLICK, button_click);

                var appControlBar:ApplicationControlBar;
                appControlBar = new ApplicationControlBar();
                appControlBar.dock = true;
                appControlBar.addChild(button);
                Application.application.addChildAt(appControlBar, 0);

                image = new Image();
                image.maintainAspectRatio = true;
                image.percentWidth = 100;
                image.percentHeight = 100;
                image.setStyle("completeEffect", Fade);
                addChild(image);
            }

            private function button_click(evt:MouseEvent):void {
                image.load("assets/Fx.png");
            }
        
]]>
    
</mx:Script>

</mx:Application>
Tag标签: FLEX,IMAGE

posted on 2008-07-01 10:02 『小小菜鸟』 阅读(111) 评论(0)  编辑 收藏 所属分类: FLEX/AIR


标题  
姓名  
主页
Email (只有博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      


相关链接: