时间戳

首页 > 解决方案 > Apache Royale Jewel TabBar / SectionContent onShow 或 valueCommit 事件，如 sdk 0.9.8？

events - Apache Royale Jewel TabBar / SectionContent onShow 或 valueCommit 事件，如 sdk 0.9.8？

问题描述

我有类似的东西：

<j:states>
    <js:State name="login"/>
    <js:State name="loggued"/>
</j:states>
...

<j:Group includeIn="loggued" width="100%" height="100%">

   <j:TabBar localId="tabbar" width="100%"  change="ev_tab_change(event)">
        <j:beads>
            <js:ConstantBinding sourcePropertyName="tabBarDataSample" destinationPropertyName="dataProvider"/>
            <j:AssignTabContent selectedContentProperty="content">
                <j:content>
                    <j:TabBarContent width="100%" y="80" >
                        <royale:TB_One/>
                        <royale:TB_Two/>
                    </j:TabBarContent>
                </j:content>
            </j:AssignTabContent>

        </j:beads>
    </j:TabBar>

</j:Group>

<royale:TB_One/>并且<royale:TB_Two/>是<j:SectionContent>

我需要在显示 TB_One 或 TB_Two 或标签栏 selectedIndex 以编程方式更改时触发事件。我change在 TabBar 上尝试过事件，但是使用 selectedIndex 更改时不会触发此事件

是否有 onShow 事件或 valueCommit ？

（现在tabbar.dispatchEvent(new Event("change"));在以编程方式更改 selectedIndex 时做这个技巧）

使用的sdk是0.9.8

问候

标签： eventstabbarapache-royale

解决方案

您可以执行以下操作：

<!-- The TabBar -->
<j:TabBar initComplete="tabbarInitialized(event)"/>

...

<!-- Buttons to change the content programatically -->
<j:Button click="selectContentByIndex(0)" text="0"/>
<j:Button click="selectContentByIndex(1)" text="1"/>

...

<!-- as3 code in script -->
<fx:Script>
    <![CDATA[
        import org.apache.royale.events.Event;

        // when tabbar is initialized make tabbar listen for internal event "selectionChanged"
        // this is the event to use for programmatic changes
        public function tabbarInitialized(event:Event):void
        {
            event.target.addEventListener("selectionChanged", contentChanged);
        }

        // The button change the selection programmatically
        public function selectContentByIndex(index:int):void
        {
            tabbar.selectedIndex = index;
        }
        
        // Here run the code you want. I simply trace the new tabbat selected index and the item
        // but you can calculate the content and operate over tha visual component
        public function contentChanged(event:Event):void
        {
            trace("index:", tabbar.selectedIndex, "content:", tabbar.selectedItem);
        }
    ]]>
</fx:Script>

推荐阅读