モーダルウィンドウの実装

モーダルウィンドウとは

求められた操作が完了するまで親ウィンドウの操作ができないウィンドウ
ウィンドウ内で表示された操作を完了する、あるいはキャンセルをしなければ、ウィンドウの外をクリックしても戻れない

モーダルとポップアップとの違い

モーダル
表示されたタスクが完了するまで、ユーザーは他の作業を行えない
ユーザーは表示内容に従うか、モーダルウィンドウを閉じなければならない

ポップアップ
ポップアップウィンドウが表示されても、作業中の画面の操作を続行できる。

参考URL

https://goworkship.com/magazine/modal-windows-mobileui/

モダールウィンドウの表示

(1) モーダルウィンドウ用のクラスとstroyboardを作成
(2) 表示する側のControllerに以下を記述

// (1) モーダルウィンドウオブジェクトを作成
let modal: ModalViewController = ModalViewController(nibName: nil, bundle: nil)
// (2)モーダルウィンドウの動きを指定(この例では下から表示)
modal.modalTransitionStyle = UIModalTransitionStyle.coverVertical
// (3)遷移(遷移先の背景色を赤にしている)
self.present(modal, animated: true, completion: {
modal.view.backgroundColor = UIColor.red
})

(3) 遷移先のクラスから戻る場合
ボタンなどを配置してあげて、ボタンの中の処理にdismissメソッドを記述

// 「閉じる」ボタン押下時の処理
@objc func onClose(_ sender: UIButton) {
self.dismiss(animated: true, completion: nil)
}

サンプル

https://github.com/satoNobu/study_swift/commit/7fdc831695e9c6bb5559d0c596210c7bf5fa1229

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です