NearBy

ちょっぴり役に立つ情報を発信しているブログです。

[Swift4] NavigationBarで画像を使う

はじめに

NavagationBarで画像を使う方法について書きます。

定義

はじめに、下記のようにUIBarButtonItemをViewControllerで定義しておきます。

RSwiftを使っています。

引数に、imageを渡すことで、画像を使用できます。

private var sideMenuButtonItem: UIBarButtonItem = UIBarButtonItem(image: R.image.menu(), style: .plain ,target: nil, action: nil)
private var searchButtonItem: UIBarButtonItem = UIBarButtonItem(image: R.image.search(), style: .plain ,target: nil, action: nil)
private var notificationButtonItem: UIBarButtonItem = UIBarButtonItem(image: R.image.bell(), style: .plain ,target: nil, action: nil)

ちなみにシステムアイコンを利用する場合は、下記の感じです。

public convenience init(barButtonSystemItem systemItem: UIBarButtonSystemItem, target: Any?, action: Selector?)

生成

次に実際に生成する箇所です。

ここでは、setupViews()を呼んでUIを生成しています。

先ほど定義した変数をnavigationItemに入れます。

extension SampleViewController {
    private func setupViews() {
        view.backgroundColor = .white
        navigationItem.rightBarButtonItems = [notificationButtonItem, searchButtonItem]
        navigationItem.leftBarButtonItem = sideMenuButtonItem
    }
}

完成UIはこんな感じです。

f:id:zawank0:20180415115239p:plain

タイトルがあるのと、画像素材が大きいのは今回は無視します。

まとめ

以上、NavigationBarで画像を使う方法でした。