zoukankan      html  css  js  c++  java
  • Flex 自定义 Zlert 组件!

    说明:

    原生的 Alert.show 参数,要显示的按钮你只能 Alert.OK | Alert.Cancel 这样;

    自定义 Zlert 参数跟原生的 差不多,按钮写法是这样写的: {"btnId":"确定", "btnId2":"其他按钮名称"}

    ZlertWindow.mxml: com/components

    <?xml version="1.0" encoding="utf-8"?>
    <mx:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
             xmlns:s="library://ns.adobe.com/flex/spark" 
             xmlns:mx="library://ns.adobe.com/flex/mx" 
             creationComplete="init(event)"
             width="300" creationPolicy="all">
        <fx:Declarations>
            <!-- 将非可视元素(例如服务、值对象)放在此处 -->
            <s:Fade id="fadeIn" alphaFrom="0" alphaTo="1" duration="1000"  />
            <s:Fade id="fadeOut" alphaFrom="1" alphaTo="0" duration="2500"  />
        </fx:Declarations>
        
        <fx:Script>
            <![CDATA[
                import com.events.ZlertedEvent;
                
                import mx.events.FlexEvent;
                
                import spark.components.Button;
                
                public var succFunc:Function;
                public var btnsJson:Object = null;
                
                public var message:String ;
                
                [Bindable]
                public var zicon:Object;
                
                private function init(event:FlexEvent):void {
                    initForm();
                }
                
                public function initForm():void {
                    var that:Sprite = this;
                    for (var key:String in btnsJson) {
                        var btn:Button = new Button();
                        btn.id = key;
                        btn.label = btnsJson[key];
                        btn.addEventListener(MouseEvent.CLICK, function(event:MouseEvent):void {
                            var _btn:Button = event.currentTarget as Button;
                            if (succFunc) {
                                succFunc(_btn.id);
                            }
                            
                            var altEvt:ZlertedEvent = new ZlertedEvent(ZlertedEvent.CLOSE);
                            that.dispatchEvent(altEvt);
                        });
                        
                        AltForm.addElement(btn);
                    }
                    
                    var cancelBtn:Button = new Button();
                    cancelBtn.id="cclBtn";
                    cancelBtn.label = "取消";
                    cancelBtn.addEventListener(MouseEvent.CLICK, function(event:MouseEvent){
                        var altEvt:ZlertedEvent = new ZlertedEvent(ZlertedEvent.CLOSE);
                        that.dispatchEvent(altEvt);
                    });
                    
                    AltForm.addElement(cancelBtn);
                }
                
            ]]>
        </fx:Script>
        
        <s:VGroup width="100%" height="100%">
            <s:HGroup width="100%" height="100%" horizontalCenter="0" horizontalAlign="left">
                <mx:Grid horizontalCenter="0" width="100%">
                    <mx:GridRow>
                        <mx:GridItem width="40" verticalAlign="middle" horizontalAlign="center">
                            <s:Group><s:BitmapImage source="{zicon}" id="iconOn" /></s:Group>
                        </mx:GridItem>
                        <mx:GridItem paddingTop="8">
                            <s:Label text="{message}" verticalAlign="justify" fontSize="14" />
                        </mx:GridItem>
                    </mx:GridRow>
                </mx:Grid>
            </s:HGroup>
            
            <s:HGroup id="AltForm" width="100%" height="30" horizontalCenter="0" horizontalAlign="center">
                
            </s:HGroup>
        </s:VGroup>
    
    </mx:TitleWindow>

    ZlertedEvent.as: com/events

    package com.events
    {
        import flash.events.Event;
    
        public class ZlertedEvent extends Event
        {
            public static const CLOSE:String = "close";
            public function ZlertedEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
            {
                super(type, bubbles, cancelable);
            }
        }
    }

    主组件类Zlert.as

    package com.command
    {
        import flash.display.Sprite;
        import flash.events.EventPhase;
        
        import com.components.ZlertWindow;
        import com.events.ZlertedEvent;
        
        import mx.controls.Alert;
        import mx.core.Application;
        import mx.core.FlexGlobals;
        import mx.events.FlexEvent;
        import mx.managers.ISystemManager;
        import mx.managers.PopUpManager;
    
        public class Zlert
        {
            [Embed('assets/skins/alert/tip_question.png')]
            private static var ICON_QUESTION:Class;
            private static var parent:Sprite
            
            
            public function Zlert()
            {
                super();
            }
            
            public static function show(msg:String, title:String = "确定", sprite:Sprite = null, btnsJson:Object = null, cancelHandler:Function = null) : void {
                trace("asdfa");
                
                var modal:Boolean = true;
                
                parent = sprite;
                if (!parent)
                {
                    var sm:ISystemManager = ISystemManager(FlexGlobals.topLevelApplication.systemManager);
                    // no types so no dependencies
                    var mp:Object = sm.getImplementation("mx.managers::IMarshalSystemManager");
                    if (mp && mp.useSWFBridge())
                        parent = Sprite(sm.getSandboxRoot());
                    else
                        parent = Sprite(FlexGlobals.topLevelApplication);
                }
                
                var alt:ZlertWindow = new ZlertWindow();
                alt.title = title;
                alt.message = msg;
                alt.btnsJson = btnsJson;
                alt.zicon = ICON_QUESTION;
                alt.succFunc = cancelHandler;
                
                alt.addEventListener(ZlertedEvent.CLOSE, function():void{
                    PopUpManager.removePopUp(alt);
                });
                
                PopUpManager.addPopUp(alt, parent, modal);
                PopUpManager.centerPopUp(alt);
            }
            
        }
    }

    使用方法:

    Zlert.show("提示消息?","标题", this, {"btnId1":"确定", "btnId2" : "按钮2"}, function(key:String):void {
            if (key != "btnId1") {
                //...
            }
    });
  • 相关阅读:
    【文献阅读】Densely Connected Convolutional Networks-best paper-CVPR-2017
    【文献阅读】Perceptual Generative Adversarial Networks for Small Object Detection –CVPR-2017
    Vue知识整理17:免终端开发vue应用
    Vue知识整理16:单文件组件
    Vue知识整理15:组件注册
    Vue知识整理14:组件基础
    Vue知识整理13:表单输入绑定(v-model)
    Vue知识整理12:事件绑定
    Vue知识整理11:列表渲染(v-for来实现)
    Vue知识整理10:条件渲染(v-if v-show)
  • 原文地址:https://www.cnblogs.com/editor/p/3849172.html
Copyright © 2011-2022 走看看