Question

flex tab排序对于可用性（显而易见）和可访问性（它定义了屏幕阅读器读取顺序）都很重要。但是，Flex 3.5似乎没有任何支持来影响更复杂的应用程序。

据我所知到目前为止：

标签排序由mx.managers.FocusManager计算，它负责整个应用程序的一个“标签循环”（即每个容器没有一个，但整个应用程序没有一个）。嵌入.swf文件和弹出窗口是个例外，每个文件和弹出窗口都有自己的FocusManager。
FocusManager中的逻辑标记为私有，并且该类在Application.initialize（）中实例化，因此更改行为并不容易（不能重写SDK的部分，这可能会造成许可证问题）
Tab键顺序查找每个组件tabIndex（int）属性。具有此属性集（> 0）的所有组件按其值排序，否则使用可视层次结构（使用容器内的容器嵌套和子顺序）。
没有tabIndex的所有组件都按照设置它的组件排序（在内部，“tabIndex not set”映射到“tabIndex = int.MAX_VALUE”
具有相同tabIndex的两个组件按可视层次结构排序。

这意味着您可以使用可视化层次结构的自动排序（主要是您想要的）或者您可以直接使用指定tabIndexes - 但如果您这样做，则完全拧紧自动排序。如果您使用自定义组件并希望更改其中的选项卡顺序，则这一点尤其糟糕：一旦执行此操作，您就会破坏使用组件的所有屏幕的Tab键顺序。此外，您不能仅在最高级别的mxml文件上设置选项卡顺序，因为您通常无法访问所使用组件的内部工作方式。

实施例

accVerticalStuff.mxml

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:Label text="One"/>
    <mx:TextInput tabIndex="1" id="One" />

    <mx:Label text="Two" />
    <mx:TextInput tabIndex="2" id="Two"/>

    <mx:Label text="Three" />
    <mx:TextInput tabIndex="3" id="Three"/>

</mx:VBox>

Application.mxml

预期结果：标签顺序首先是左侧的三个垂直项目，然后是右侧的三个垂直项目，即按容器分组。 TopLevelElement是Tab键顺序中的第一个。（如果没有指定tabIndex，它会以这种方式正常工作，但是我们无法将tabIndex更改为例如切换One和Three，无论出于何种原因我们可能会这样做）

实际结果：标签排序是水平的，即在两个输入表单之间跳转。 TopLevelElement（未指定tabIndex）是Tab键顺序中的最后一个。

更改容器的嵌套在模块化项目中不起作用，更改子项的顺序会影响它们的显示位置（而使用Canvas容器会丢失AutoLayout）。

有没有办法（可能很复杂，但最好不要重写SDK）来指定单个组件的标签排序，而与其他组件无关？

如果所有其他方法都失败了，升级到Flex4会帮助解决这个问题吗？

Answer 1

经过一番研究后，我发现了以下内容：

如果（即使是单个）DisplayObject有tabIndex > 0，则表示从现在开始按TAB只会在tabIndex > 0
如果只有一个tabIndex > 0实例，则会永远关注
如果current.tabIndex - next.tabIndex > 1无关紧要，tabIndex将增加到下一个现有值
如果多个实例具有相同的tabIndex值，它们将以原生顺序接收焦点（就像从未定义tabIndex一样）
-------------------------------------------------- -----------------------------

这样：
用于在某些DisplayObject之间设置TAB导航（无论它们位于显示列表中的哪个位置） - 只需为每个DisplayObject设置tabIndex > 0。
用于从TAB列表中删除实例 - 设置tabIndex = 0（但是如果应用程序中只剩下带有tabIndex == 0的DisplayObjects - TAB会自然地在它们之间切换焦点）。 tabEnabled = false应该是更好的选择
用于创建几组具有自然TAB顺序的DisplayObject，同时保持组之间的某些顺序 - 为每个组选择一个tabIndex（首先显示小值）并将您选择的tabIndex应用于组的每个成员。

我认为TAB列表中的太多实例是无用且令人讨厌的，因此管理它的最佳方法应该是使其等于top列表例如当前应用状态的10个最有用的UI元素。

和一些代码（基于你的例子）：
showclasses.NewFile.mxml：

<mx:VBox xmlns:mx="library://ns.adobe.com/flex/mx"
         xmlns:fx="http://ns.adobe.com/mxml/2009" data="1,2,3" creationComplete="addFocuses();">
    <fx:Script>
        <![CDATA[       
        private function addFocuses():void{
            var focs:Array = data.split(',');
            One.tabIndex = focs[0];
            Two.tabIndex = focs[1];
            Three.tabIndex = focs[2];           
        }       
        ]]>
    </fx:Script>
    <mx:Label text="One"/>
    <mx:TextInput id="One" />
    <mx:Label text="Two" />
    <mx:TextInput id="Two"/>
    <mx:Label text="Three" />
    <mx:TextInput id="Three"/>
</mx:VBox>

Main.mxml：

<mx: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:th="showclasses.*">
    <mx:HBox>
        <th:NewFile data="1,2,3" />
        <th:NewFile data="1,2,3" />
        <th:NewFile data="1,2,3" />
    </mx:HBox>
</mx:Application>

如果数据值是1,2,3; 1,2,3; 1,2,3 - 焦点从左向右水平移动（当然因为tabIndex在每一行内是恒定的）然后切换到下一行的左边元素。
如果他们是2;空，3; 0，null，1（对于tabIndex为null == 0） - 焦点将出现在右下角，然后出现在左上角，最后出现在中心。
希望这将是有用的

Answer 2

我认为www0z0k提供的一些信息不再准确（或者从来没有？）只需阅读tabIndex财产上的Flex文档：

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/InteractiveObject.html#tabIndex

指定SWF文件中对象的Tab键顺序。 tabIndex   默认情况下，属性为-1，表示没有为对象设置选项卡索引。

如果SWF文件中当前显示的任何对象包含tabIndex   属性，自动标签排序被禁用，标签排序是   根据SWF文件中对象的tabIndex属性计算。   自定义选项卡排序仅包括具有tabIndex的对象   属性。

tabIndex属性可以是非负整数。对象是   根据tabIndex属性按升序排序。一个   tabIndex值为1的对象在具有tabIndex的对象之前   值2.不要对多个对象使用相同的tabIndex值。

tabIndex属性定义的自定义选项卡顺序是平的。   这意味着没有注意层次关系   SWF文件中的对象。使用tabIndex的SWF文件中的所有对象   属性按Tab键顺序放置，Tab键顺序为   由tabIndex值的顺序决定。

编辑：根据我使用Flex 3.3.0的经验，www0z0k所做的断言＃1和＃2是错误的。对于＃1，未明确设置tabIndex的控件将始终落在所有按Tab键顺序给出正数的控件之前。对于＃2，它随后可以观察到，如果你只设置一个tabIndex，那么一个控件将跟随Tab键顺序中的所有其他自动控件。

如何更改Flex中的Tab键排序（Actionscript，SDK 3.5）

实施例

2 个答案: