flex学习笔记 组件togglebuttonbar

代码：

<mx:VBox width="98%" height="190" verticalGap="0">
                <mx:ToggleButtonBar dataProvider="viewstack2" id="tog2" selectedIndex="1"
                                    horizontalGap="0" paddingLeft="8"  buttonMode="true" useHandCursor="true"
                                    buttonHeight="41" buttonWidth="114" />
                <mx:HBox width="100%" horizontalGap="0" paddingLeft="5">
                    <mx:VRule height="100%" strokeWidth="1" strokeColor="#CCCCCC"/>
                    <mx:ViewStack width="461" id="viewstack2">
                        <mx:VBox id="btn1" icon="{ImageLocator.buttonUp01Class}" paddingLeft="10" width="100%" height="145" >
                            <s:Image source="assets/group.png"/>
                        </mx:VBox>
                        <mx:VBox id="btn2"  icon="{ImageLocator.buttonSelected02Class}"
                                 paddingLeft="10" width="100%" height="145">
                            <s:Image source="assets/grid.png"/>
                        </mx:VBox>
                        <mx:VBox id="btn3" icon="{ImageLocator.buttonUp03Class}"
                                 paddingLeft="10" width="100%" height="145">
                            <s:Image source="assets/value.png"/>
                        </mx:VBox>
                        <mx:VBox id="btn4" icon="{ImageLocator.buttonUp04Class}"
                                 paddingLeft="10" width="100%" height="145">
                            <s:Image source="assets/sumary.png"/>
                        </mx:VBox>
                    </mx:ViewStack>
                    <mx:VRule height="100%" strokeWidth="1" strokeColor="#CCCCCC"/>
                </mx:HBox>
                <mx:HBox paddingLeft="5" >
                    <mx:HRule width="463" strokeWidth="1" strokeColor="#CCCCCC"/>
                </mx:HBox>

            </mx:VBox>
        </mx:VBox>

效果：

 

 发现vbox可以加icon然后放到viewstack里面再赋给togglebuttonbar可以让togglebuttonbardeep按钮上有图标，，，