apache-flex 基于状态的Flex垂直布局水平布局元素顺序

8iwquhpp  于 2022-11-01  发布在  Apache
关注(0)|答案(1)|浏览(132)

在我mxml部分中,

<s:layout.landscape>
    <s:HorizontalLayout />
</s:layout.landscape>

<s:layout.portrait>
    <s:VerticalLayout />
</s:layout.portrait>

在这些标签之后,我有几个组件,例如

<s:Button label="button 1"/>
<s:Button label="button 2"/>

我想做的是改变这些组件的顺序,一旦进入纵向或横向状态。例如,在纵向我有垂直布局按钮1后面跟着按钮2,在横向我有水平布局按钮2后面跟着按钮1。

kcwpcxri

kcwpcxri1#

您可以使用this.swapElements(button1,button2);
范例:-

<?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"
               minWidth="955" minHeight="600" currentState="landscape">
    <s:states>
        <s:State name="landscape"/>
        <s:State name="portrait"/>
    </s:states>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>

    <fx:Script>
        <![CDATA[
            import spark.events.IndexChangeEvent;

            protected function dropdownlist1_changeHandler(event:IndexChangeEvent):void
            {
                // TODO Auto-generated method stub
                if(event.target.selectedIndex == 0)
                {
                    this.currentState = event.target.dataProvider[0];
                    this.swapElements(button1,button2);
                }
                else
                {
                    this.currentState = event.target.dataProvider[1];
                    this.swapElements(button2,button1);
                }
            }
        ]]>
    </fx:Script>

    <s:layout.landscape>
        <s:HorizontalLayout />
    </s:layout.landscape>

    <s:layout.portrait>
        <s:VerticalLayout />
    </s:layout.portrait>

    <s:DropDownList selectedIndex="0" change="dropdownlist1_changeHandler(event)">  
        <s:ArrayCollection>
            <fx:String>landscape</fx:String>
            <fx:String>portrait</fx:String>
        </s:ArrayCollection>
    </s:DropDownList>

    <s:Button id="button1" label="button 1"/>
    <s:Button id="button2" label="button 2"/>

</s:Application>

希望这能帮上忙...

相关问题