次の方法で共有


Xamarin.Forms でのオートメーションのプロパティ

Xamarin.Forms では、AutomationProperties クラスの添付プロパティを使用して、ユーザー インターフェイス要素にアクセシビリティの値を設定できます。これにより、ネイティブなアクセシビリティ値が設定されます。 この記事では、スクリーン リーダーでページの要素について読み上げることができるように、AutomationProperties クラスを使用する方法について説明します。

Xamarin.Forms では、次の添付プロパティを使用して、ユーザー インターフェイス要素にオートメーション プロパティを設定できます。

  • AutomationProperties.IsInAccessibleTree – 要素がアクセシビリティの高いアプリケーションで使用できるかどうかを示します。 詳しくは、「AutomationProperties.IsInAccessibleTree」をご覧ください。
  • AutomationProperties.Name – 要素の読み上げ可能な識別子として機能する、要素の簡単な説明です。 詳しくは、「AutomationProperties.Name」をご覧ください。
  • AutomationProperties.HelpText – 要素の詳しい説明です。要素に関連付けられているヒント テキストと考えることができます。 詳しくは、「AutomationProperties.HelpText」をご覧ください。
  • AutomationProperties.LabeledBy – 現在の要素に対するアクセシビリティ情報を、別の要素で定義できます。 詳しくは、「AutomationProperties.LabeledBy」をご覧ください。

これらの添付プロパティでは、スクリーン リーダーが要素について読み上げることができるように、ネイティブのアクセシビリティ値が設定されます。 添付プロパティについて詳しくは、「添付プロパティ」をご覧ください。

重要

AutomationProperties の添付プロパティを使用すると、Android での UI テストの実行に影響を与える可能性があります。 AutomationId と、AutomationProperties.Name および AutomationProperties.HelpText プロパティの両方で、ネイティブな ContentDescription プロパティが設定され、AutomationProperties.Name および AutomationProperties.HelpText プロパティの値の方が AutomationId の値より優先されます (AutomationProperties.NameAutomationProperties.HelpText が両方とも設定されている場合は、値が連結されます)。 つまり、要素で AutomationProperties.Name または AutomationProperties.HelpText も設定されている場合、AutomationId を検索するテストは失敗ます。 このシナリオでは、代わりに AutomationProperties.Name または AutomationProperties.HelpText、あるいは両方を連結したものを検索するように、UI テストを変更する必要があります。

アクセシビリティ値を読み上げるスクリーン リーダーは、プラットフォームごとに異なります。

ただし、スクリーン リーダーの厳密な動作は、ソフトウェアおよびそのユーザー構成に依存します。 たとえば、ほとんどのスクリーン リーダーでは、フォーカスを受け取ったコントロールに関連付けられているテキストが読み上げられて、ユーザーはページ上のコントロール間を移動しながら自分がいる場所を知ることができます。 一部のスクリーン リーダーでは、ページが表示されたときにアプリケーションのユーザー インターフェイス全体も読み上げられ、ユーザーはページで使用可能なすべての情報コンテンツを受け取ってから、ナビゲートを試みることができます。

また、スクリーン リーダーで読み上げられるアクセシビリティ値も異なります。 サンプル アプリケーションでは次のようになります。

  • VoiceOver では、EntryPlaceholder の値、コントロールの使用方法の順に読み上げられます。
  • TalkBack では、EntryPlaceholder の値、AutomationProperties.HelpText の値、コントロールの使用方法の順に読み上げられます。
  • ナレーターでは、EntryAutomationProperties.LabeledBy の値、コントロールの使用方法の順に読み上げられます。

さらに、ナレーターでは、AutomationProperties.NameAutomationProperties.LabeledByAutomationProperties.HelpText の優先順位になります。 Android の TalkBack では、AutomationProperties.NameAutomationProperties.HelpText の値が結合できます。 そのため、各プラットフォームでアクセシビリティのテストを十分に行い、最適なエクスペリエンスを確認することをお勧めします。

AutomationProperties.IsInAccessibleTree

AutomationProperties.IsInAccessibleTree 添付プロパティは boolean であり、要素にアクセシビリティがあるかどうか、したがってスクリーン リーダーで認識できるかどうかが決定されます。 他のアクセシビリティ添付プロパティを使用するには、これが true に設定されている必要があります。 XAML では次のようにしてこれを実現できます。

<Entry AutomationProperties.IsInAccessibleTree="true" />

または、C# で次のようにして設定できます。

var entry = new Entry();
AutomationProperties.SetIsInAccessibleTree(entry, true);

Note

SetValue メソッドを使用して AutomationProperties.IsInAccessibleTree 添付プロパティを設定することもできることに注意してください。entry.SetValue(AutomationProperties.IsInAccessibleTreeProperty, true);

AutomationProperties.Name

AutomationProperties.Name 添付プロパティの値は、スクリーン リーダーで要素の読み上げに使用される簡潔でわかりやすいテキスト文字列である必要があります。 ユーザー インターフェイスの内容の理解や操作に重要な意味を持つ要素に対しては、このプロパティを設定する必要があります。 XAML では次のようにしてこれを実現できます。

