MXML logic choose

最新推荐文章于 2019-06-24 18:42:42 发布

原创最新推荐文章于 2019-06-24 18:42:42 发布 · 428 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#string #null #application #encoding #layout

介绍了一个自定义的Flash逻辑显示控件，该控件能够根据布尔表达式的值动态地显示或隐藏内容。提供了两种不显示内容的方式：隐藏或不创建，并展示了如何在Flex应用中使用这些逻辑控件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Logic.as

package com.jackoo {
    import flash.display.DisplayObject;
    import mx.containers.Canvas;
   
   
    /**
     *    逻辑判断标签，当test的表达式返回为true时，显示标签内的内容
     * */
    
    public class Logic extends Canvas {
        public static const  HIDE : String="hide"; //隐藏标签内容
        public static const  UNCREATE : String="uncreate";//不创建标签内容
       
       
        private  var _test:Boolean=false; //条件
        public var type:String=UNCREATE; //不显示时的类型，是隐藏还是不创建，默认是不创建
        public var IfContent:DisplayObject;
        public var ElseContent:DisplayObject;
       
        public function Logic(){
            super();
           
        }
       
        protected override function commitProperties():void{
            super.commitProperties();
            removeAllChildren();
            if (type==UNCREATE){
                if (test){
                    if (IfContent != null && !contains(IfContent)){
                        addChild(IfContent);
                    }
                }else{
                    if (ElseContent != null && !contains(ElseContent)){
                        addChild(ElseContent);
                    }
                }
            }else if(type==HIDE){
                if (IfContent != null && !contains(IfContent)){
                    if(test){
                        IfContent.visible=true;
                        addChild(IfContent);
                        return;
                    }else{
                        IfContent.visible=false;
                        addChild(IfContent);
                    }
                }
                if (ElseContent != null && !contains(ElseContent)){
                    if (test){
                        ElseContent.visible=false;
                    }else{
                        ElseContent.visible=true;
                    }
                    addChild(ElseContent);
                }
            }
        }
       
        public function set test(value:Boolean):void{
            this._test=value;
            invalidateProperties();
        }
       
        public function get test():Boolean{
            return this._test;
        }
    }
}

logic.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:logic="com.jackoo.*" fontSize="12" >
   
    <mx:Script>
        <![CDATA[
            [Bindable]
            private var value:Boolean=false;
        ]]>
    </mx:Script>
    <mx:HRule/>
   
    <mx:Label text="隐藏对象，看不到对象时也是占位的"/>
   
    <logic:Logic test="{value}" type="hide" >
        <logic:IfContent>
            <mx:Button label="if == true"/>
        </logic:IfContent>
    </logic:Logic>
   
    <mx:HRule />
   
    <mx:Label text="不创建对象，这样看不到时是不占位的，当然，你可以设置logic的width和height让它也占位"/>
   
    <logic:Logic test="{value}" type="uncreate" >
        <logic:IfContent>
            <mx:Button label="if == true"/>
        </logic:IfContent>
    </logic:Logic>
   
    <mx:HRule/>
   
    <mx:Label text="隐藏对象，带有else"/>
   
    <logic:Logic test="{value}" type="hide">
        <logic:IfContent>
            <mx:Button label="if == true"/>
        </logic:IfContent>
        <logic:ElseContent>
            <mx:Canvas borderStyle="solid">
                <mx:Button label="多个组件"/>
                <mx:Label x="90" text="你没权限看"/>
            </mx:Canvas>
        </logic:ElseContent>
    </logic:Logic>
   
    <mx:HRule/>
   
    <mx:Label text="不创建对象，带有else"/>
   
    <logic:Logic test="{value}" type="uncreate" >
        <logic:IfContent>
            <mx:Button label="if == true"/>
        </logic:IfContent>
        <logic:ElseContent>
            <mx:Label text="你没权限看"/>
        </logic:ElseContent>
    </logic:Logic>
   
    <mx:HRule/>
    <mx:Button click="{value=value?false:true}" label="显示/不显示"/>
</mx:Application>