Flex 中TabBar 和ViewStack 结合使用,如果ViewStack中的NavigatorContent 为includeInLayout 为false,现在也希望TabBar能够隐藏掉相应的button。现有的TabBar不能满足条件,只能继承来做一些修改。
package { import mx.core.IVisualElement; import spark.components.TabBar; public class SuperTabBar extends TabBar { public function SuperTabBar() { super(); } override public function updateRenderer(renderer:IVisualElement,itemIndex:int,data:Object):void { super.updateRenderer(renderer,itemIndex,data); const content:IVisualElement = getItemContent(itemIndex) as IVisualElement; if(content && !content.includeInLayout) { renderer.visible = false; renderer.includeInLayout = false; if(itemIndex == 0) { itemSelected(1,true); } } } private function getItemContent(index:int):IVisualElement { if (!dataGroup || (index < 0) || (index >= dataGroup.numElements)) return null; if(!dataGroup.dataProvider || index >= dataGroup.dataProvider.length) return null; return dataGroup.dataProvider.getItemAt(index) as IVisualElement; } } }
?测试代码
<?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" xmlns:controls="com.lombardrisk.report.lbr.components.controls.*" minWidth="955" minHeight="600" xmlns:local="*"> <fx:Script> <![CDATA[ ]]> </fx:Script> <s:layout> <s:VerticalLayout/> </s:layout> <local:SuperTabBar id="tabBar" dataProvider="{viewStack}"/> <mx:ViewStack id="viewStack" width="100%" creationPolicy="all"> <s:NavigatorContent label="aaa"> <s:Button label="aaaa"/> </s:NavigatorContent> <s:NavigatorContent label="bbb"> <s:Button label="bbbb"/> </s:NavigatorContent> <s:NavigatorContent label="ccc" includeInLayout="false" visible="false" enabled="true"> <s:Button label="cccc"/> </s:NavigatorContent> </mx:ViewStack> </s:Application>
?会发现ccc的button不会出现在tabBar中。