ウィジェットのフォーカスの設定
マッシュアップを表示しているときに、マウスまたはキーボードを使用してウィジェットを操作できます。Tab キーを使用してレイアウト内を移動すると、現在フォーカスされているアイテムが青色の境界でハイライトされます。ThingWorx 9.4 以降では、青色のフォーカス境界はキーボードを使用してウィジェットを操作しているときにだけ適用されます。以前のバージョンの ThingWorx では、マウスまたはキーボードを使用しているときに境界が適用されます。次のイメージは、フォーカスされた状態のテキスト領域ウィジェットを示しています。
ThingWorx のすべてのウィジェットがフォーカス状態をサポートしています。ただし、一部のウィジェットには固有のフォーカス動作があります。たとえば、ドロップダウンウィジェットでは、ドロップダウンリストが開いたときにフィルタにフォーカスが設定されます。ダイナミックパネルウィジェットでは、デフォルトのフォーカスがサイズハンドルに設定されています。
以下の各セクションでは、マッシュアップのアクセシビリティ機能のさまざまな側面について説明します。
自動フォーカス
ウィジェットプロパティ FocusOnLoad は、チェックボックス、テキストフィールド、テキスト領域などの一部のウィジェットで使用できます。このプロパティを使用して、ランタイムでマッシュアップを表示したときに特定のウィジェットに初期フォーカスを設定できます。ユーザー操作を必要とするすべてのマッシュアップに自動フォーカスを設定する必要があります。たとえば、フォーム内の 1 つ目のテキストフィールドに自動フォーカスを設定することで、実行すべき操作をユーザーが速やかに識別できるようになります。自動フォーカスの詳細については、自動フォーカスの設定を参照してください。
キーボードナビゲーション
次のキーを使用した一般的なキーボードショートカットを使用して、アイテム間を移動できます。
キー
説明
Tab
Shift + Tab
マッシュアップ内の次のウィジェットまたは前のウィジェットにフォーカスボックスを移動します。
Enter
スペース
サブメニューがある親アイテムを展開するか折りたたみます。
セクションを開いたり閉じたりします。
上/下矢印
ウィジェット内の次のエレメントまたは前のエレメントにフォーカスします。
右/左矢印
ウィジェット内の次のエレメントまたは前のエレメントにフォーカスします。
Home
並列エレメントのグループ内の最初のアイテムにフォーカスします。
End
並列エレメントのグループ内の最後のアイテムにフォーカスします。
マッシュアップ内のウィジェットのタブシーケンスの設定
タブシーケンスは、TabSequence プロパティを使用してマッシュアップ内の各ウィジェットに設定できる番号です。この番号の値によって、Tab キーを使用してマッシュアップ内を移動するときのフォーカスの順序が決まります。デフォルトでは、この順序は DOM 内のウィジェットの位置に基づいて設定されます。タブシーケンスの詳細については、タブシーケンスの設定を参照してください。
レガシーフォーカスモードの有効化
ThingWorx 9.4 以降では、キーボードを使用してマッシュアップ内を移動しているときにのみ、ウィジェットの周囲にフォーカスボックスが表示されます。以前のバージョンでは、マウスまたはキーボードを使用しているときにフォーカスボックスが表示されます。LegacyFocus マッシュアッププロパティを使用してフォーカスの動作を制御できます。新規マッシュアップを作成したときには、デフォルトで、このプロパティは false に設定されています。後方互換性を維持するため、以前のバージョンで作成されたマッシュアップではこのプロパティが有効になっています。詳細については、マッシュアップでのレガシーフォーカスの有効化を参照してください。
これは役に立ちましたか?