Como iterar sobre guias em tabbar Flex
-
05-07-2019 - |
Pergunta
Eu sou um novato flex. Preciso para desactivar alguns dos separadores de um cabo flexível tabbar especificados, pela configuração. Estou tendo problemas na iteração sobre as abas na barra de abas. Se eu usar o comando getChildAt (), não desativar o botão guia, mas o conteúdo desse botão guia, pelo que a sua não é bom.
Obrigado e cumprimentos, Mohit Ranka
Solução
Quando perguntando sobre o código, sempre postar um caso de teste mínimo. getChildAt()
vai funcionar, então há algo mais acontecendo com o seu código.
<mx:Script>
<![CDATA[
import mx.events.ItemClickEvent;
import mx.controls.tabBarClasses.Tab;
private function clickTab(event:ItemClickEvent):void {
var target:TabBar = event.currentTarget as TabBar;
var currTab:Tab;
var parity:int = event.index & 1;
/* disable all tabs at indices w/ same parity as clicked tab;
enable tabs of opposite parity.
*/
for (var i=0; i<target.numChildren; ++i) {
currTab = target.getChildAt(i) as Tab;
currTab.enabled = (i&1)^parity;
}
}
]]>
</mx:Script>
<mx:TabBar id="someTabs" itemClick="clickTab(event)">
<mx:dataProvider>
<mx:String>Foo</mx:String>
<mx:String>Bar</mx:String>
<mx:String>Baz</mx:String>
<mx:String>Bam</mx:String>
</mx:dataProvider>
</mx:TabBar>
Outras dicas
por que não usar um bindable à sua configuração?
algo como
enabled="{yourConfiguration.lastResult.enabled}"
Para aqueles que querem uma resposta de trabalho para Flex 4.5 (provavelmente Flex 4 também). Eu finalmente descobri uma solução. Ela se sente como um hack para mim, mas a Adobe não atende a chamada e está funcionando para mim. Aqui está um exemplo simplificado.
<!-- component that has the the TabBar in it... -->
<fx:Script>
<![CDATA[
//imports here
import mx.core.UIComponent;
//imports
private function setTabEnabled(index:int,enabled:Boolean):void{
var theTab:UIComponent = theTabBar.dataGroup.getElementAt(index) as UIComponent;
if(theTab){theTab.enabled = enabled;}
}
]]>
</fx:Script>
<s:TabBar id="theTabBar"
dataProvider="{viewStack}"/>
<mx:ViewStack id="viewStack">
<s:NavigatorContent label="0th Tab">
<!-- ...Content -->
</s:NavigatorContent>
<s:NavigatorContent label="1st Tab">
<!-- ...Content -->
</s:NavigatorContent>
<s:NavigatorContent label="2nd Tab">
<!-- ...Content -->
</s:NavigatorContent>
</mx:ViewStack>
<!-- rest of the component that has the the TabBar in it... -->
Em seguida, você apenas chamar setTabEnabled(theTabIndex,trueFalse)
em um manipulador de eventos relacionados a tudo o que decide por que o guia é, ou não é, habilitado.
I deve estender a TabBar para suportar isso, mas eu já passei bastante tempo tentando descobrir isso.
Happy Codificação = D