<ActivityIndicator AutomationProperties.IsInAccessibleTree="true"
                   AutomationProperties.Name="Progress indicator" />

または、C# で次のようにして設定できます。

var activityIndicator = new ActivityIndicator();
AutomationProperties.SetIsInAccessibleTree(activityIndicator, true);
AutomationProperties.SetName(activityIndicator, "Progress indicator");

Note

SetValue メソッドを使用して AutomationProperties.Name 添付プロパティを設定することもできることに注意してください。activityIndicator.SetValue(AutomationProperties.NameProperty, "Progress indicator");

AutomationProperties.HelpText

AutomationProperties.HelpText 添付プロパティにはユーザー インターフェイス要素を説明するテキストを設定する必要があり、要素に関連付けられたヒント テキストと考えることができます。 XAML では次のようにしてこれを実現できます。

<Button Text="Toggle ActivityIndicator"
        AutomationProperties.IsInAccessibleTree="true"
        AutomationProperties.HelpText="Tap to toggle the activity indicator" />

または、C# で次のようにして設定できます。

var button = new Button { Text = "Toggle ActivityIndicator" };
AutomationProperties.SetIsInAccessibleTree(button, true);
AutomationProperties.SetHelpText(button, "Tap to toggle the activity indicator");

Note

SetValue メソッドを使用して AutomationProperties.HelpText 添付プロパティを設定することもできることに注意してください。button.SetValue(AutomationProperties.HelpTextProperty, "Tap to toggle the activity indicator");

一部のプラットフォームの Entry などの編集コントロールでは、HelpText プロパティを省略し、プレースホルダー テキストに置き換えることができる場合があります。 たとえば、"ここに名前を入力します" などは、ユーザーが実際に入力する前にコントロールにテキストを配置する Entry.Placeholder プロパティに適した候補です。

AutomationProperties.LabeledBy

AutomationProperties.LabeledBy 添付プロパティを使用すると、現在の要素に対するアクセシビリティ情報を、別の要素で定義できます。 たとえば、Entry の隣の Label を使用して、Entry の内容を説明できます。 XAML では次のようにしてこれを実現できます。

<Label x:Name="label" Text="Enter your name: " />
<Entry AutomationProperties.IsInAccessibleTree="true"
       AutomationProperties.LabeledBy="{x:Reference label}" />

または、C# で次のようにして設定できます。

var nameLabel = new Label { Text = "Enter your name: " };
var entry = new Entry();
AutomationProperties.SetIsInAccessibleTree(entry, true);
AutomationProperties.SetLabeledBy(entry, nameLabel);

重要

AutomationProperties.LabeledByProperty は、iOS ではまだサポートされていません。

Note

SetValue メソッドを使用して AutomationProperties.IsInAccessibleTree 添付プロパティを設定することもできることに注意してください。entry.SetValue(AutomationProperties.LabeledByProperty, nameLabel);

アクセシビリティの複雑な作業

次のセクションには、特定のコントロール上でのアクセシビリティ値を設定するという複雑な作業について説明します。

Android 上で、NavigationPage のアクション バー内の [戻る] 矢印に対して、スクリーン リーダーが読み上げるテキストを設定するには、Page 上で AutomationProperties.Name プロパティと AutomationProperties.HelpText プロパティを設定します。 ただし、これにより OS の [戻る] ボタンには影響しない点に注意してください。

FlyoutPage

iOS およびユニバーサル Windows プラットフォーム (UWP) 上で、FlyoutPage のトグル ボタンに対してスクリーン リーダーが読み上げるテキストを設定するには、FlyoutPage 上で AutomationProperties.Name プロパティおよび AutomationProperties.HelpText プロパティを設定するか、または Flyout ページの IconImageSource プロパティ上でそれらのプロパティを設定します。

Android 上で、FlyoutPage のトグル ボタンに対してスクリーン リーダーが読み上げるテキストを設定するには、Android プロジェクトに次のように文字列リソースを追加します。

<resources>
    <string name="app_name">Xamarin Forms Control Gallery</string>
    <string name="btnMDPAutomationID_open">Open Side Menu message</string>
    <string name="btnMDPAutomationID_close">Close Side Menu message</string>
</resources>

次に、Flyout ページの IconImageSource プロパティの AutomationId プロパティを設定します。

var flyout = new ContentPage { ... };
flyout.IconImageSource.AutomationId = "btnMDPAutomationID";

ToolbarItem

iOS、Android、UWP 上では、AutomationProperties.Name 値または AutomationProperties.HelpText 値が定義されていない場合、ToolbarItem インスタンスの Text プロパティ値がスクリーン リーダーによって読み上げられます。

iOS および UWP 上では、スクリーン リーダーによって読み上げられる Text プロパティの値が AutomationProperties.Name プロパティ値に置き換えられます。

Android 上では、スクリーン リーダーによって表示されかつ読み上げられる Text プロパティ値が AutomationProperties.Name プロパティ値または AutomationProperties.HelpText プロパティ値に完全に置き換えられます。 これは API が 26 未満の場合の制限事項です。