Androidアプリでアクセシビリティとレイアウトの両立を実現する方法(フォントサイズ編)

2014年11月21日金曜日 msym

みなさんごきげんよう、ヴァル研究所のmsymと申します。
朝晩の寒暖の差が大きくなってきましたがいかがお過ごしでしょうか。


今回は私の担当している「駅すぱあと for Android」で先日気が付いた失敗についてお話をさせていただきたいと思います。




Androidは多種多様の端末が販売されているため、アプリケーションをどの端末でも最適なレイアウトで表示するためにスケーラブルに開発していく必要があります。
そのため画面の密度に依存しない単位でUIパーツや文字のサイズを指定していくわけですが、それらに「dp」と「sp」というものがあります。

ご存じない方のために軽く説明をさせていただきますと、以下です。

• dp
  Density Independent Pixelsの略で、画面の密度に依存しないピクセルという意味になります。
  これは1pxを160 dot per inch基準で1としているものです。
  つまりあるサイズを10dpと指定した場合、160dpiの端末ですと10pxになり、
  3倍の480dpiの端末ですと30pxに自動的に置換してくれる便利なものです。

• sp
  Scale Independent Pixelの略で、スケールに依存しないピクセルという意味になります。
  dpに似ていますが、こちらは画面密度とフォントサイズも考慮されてpxに置換されます。
  そのため一般的には文字サイズの指定にはこちらの使用が推奨されています。

ざっくりとですがご理解いただけましたでしょうか？


さて、駅すぱあと for Androidでもテキストサイズの指定にはspを使用していますが、端末の文字を拡大できるユーザー補助機能があります。
これを利用した時に問題が発生してしまいました。

それではまず端末の文字サイズ設定を通常にされている方が定期料金表示画面を開いた時をご覧ください。

なるほど。


次に端末の文字サイズを大きくなるように設定されている方がこのアプリを使用するとどうなるのか見てましょう。



なんということでしょう。路線がぶった切れてしまいました…。


文字が拡大されたことによりサイズ肥大化でレイアウトの崩れを招いてしまいましたね。
可能な限りユーザの設定に対応できるようにするのが理想ですが、レイアウトとの兼ね合いで中々それが難しい時もあります。

そのような時はspではなくdpにしてみるという手があります。

それでは問題の箇所のサイズ指定をspからdpにした場合どうなるでしょう？


やりました！切れてしまった路線がきちんとつながって表示されました。
dpにすることで文字サイズの拡大の影響を受けず画面密度だけを考慮したサイズが適用されレイアウトが維持されましたね。

このようにレイアウトと相談した結果、致し方ない時はあえて文字サイズの指定には推奨されていないdpを使ってみるのもひとつの手段ではないでしょうか。


この他にもややこしい問題としてはどの程度拡大されるのかが端末によってマチマチだという点もあります。
実は元のsp指定のままでも他の端末だときちんと予定したレイアウトで表示されたりします。
今後端末によってのばらつきが少なくなれば開発（特にテスト）が楽になるんですがね（笑）


今回はこの辺で失礼させていただきます。
みなさん、良き開発者ライフを。