Flash Tab Order changes

Question

I'm trying to add some accessibility for screen readers into a Flash application, and am running up against a sticky point. The order for tabbing through elements is set by those elements' tabIndex property. The difficulty is, the tab list constructed from these seems to be permanent, but the content of the application is dynamic (built from xml, contains pop ups and dialog boxes). Is there a way to refresh/rebuild the tab list? I am willing to go to extreme lengths, and try some crazy hacks to make this work, so any suggestions are good.

Grantley

Answer 1

you set edit the elements tabIndex values at any time you want

like setting them to be the same to childIndex

for (var i:int=0;i<container.numChildren;++i) {
    container.getChildAt(i).tabIndex = i; //=i or anything you want
}

The following works for me

iButton1.tabIndex = 1;
iButton2.tabIndex = 2;
iButton3.tabIndex = 3;

iButton1.tabEnabled = true;
iButton2.tabEnabled = true;
iButton3.tabEnabled = true;

function fnClick (pME:MouseEvent):void {
    iButton1.tabIndex = 3;
    iButton2.tabIndex = 2;
    iButton3.tabIndex = 1;
}

iButton3.addEventListener(MouseEvent.CLICK, fnClick);

you can download a sample fla here http://matrixoft.infunity.com/agents/calvin/flash/tab.rar

click the third button and it will change the tab order. You may need to "Control->Disable keyboard shortcuts" when you ctrl-enter to test the fla

Megrims

Your sample made me realize that I wasn't actually changing the TextArea tabIndex, but the TextField inside the text area. I feel dumb, but you did good, thanks ^_^ – Grantley

we all face similar dumb bugs when coding flash :) it's rare to have no bugs in one go – Megrims

Answer 2

I am compiling with Flash Player 11.4 Toggling the TextField's tabEnabled property is fine, but I am finding that it does not work for SimpleButtons (they don't become enabled again when setting tabEnabled back to true). For that I am using this:

private function setPanelOneTabIndices()
{
    aButton1.tabIndex = 1;
    aButton2.tabIndex = 2;
    aButton3.tabIndex = 3;

    bButton1.tabIndex = 0;
    bButton2.tabIndex = 0;
    bButton3.tabIndex = 0;
}

private function setPanelTwoTabIndices()
{
    aButton1.tabIndex = 0;
    aButton2.tabIndex = 0;
    aButton3.tabIndex = 0;

    bButton1.tabIndex = 1;
    bButton2.tabIndex = 2;
    bButton3.tabIndex = 3;
}

Cosmography