[Flex] ButtonBar系列——如何给ButtonBar添加一个ViewStack

<?xml version="1.0" encoding="utf-8"?>
<!--如何给ButtonBar添加一个ViewStack-->
<!--<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white">
    <mx:ButtonBar id="buttonBar" dataProvider="{viewStack}" buttonHeight="32"/>
    <mx:ViewStack id="viewStack">
        <mx:VBox label="Button" icon="@Embed('assets/Button.png')" backgroundColor="white" width="480" height="60">
            <mx:Label text="Button..."/>
        </mx:VBox>
        <mx:VBox label="ButtonBar" icon="@Embed('assets/ButtonBar.png')" backgroundColor="white" width="480" height="60">
            <mx:Label text="ButtonBar..."/>
        </mx:VBox>
        <mx:VBox label="CheckBox" icon="@Embed('assets/CheckBox.png')" backgroundColor="white" width="480" height="60">
            <mx:Label text="CheckBox..."/>
        </mx:VBox>
        <mx:VBox label="ColorPicker" icon="@Embed('assets/ColorPicker.png')" backgroundColor="white" width="480" height="60">
            <mx:Label text="ColorPicker..."/>
        </mx:VBox>
    </mx:ViewStack>
</mx:Application>-->
<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">
    <fx:Declarations>

    </fx:Declarations>
    <s:VGroup>
        <s:ButtonBar dataProvider="{myViewStack}" requireSelection="true" />
        <mx:ViewStack id="myViewStack" borderStyle="solid">
            <s:NavigatorContent id="search" label="Search">
                <s:Label text="Search Screen"/>
            </s:NavigatorContent> 

            <s:NavigatorContent id="custInfo" label="Customer Info">
                <s:Label text="Customer Info"/>
            </s:NavigatorContent> 

            <s:NavigatorContent id="accountInfo" label="Account Info">
                <s:Label text="Account Info"/>
            </s:NavigatorContent>
        </mx:ViewStack>
        <s:ButtonBar id="buttonBar" dataProvider="{viewStack}" requireSelection="true"  />
        <mx:ViewStack id="viewStack">
            <mx:VBox label="Button" icon="@Embed('assets/Button.png')" backgroundColor="white" width="480" height="60">
                <mx:Label text="Button..."/>
            </mx:VBox>
            <mx:VBox label="ButtonBar" icon="@Embed('assets/ButtonBar.png')" backgroundColor="white" width="480" height="60">
                <mx:Label text="ButtonBar..."/>
            </mx:VBox>
            <mx:VBox label="CheckBox" icon="@Embed('assets/CheckBox.png')" backgroundColor="white" width="480" height="60">
                <mx:Label text="CheckBox..."/>
            </mx:VBox>
            <mx:VBox label="ColorPicker" icon="@Embed('assets/ColorPicker.png')" backgroundColor="white" width="480" height="60">
                <mx:Label text="ColorPicker..."/>
            </mx:VBox>
        </mx:ViewStack>
    </s:VGroup>
</s:Application>