タイトル通り、サイドバーメニューをコードのみで実装する方法です。
Storyboard
を使う方法もちらほらありましたが、今後複数人で開発することになった場合に管理が面倒になるのと、個人的に Storyboard
が苦手なので使いたくなかったので、コードのみの実装方法を採用しました。
今回参考にさせていただいたサイトはこちらから。
ios SideMenu ライブラリの使い方 – とりあえずphpとか
http://kimagureneet.hatenablog.com/entry/2019/09/06/223040
また、使用したライブラリ「SideMenu」の GitHub ページはこちらです。
GitHub – GitHub – jonkykong/SideMenu: Simple side/slide menu control for iOS, no code necessary! Lots of customization. Add it to your project in 5 minutes or less.
https://github.com/jonkykong/SideMenu
早速実装方法ですが、まず Podfile
に下記を追加し、pod install
コマンドを実行します。
pod 'SideMenu'
そうすると、SideMenu ライブラリが使用可能になります。
次に、任意の名前のコントローラを作成します。
私は MenuViewController.swift
という名前で作成しました。
中身は下記の通り。
なお、サイドバーのメニューは TableView を使って表示しています。
import UIKit import SideMenu class MenuViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { private var tableView = UITableView(); var items: [String] = ["メニュー1","メニュー2","メニュー3"] override func viewDidLoad() { super.viewDidLoad() // 背景色は白にする view.backgroundColor = .white // 見た目調整 self.navigationController?.navigationBar.tintColor = .clear self.navigationController?.navigationBar.barStyle = UIBarStyle.black self.navigationController?.navigationBar.isTranslucent = true self.navigationController?.navigationBar.backgroundColor = .blue // TableView を追加 tableView.frame = view.bounds tableView.delegate = self tableView.dataSource = self tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell") tableView.tableFooterView = UIView() view.addSubview(tableView) } func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return items.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) cell.textLabel?.text = items[indexPath.row] return cell } func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { // セルの選択を解除 tableView.deselectRow(at: indexPath, animated: true) // サイドバーを閉じる dismiss(animated: true, completion: nil) NotificationCenter.default.post( name: Notification.Name("SelectMenuNotification"), object: nil, userInfo: ["itemNo": indexPath.row] // 返したいデータをセットする ) } }
次に、サイドバーメニューを追加したいページに下記を追加します。
なお、import SideMenu
の追加を忘れずに。
override func viewDidLoad() { super.viewDidLoad() ...... // サイドバーメニューからの通知を受け取る NotificationCenter.default.addObserver( self, selector: #selector(catchSelectMenuNotification(notification:)), name: Notification.Name("SelectMenuNotification"), object: nil ) }
// 選択されたサイドバーのアイテムを取得 @objc func catchSelectMenuNotification(notification: Notification) -> Void { // メニューからの返り値を取得 let item = notification.userInfo // 返り値が格納されている変数 // 実行したい処理を記述する }
サイドメニューバーを開く時には下記のコードを使います。
let menu = SideMenuManager.default.menuLeftNavigationController! present(menu, animated: true, completion: nil)
実装に必要なコードは以上です。
なお、今回はサイドバーのメニューの表示に TableView を使っていますが、もちろんボタンとかにしても OK です。
その場合は、MenuViewController.swift
の viewDidLoad()
内で記述してください。
以上、Swift でサイドバーメニューをコードのみで実装する方法でした。
ご参考になれば幸いです。