Flex4 布局 元素index

时间:2021-09-28 05:29:21

Flex4 布局 元素index

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               height="730">
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    
    <fx:Script>
        <![CDATA[
            protected function btn001_clickHandler(event:MouseEvent):void{
                trace(win001.getElementIndex(btn001));
                win001.setElementIndex(btn001,0);
            }
            protected function btn002_clickHandler(event:MouseEvent):void{
                var lbl:Label = new Label();
                lbl.text = 'created label';
                win001.addElement(lbl);
            }
            
            protected function btn003_clickHandler(event:MouseEvent):void{
                win001.removeElement(btn002);
                var getChildAt2:DisplayObject = win001.getChildAt(0);
                trace(getChildAt2);
            }
            
            protected function btn004_clickHandler(event:MouseEvent):void{
                win001.swapElements(lbl002,lbl003);
            }
            
            protected function btn005_clickHandler(event:MouseEvent):void{
                var lbl002Index:int = win001.getElementIndex(lbl002);
                var lbl003Index:int = win001.getElementIndex(lbl003);
                trace(lbl002Index);
                trace(lbl003Index);
                win001.swapElementsAt(lbl002Index,lbl003Index);
            }
            
        ]]>
    </fx:Script>
    
    <fx:Declarations>
        <s:RadioButtonGroup id="radiogroup1"/>
        <!-- 将非可视元素(例如服务、值对象)放在此处 -->
        <!-- 选中text之后,再点击别的地方,才会出现提示,仅有空格都不行,会有默认消息 -->
        <mx:StringValidator source="{txt001}" id="vld001" property="text" requiredFieldError="ABC...">
        </mx:StringValidator>
        <!-- 不输入不会出提示,输入一个会有提示,两个空格就可以 -->
        <mx:StringValidator source="{txt002}" id="vld002" property="text" required="false" minLength="2" tooShortError="DEF..." >
        </mx:StringValidator>
    </fx:Declarations>
    <s:Form x="316" y="21" width="240" height="187">
        <s:FormHeading label="In a Form"/>
        <s:FormItem label="标签" required="true">
            <s:TextInput id="txt001"/>
        </s:FormItem>
        <s:RadioButton label="按钮 1" groupName="radiogroup1"/>
        <s:RadioButton label="按钮 2" groupName="radiogroup1"/>
        <s:FormItem label="标签">
            <s:TextInput id="txt002"/>
        </s:FormItem>
    </s:Form>
    <s:Panel x="27" y="21" width="250" height="158" title="This is panel">
        <s:TileGroup x="10" y="10" width="228" height="105">
            <s:Label text="In a TileGroup"/>
            <s:Button label="按钮"/>
            <s:CheckBox label="复选框"/>
            <mx:ColorPicker/>
            <mx:DateField formatString="YYYY-MM-DD" yearNavigationEnabled="true"/>
        </s:TileGroup>
    </s:Panel>
    <s:TitleWindow id="win001" x="27" y="216" width="250" height="200" title="This is TitleWindow">
        <s:Label id="lbl001" x="23" y="20" backgroundColor="#EE1717" text="in the titleWindow"/>
        <s:Button id="btn001" x="96" y="12" label="get/setElementIndex" click="btn001_clickHandler(event)"/>
        <s:Label id="lbl002" x="23" y="40" backgroundColor="#16FE04" text="this is green"/>
        <s:Label id="lbl003" x="66" y="40" backgroundColor="#FFFF00" text="this is yellow"/>
        <s:Button id="btn002" x="19" y="60" label="addElement" click="btn002_clickHandler(event)"/>
        <s:Button id="btn003" x="114" y="60" label="removeElement" click="btn003_clickHandler(event)"/>
        <s:Button id="btn004" x="20" y="89" label="swapElements" click="btn004_clickHandler(event)"/>
        <s:Button id="btn005" x="20" y="118" label="swapElementsAt" click="btn005_clickHandler(event)"/>
        <s:Spacer x="161" y="42" width="43" height="10"/>
    </s:TitleWindow>
    <s:TileGroup x="316" y="216" width="240" height="200" paddingTop="5">
        <s:Label text="In a TileGroup"/>
        <s:Spacer width="10" height="10"/>
    </s:TileGroup>
    <s:SkinnableContainer x="578" y="21" width="152" height="158">
        <s:Label x="10" y="27" text="In a SkinnableContainer"/>
        <s:Line x="11" y="48" width="116" height="71" xTo="40">
            <s:stroke>
                <s:SolidColorStroke color="black" weight="2">
                    
                </s:SolidColorStroke>
            </s:stroke>
        </s:Line>
    </s:SkinnableContainer>
    <s:HGroup x="578" y="216" width="152" height="78" paddingTop="5">
        <s:Label text="inHGroup"/>
        <s:Button label="按钮"/>
        <s:Button label="按钮"/>
    </s:HGroup>
    <s:VGroup x="578" y="329" width="152" height="87" horizontalAlign="contentJustify" paddingLeft="5" paddingTop="5" verticalAlign="top">
        <s:Label text="inVGroup"/>
        <s:Button label="按钮"/>
        <s:Button label="按钮"/>
    </s:VGroup>
    <s:Panel x="23" y="438" width="250" height="200" title="mx:HDividedBox和mx:VDividedBox">
        <s:layout>
            <s:HorizontalLayout/>
        </s:layout>
        <mx:HDividedBox width="100%" height="100%">
            <s:BorderContainer height="100%" width="25%">
            </s:BorderContainer>
            <s:BorderContainer height="100%" width="75%">
                <mx:VDividedBox width="100%" height="100%">
                    <s:BorderContainer height="100%" width="100%">
                    </s:BorderContainer>
                    <s:BorderContainer height="100%" width="100%">
                    </s:BorderContainer>
                    <s:BorderContainer height="100%" width="100%">
                    </s:BorderContainer>
                </mx:VDividedBox>
            </s:BorderContainer>
        </mx:HDividedBox>
    </s:Panel>
    <s:Panel right="193" bottom="92" width="250" height="200" title="基于约束的布局">
        <s:Button left="20" right="158" top="21" bottom="125" label="按钮"  horizontalCenter="-69" verticalCenter="-52"/>
    </s:Panel>
</s:Application>