5

フレックス タブの順序は、使いやすさ (明らか) とアクセシビリティ (スクリーン リーダーの読み取り順序を定義する) の両方にとって重要です。ただし、Flex 3.5 には、より複雑なアプリケーションに影響を与えるサポートがないようです。

私がこれまでに知っていることから:

  • タブの順序は mx.managers.FocusManager によって計算され、アプリケーション全体で 1 つの「タブ サイクル」を処理します (つまり、各コンテナーではなく、アプリ全体で 1 つです)。例外は、埋め込まれた .swf ファイルとポップアップで、それぞれに独自の FocusManager があります。

  • FocusManager 内のロジックは非公開としてマークされ、クラスは Application.initialize() でインスタンス化されるため、動作を変更するのは簡単ではありません (SDK の一部を書き直す以外に、ライセンスの問題が発生する可能性があります)。

  • タブの順序は、各コンポーネントの tabIndex (int) プロパティを探します。このプロパティ セット (>0) を持つすべてのコンポーネントは、その値によって並べ替えられます。それ以外の場合は、ビジュアル階層が使用されます (コンテナーのネストとコンテナー内の子の順序を使用します)。

  • tabIndex のないすべてのコンポーネントは、それが設定されているコンポーネントの後になるようにソートされます (内部的に、「tabIndex が設定されていません」は「tabIndex = int.MAX_VALUE にマップされます)」

  • 同じ tabIndex を持つ 2 つのコンポーネントは、ビジュアル階層によって並べられます。

これは、視覚的な階層による自動順序付けを使用できることを意味します (主に必要なもの)、または直接 tabIndexes を指定して使用できますが、これを行うと、自動順序付けが完全に台無しになります。これは、カスタム コンポーネントを使用していて、それらの内部でタブの順序を変更したい場合に特に問題です。これを行うと、コンポーネントを使用しているすべての画面のタブの順序が台無しになります。また、使用するコンポーネントの内部動作にアクセスできないことが多いため、最高レベルの 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>

アプリケーション.mxml

期待される結果:タブ オーダーは、最初に左側の 3 つの垂直項目、次に右側の 3 つの垂直項目、つまりコンテナーごとにグループ化されます。TopLevelElement は、タブ オーダーの最初です。(tabIndex が指定されていない場合は、まさにこのように機能しますが、実際に tabIndex を変更して、たとえば One と Three を切り替えたいなどの理由で変更することはできません)

実際の結果:タブの順序は水平です。つまり、2 つの入力フォーム間をジャンプします。TopLevelElement (tabIndex が指定されていない) は、タブ オーダーの最後です。

モジュール化されたプロジェクトではコンテナの入れ子を変更しても機能せず、子の順序を変更すると表示位置に影響します (一方、Canvas コンテナを使用すると AutoLayout が失われます)。

他のコンポーネントとは無関係に、単一のコンポーネントのタブ順序を指定する方法はありますか (おそらく複雑ですが、できれば SDK を書き直す必要はありません)。

他のすべてが失敗した場合、Flex4 へのアップグレードはこの問題の解決に役立ちますか?

4

2 に答える 2

7

少し調べたところ、次のことがわかりました。

  • もし (1 つでも)DisplayObject持ってtabIndex > 0いる場合、これから押すTABと、インスタンス間でのみフォーカスが切り替えられることを意味します。tabIndex > 0
  • インスタンスが1つしかない場合は、tabIndex > 0永遠にフォーカスされます
  • current.tabIndex - next.tabIndex > 1問題がない場合、tabIndex は次の既存の値に増加します
  • 複数のインスタンスが等しい tabIndex 値を持つ場合、それらはネイティブな順序でフォーカスを受け取ります (あたかも tabIndex が定義されていないかのように)
    --------------------------- -------------------------------------------------- --

    そう:

  • 一部の DisplayObject 間の TAB ナビゲーションを設定するため (表示リストのどこにあるかに関係なく) -tabIndex > 0それらのすべてに設定するだけです。

  • TAB リストからインスタンスを削除するには - 設定しますtabIndex = 0(ただし、アプリに残っている DisplayObject しかない場合、tabIndex == 0TAB はそれらの間で自然にフォーカスを切り替えます)。tabEnabled = falseより良い選択であるべきです
  • グループ間の特定の順序を維持しながら、それぞれの内部に自然な TAB 順序を持つ DisplayObject の複数のグループを作成するには、グループごとに 1 つの tabIndex を選択し (小さな値が最初に表示されます)、選択した tabIndex をグループのすべてのメンバーに適用します。

    TAB リストのインスタンスが多すぎると役に立たず迷惑になると思うので、それを管理する最善の方法は、現在のアプリの状態で最も有用な 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>

メイン.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の場合; null,3; 0,null,1 (null == 0 for tabIndex) - フォーカスは右下隅に表示され、次に左上隅に表示され、最後に中央に表示されます。
これが役に立つことを願っています

于 2010-12-14T12:13:39.450 に答える
1

www0z0k が提供する情報の一部はもはや正確ではないと思います (または、正確ではなかったのでしょうか?)tabIndexプロパティの Flex Docs を読んでください:

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

SWF ファイル内のオブジェクトのタブ順序を指定します。tabIndex プロパティはデフォルトで -1 です。これは、オブジェクトにタブ インデックスが設定されていないことを意味します。

SWF ファイルに現在表示されているオブジェクトに tabIndex プロパティが含まれている場合、自動タブ順序は無効になり、タブ順序は SWF ファイル内のオブジェクトの tabIndex プロパティから計算されます。カスタム タブ オーダーには、tabIndex プロパティを持つオブジェクトのみが含まれます。

tabIndex プロパティは、負でない整数にすることができます。オブジェクトは、tabIndex プロパティに従って昇順で並べられます。tabIndex 値が 1 のオブジェクトは、tabIndex 値が 2 のオブジェクトよりも優先されます。複数のオブジェクトに同じ tabIndex 値を使用しないでください。

tabIndex プロパティが定義するカスタム タブの順序はフラットです。これは、SWF ファイル内のオブジェクトの階層関係に注意が払われないことを意味します。tabIndex プロパティを持つ SWF ファイル内のすべてのオブジェクトはタブ オーダーに配置され、タブ オーダーは tabIndex 値の順序によって決定されます。

編集: Flex 3.3.0 での私の経験では、www0z0k によって作成されたアサーション #1 と #2 は間違っています。#1 については、tabIndex を明示的に設定していないコントロールは、タブ オーダーで正の数を指定したすべてのコントロールより常に前になります。#2 については、tabIndex を 1 つだけ設定すると、その 1 つのコントロールがタブ オーダーの他のすべての自動コントロールに従うことがわかります。

于 2011-08-17T16:06:13.230 に答える