さまざまな情報を検索する際に使われるサーチバーの基本的な使用方法を説明します。ナビゲーションバーやテーブルビューとともに使われる場合の多いコントロールですが、普通のビューに組み込んで仕様することもできます。
プロジェクトの作成と画面の準備
Single View Applicationを作成します。
▲Main.storyboardにSearch Barをドロップします。ツールバーの下あたりに移動しオートレイアウトの制約を上、左、右に設定しておくとよいでしょう。
▲アシスタントエディタを選び、サーチバーをCtrl+ドラッグします。searchBarという名前のOutletを作成しておきます。
コードの生成
ViewController.swiftでコードを実装します。
キャンセルやスコープボタンの設定はプログラムで実装するのが簡単です。
また検索ボタンやキャンセルボタンが押された場合、UISearchBarDelegateを実装したクラスにイベントが送信されてきます。今回はViewControllerにUISearchBarDelegateを実装して、それぞれのイベントを受け取っています。
class ViewController: UIViewController, UISearchBarDelegate {
@IBOutlet weak var searchBar: UISearchBar!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
searchBar.delegate = self
searchBar.showsCancelButton = true
//プレースホルダの指定
searchBar.placeholder = "検索文字列を入力してください"
//検索スコープを指定するボタン
searchBar.scopeButtonTitles = ["果物", "野菜"]
searchBar.showsScopeBar = true
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
func searchBarSearchButtonClicked(searchBar:UISearchBar) {
print("検索ボタンがタップ scopeIndex=\(searchBar.selectedScopeButtonIndex)")
}
func searchBarCancelButtonClicked(searchBar: UISearchBar) {
print("キャンセルボタンがタップ")
}
}
実行すると以下のような画面が表示されます。実際はsearchBarSearchButtonClickedにデータを検索する処理を作り込み、検索結果をテーブルビューなどに表示することになります。
