アラートのボタンの配置
開発中のアプリで、アラートのボタンをどのように出せばいいのか悩んだので、あらためてHuman Interface Guidelinesを読みました。
Place buttons where people expect them. In general, buttons people are most likely to tap should be on the right. Cancel buttons should always be on the left.
アップルさんによると、イチオシのボタンは右がいいそうです。
キャンセルボタンは 常に左 だそうです。
Identify destructive buttons. If an alert button results in a destructive action, such as deleting content, set the button’s style to Destructive so that it gets appropriate formatting by the system.
また、データ削除のように destructive（破壊的な） 変更をするボタンは、ボタンの見た目を Destructive に設定してユーザーが一目でわかるようにしよう、という指示もあります。
Destructiveに設定すると、こちらのスクリーンショットの Remove（削除）ボタン のように文字が赤くなります。
Label cancellation buttons appropriately. A button that cancels an alert’s action should always be labeled Cancel.
ほかにも、キャンセルボタンのラベルは必ずキャンセルにしましょう、ともあります。
このあたりは、ユーザーインターフェースの統一感を大切にするアップルさんらしいですね。
とはいえ、アップルさんも試行錯誤しているところもあります。
アラートのボタンもそのひとつで、iOSのバージョンによって右だったものが左になったりしています。
というわけで、Human Interface Guidelinesをたまに読み返してみるとあらたな発見があるかもしれません。
Destructiveなボタンとキャンセルボタンのあるアラートのサンプルコード
最後に、アラートのサンプルコードを紹介します。
let alert = UIAlertController(title: "削除", message: "削除してもよろしいですか？", preferredStyle: .alert)
let cancelAction = UIAlertAction(title: "キャンセル", style: .default)
let okAction = UIAlertAction(title: "OK", style: .destructive) { (action: UIAlertAction) in
// なにか削除する処理
}
alert.addAction(cancelAction)
alert.addAction(okAction)
present(alert, animated: true, completion: nil)
style: .destructive にすると、Destructiveに設定されてボタンの色が赤くなります。
また、ボタンはaddした順番に左から表示されるので、キャンセル左のルール通りにする場合は
alert.addAction(cancelAction)
alert.addAction(okAction)
というふうにcancel→okの順番でaddします。
アラートひとつとっても、いろいろと奥が深いですね。