サイト移転のお知らせ:http://techbooster.org/に移転しました

Android 4.0でアクセシビリティを向上させる

11月 13, 2011   //   by @mhidaka   //   ユーザインターフェース  //  1 Comment

Android4.0では、Android Beamなどの新機能の追加に加えて、アクセシビリティの向上も図られています。設定画面より、「ユーザー補助(またはAccessibility)」として有効化できます。
視覚によらないインターフェイスを確保することで、アプリケーションの利用促進が期待できるほか、Androidの普及に伴ってハンディを持つ人にとって利用しやすいか、というアクセシビリティの確保は非常に重要な要素となりつつあります。

アクセシビリティのためのexplore-by-touch mode

アクセシビリティを向上させる方法は、非常に簡単で、View(コンテンツ)に読み上げてほしい文字列を追加します。記述した文字列はAndroid OSの用意した“explore-by-touch mode”(コンテンツ情報を取得するタッチモード)で有効になります。

“explore-by-touch mode”では、トラックボールを使ってマウスのような仮想カーソルをシミュレートします。(当然、デバイスはトラックボールで無くてもよいですが、視覚によらないで液晶ディスプレイに映し出されたコンテンツを確認するには、一般的なようです)。カーソルのHover(マウスなどのカーソルがViewの上で長時間、動かずにとどまる)状態で、文字列が読み上げられます。

Viewへ説明文を追加するには

Viewとxmlレイアウトへの記述、2種類の対応方法があります。

メソッド、属性説明
ViewクラスsetContentDescription()Viewの説明文となる文字列を指定する
xmlの属性値 android:contentDescriptionStringリソース、または説明文を直接記述する

Reference: setContentDescription
Reference: android:contentDescription

文字列以外は指定できず、改行コード ‘\\n’ やunicode文字の場合は ‘\\uxxxx’ でエスケープできます。
Viewの種類によっては本文(Text)を持たないため、それらをよりわかりやすく説明する文字列を追加すると良いでしょう。
説明文が設定されていないコンテンツ(特にImageButton、EditText、ImageViewやウィジェット)では必ず、android:contentDescriptionを設定するようにしてください。

サンプルコード

サンプルコードはつづきからどうぞ。

Viewへの設定と、xmlへの記述、2つのサンプルコードを用意しました。実際に使う際はどちらか片方のコードで十分です。多言語対応等の簡単さを考えるとxml要素での対応をおすすめします。
Viewの説明文を追加するには、setContentDescriptionメソッドを使います。

AccessibilityActivity.java

public class AccessibilityActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        ImageView v = (ImageView) findViewById(R.id.imageView1);
        v.setContentDescription("Techbooster's mascot: mogutaso");
    }
}

9行目のsetContentDescriptionメソッドで文字列を設定します。Viewの説明文になるように注意してください。
また、setContentDescriptionメソッドはViewクラスのメソッドなので、ウィジェット、EditTextなどどんなViewでも利用可能です。

xmlでの記述ではandroid:contentDescription属性を利用します。

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    ...省略...

    <ImageView android:id="@+id/imageView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/mgts01_touka"
        android:contentDescription="@string/mogtaso_syoukai" />
        <!-- android:contentDescription="Techbooster's mascot: mogutaso"  -->

</LinearLayout>

13行目、android:contentDescription属性にStringリソースを指定しています。14行目のコメントアウトのように直接、文字列を指定しても問題ありません。

Viewの説明文は、このように簡単に追加することが出来ます。優しいアプリにするため、積極的に利用したいですね。
以上、おつかれさまでした!

関連する記事:

Sponsored Link

1 Comment

技術書新刊 発売中

アンドロイドアカデミアには、CIやテスト、互換検証など実務に生きるノウハウをあつめています

技術書新刊 発売中

Android Next!はAndroid 7.0に対応したはじめての技術書です!


The Web Explorer 2はCSSの中央寄せやWebAudioなど未来を読み解く一冊です


Revised TypeScript in DefinitelylandはTypeScript 2.0(β)に対応した解説書です。インストールから型定義まで幅広くサポートしています


技術書をかこう!はエンジニアらしい執筆環境を構築、HowTo本です