【Swift】NavigationBarに検索バーを設置

 

完成図

 

f:id:nekokichi_yos2:20181230234946p:plain

 

解説

 

検索バーを設置するには、ViewがNavagationControllerを継承している必要がある。

 

予め、Embed In で継承しておこう。

 

また、検索バーをSNSクラウド共有アプリで使用する際、searchBar専用のメソッド(searchBarSearchButtonClickedなど)内でsearchBar.textを引数として、データを読み込むメソッドに組み込むのもアリ。

 

実際、pomu.meのサンプルを作った際に実装した。

 

ソースコード

 

import UIKit

class addNavigationSearchBar: UIViewController,UISearchBarDelegate {
    
    //検索バーの宣言
    var searchBar: UISearchBar!
    
    @IBOutlet weak var textLabel: UILabel!
    
    override func viewDidLoad() {
        super.viewDidLoad()

        //NavigationBarに検索バーを設置
        setSearchBar()
    }
    
    //検索バーの設置
    func setSearchBar() {
        // NavigationBarにSearchBarをセット
        if let navigationBarFrame = self.navigationController?.navigationBar.bounds {
            //NavigationBarに適したサイズの検索バーを設置
            let searchBar: UISearchBar = UISearchBar(frame: navigationBarFrame)
            //デリゲート
            searchBar.delegate = self
            //プレースホルダー
            searchBar.placeholder = "ユーザーを検索"
            //検索バーのスタイル
            searchBar.autocapitalizationType = UITextAutocapitalizationType.none
            //NavigationTitleが置かれる場所に検索バーを設置
            navigationItem.titleView = searchBar
            //NavigationTitleのサイズを検索バーと同じにする
            navigationItem.titleView?.frame = searchBar.frame
        }
    }
    
    //検索バーで入力する時
    func searchBarShouldBeginEditing(_ searchBar: UISearchBar) -> Bool {
        //キャンセルボタンを表示
        searchBar.setShowsCancelButton(true, animated: true)
        return true
    }
    
    //検索バーのキャンセルがタップされた時
    func searchBarCancelButtonClicked(_ searchBar: UISearchBar) {
        //キャンセルボタンを非表示
        searchBar.showsCancelButton = false
        //キーボードを閉じる
        searchBar.resignFirstResponder()
    }
    
    //検索バーでEnterが押された時
    func searchBarSearchButtonClicked(_ searchBar: UISearchBar) {
        //Labelに入力した値を設定
        textLabel.text = searchBar.text as! String
    }

}