はじめに

年末に 100 マス計算アプリをつくりました！

100 マス計算アプリはいくつかあるのですが VoiceOver 対応がされているものは少ないんじゃないかなと思い対応してみました。
こんな感じです。

VoiceOver 対応

やりたいことは下記です。

各ボタンを読み上げてほしい
「1 + 1 は？」のように問題を読み上げてほしい

上記画面は SwiftUI で作っており Text と Label だけ設定した Button だけなので基本的には何も設定しなくてもいい感じに読み上げてくれました。
マイナスボタンだけ対応が必要だったので以下のように対応しました。

Button("-") {
}.accessibilityLabel("マイナス")

このままだと縦横の「0 ~ 9」の Text も読み上げられるので読み上げられないように以下のように accessibilityHidden を設定しました。

Text("1").accessibilityHidden(true)

あとは問題文を読み上げてもらうだけです。全くやり方がわからなかったので ChatGPT に聞いてみたところ下記が使えそうでした。

問題回答時に正誤問わず下記を実装しました。「1 + 1 は？」とすると「は」と読み上げられたので「わ」にしています。

UIAccessibility.post(notification: .announcement, argument: String(format: "%1$lldたす%2$lldわ？", row, column))

課題

なぜかうまく読み上げてくれないときがあったのでよくわかりませんが遅延をいれると読み上げてくれるようになりました（0.01 とかにするとうまく機能しないときがあったので 0.1 にしています）。

DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
    UIAccessibility.post(notification: .announcement, argument: String(format: "%1$lldたす%2$lldわ？", row, column))
}

画面表示時に最初の問題を読み上げてほしかったので onAppear にも同じ処理を入れているのですがうまく読み上げてくれません。。。なので今のところ一問目は一度何か解答しないと読み上げてくれません。

とりあえずはこれでそれっぽい読み上げをしてくれるようになりました

動作確認（シミュレータ）

シミュレータで動作確認する場合は Accessibility Inspector を使うといいです。

シミュレータ起動後に Xcode > Open Developer Tool > Accessibility Inspector から起動できます。

下記のようにすると各パーツを読み上げてくれます。

シミュレータを選択
対象のアプリを選択
右上の吹き出しボタン選択

動作確認（実機）

実機で動作確認する場合はまず下記を設定します。

設定アプリ > アクセシビリティ > ショートカットで VoiceOver をチェック。

これで iPhone のサイドボタンを 3 回押すと VoiceOver のオン・オフが切り替えられるようになります。
（ショートカットではなく一番上の VoiceOver をオンにすると戻し方がわからなくなるのでこっちの方が安心です）

iPhone のサイドボタンを 3 回押して動作を確認します。終わったらもう一度サイドボタンを 3 回押して完了です。

おわりに

今まであまり VoiceOver 対応をしたことがないのでわからないことも多いのですがこれで最低限必要な部分は読み上げてくれるようになったはずです

ちょこちょこ更新つもりなのでよかったらアプリダウンロードしてください