Accordion コンテナの作成

Accordion コンテナは、<mx:Accordion> タグを使用して定義します。Accordion コンテナでは、子パネル 1 つに対して 1 つのコンテナを定義します。たとえば、Accordion コンテナに子パネルが 4 つあり、それぞれがフォームの 4 つの部分に対応する場合は、次の例のように、Form コンテナを使用して各子パネルを定義します。

<?xml version="1.0"?>
<!-- containers\navigators\AccordionSimple.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Accordion id="accordion1" height="450">

        <mx:Form id="shippingAddress" label="1. Shipping Address">

            <mx:FormItem id="sfirstNameItem" label="First Name">
                <mx:TextInput id="sfirstName"/>
            </mx:FormItem>

            <!-- Additional contents goes here. -->

        </mx:Form>

        <mx:Form id="billingAddress" label="2. Billing Address">
            <!-- Form contents goes here. -->
        </mx:Form>

        <mx:Form id="creditCardInfo" label="3. Credit Card Information">
            <!-- Form contents goes here. -->
        </mx:Form>

        <mx:Form id="submitOrder"   label="4. Submit Order">
            <!-- Form contents goes here. -->
        </mx:Form>

    </mx:Accordion>
</mx:Application>

この例では、Form コンテナを使用して各子パネルを定義します。子パネルの定義には、他のコンテナも使用できます。

メモ

 

子パネルの定義には任意のコンテナを使用できます。ただし、子コンポーネントを持たない TabNavigator などのコンテナや、Accordion コンテナなど、子パネルとして適していないコンテナもあります。


Flex 2.01