アプリ開発

『Swift』ナビゲーションバーをカスタマイズのメモ!色や画像の追加方法

Pocket

Objective-Cではいろいろと紹介さていたが、Swiftでの書き方がなかなか見つからなかったので、試行錯誤でswift用に書き換え動いたのでSwiftでの表記方法をメモしておきます。
(swiftからアプリ開発を勉強してます。。。)

ナビゲーションバーはストーリーボードで設定済みとして、進めます。
変更したい、ビューコントローラーの viewDidLoad内に設定を記述すれば変更可能

タイトルを画像にしたい!

var titleImageView: UIImageView? = UIImageView( image: UIImage(named: "logo.png"))
self.navigationItem.titleView = titleImageView

ナビゲーション内のボタン系の文字色を変更したい!

// 色を変数に用意しておく
var color1 = UIColor(red: 255/255, green: 255/255, blue: 255/255, alpha: 1.0)

// ナビゲーション内のボタン系の色を変えたい。
self.navigationController?.navigationBar.tintColor = color1

画像は『Images.xcassets』内に設定した@3x・@2x・@1xに登録したものを指定してあげればよい。
画像のサイズは
@3xは高さ: 66px
@2xは高さ: 58px
@1xは高さ: 58px
に合わせて縮小したものを設定すると綺麗にいきました。

サイズ参考
ULR: アイコンや画像の大きさ | iOS Human Interface Guidelines

バーの背景色を変更したい!

// 色を変数に用意しておく
var color2 = UIColor(red: 255/255, green: 158/255, blue: 35/255, alpha: 1.0)

// 背景の色を変えたい。
self.navigationController?.navigationBar.barTintColor = color2

まとめて書くとこんな感じ。

override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.

// タイトルを画像にする。
var titleImageView: UIImageView? = UIImageView( image: UIImage(named: "logo.png"))
self.navigationItem.titleView = titleImageView

// 色を変数に用意しておく
var color1 = UIColor(red: 255/255, green: 255/255, blue: 255/255, alpha: 1.0)
var color2 = UIColor(red: 255/255, green: 158/255, blue: 35/255, alpha: 1.0)

// ナビゲーション内のボタン系の色を変えたい。
self.navigationController?.navigationBar.tintColor = color1

// 背景の色を変えたい。
self.navigationController?.navigationBar.barTintColor = color2
}
Pocket