Skip to content
July 27, 2011 / edeustace

mx:TabBar selectedIndex throws a RangeError runtime exception

Note: This is not an issue with the Spark TabBar.
I’ve raised a defect for this here:
https://bugs.adobe.com/jira/browse/SDK-30915

The following code throws an RTE in Flex SDK 4.5.1

<?xml version="1.0" encoding="utf-8"?>
<s:Application 
    creationComplete="onCreationComplete(event)"
    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:local="*">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable]
            private var myDataProvider:ArrayCollection;

            protected function onCreationComplete(event:FlexEvent):void
            {
                myDataProvider = new ArrayCollection([ 'Alabama', 'Arkansas', 'Antrim' ]);
            }
        ]]>
    </fx:Script>
	<mx:TabBar
        dataProvider="{myDataProvider}"
        selectedIndex="0"/>
</s:Application>

Here’s a workaround:

package
{
    import mx.controls.TabBar;

    public class SelectedIndexTabBar extends TabBar
    {
        private var pendingSelectedIndex:int = -1;

        private var highlightPending:Boolean;

        override public function set selectedIndex(value:int):void
        {
            //prevent the default selected index setter
            //as it throws an RTE if there are not children set.
            if (numChildren == 0)
            {
                pendingSelectedIndex = value;
                return;
            }
            super.selectedIndex = value;
        }

        override public function set dataProvider(value:Object):void
        {
            super.dataProvider = value;
            if (value != null &amp;&amp; pendingSelectedIndex != -1)
            {
                highlightPending = true;
            }
        }

        override protected function commitProperties():void
        {
            super.commitProperties();

            if (highlightPending)
            {
                highlightPending = false;
                hiliteSelectedNavItem(pendingSelectedIndex);
                super.selectedIndex = pendingSelectedIndex;
            }
        }
    }
}

Use this class instead of the TabBar and your good to go.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: