• 2022/10/26
• 3分

【Swift UIKit】モーダル(present)にNavigationBarItemを設置する方法

＼ アプリをリリースしました ／

友達や家族の誕生日をメモ！通知も届く-みんなの誕生日-

posted withアプリーチ

SwiftのUIKitでpresentメソッドを使ってモーダルウィンドウを実装した際に遷移先にNavigationBarItemを表示させる方法をまとめていきます。

NavigationBarItemが表示されない

モーダルページにナビゲーションボタンが表示されるのを期待して以下のようにコードを記述してみましたが、presentメソッドを使った画面遷移を実装すると親のViewControllerにNavigationControllerが組み込まれていてもNavigationBarが表示されません。

ViewController.swift
class ViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
    }
    
    @IBAction  func showAlert(){
        let storyboard = UIStoryboard(name: "Main", bundle: nil)
        let modalVC = storyboard.instantiateViewController(withIdentifier: "modal")
        self.present(modalVC, animated: true, completion: nil)
    }
}

ModalViewController.swift
class ModalViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        let barButton = UIBarButtonItem(image: UIImage(systemName: "checkmark"), style:.plain, target: self, action: nil)
        self.navigationItem.rightBarButtonItem = barButton
        
        let leftButton = UIBarButtonItem(image: UIImage(systemName: "chevron.backward"), style:.plain, target: self, action: nil)
        self.navigationItem.leftBarButtonItem = leftButton
    }
}

UINavigationControllerクラスのpushViewControllerメソッドを使用すればNavigationBarが表示されるようになりますがモーダルウィンドウではなく、横に新規ページを構築する遷移方法になってしまいます。

これをモーダルでも表示されるようにしていきたいと思います。

モーダルウィンドウにNavigationBarItemを設置する方法

モーダルウィンドウにNavigationBarItemを設置するには遷移先に新規でUINavigationControllerを設置します。

@IBAction  func showAlert(){
    let storyboard = UIStoryboard(name: "Main", bundle: nil)
    let modalVC = storyboard.instantiateViewController(withIdentifier: "modal")
    let navigationController = UINavigationController(rootViewController: modalVC)
    self.present(navigationController, animated: true, completion: nil)
}

これでNavigationBarが表示されるようになっているのでコードからNavigationBarItemを追加してあげれば表示されるようになります。

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。