【Swift】ナビゲーションバーのボタンをカスタマイズ[UINavigationItem]

iOSエンジニアの仁科です。

今回はさくっとしたTipsを紹介します。

概要

左側のボタンをカスタマイズしてみます。

1. フォント
2. 色
3. 画像
4. 画像とテキスト間のマージン
5. 中身左寄せ

以上を変更してみます。
いろいろボタンを変更してみます。

用意するもの

• ViewController 2つ（遷移先と遷移元）
• 戻るボタンのアイコン

以下のコードで画像の様な戻るボタンが出来ちゃいますっ

ボタンを作る際ギリギリのView領域で作るのではなく、
余裕を持った領域を持たせることで押しやすくなります！（ユーザビリティ◎）

override func viewDidLoad() {
    super.viewDidLoad()

    let backButtonItem:UIBarButtonItem =  UIBarButtonItem(customView:self.createButton())
    navigationItem.leftBarButtonItem = backButtonItem
}


func createButton() -> UIButton {

    let button: UIButton = UIButton(type: .System)

    button.frame = CGRectMake(0, 0, 80, 40)
    button.contentHorizontalAlignment = UIControlContentHorizontalAlignment.Left;     //中身左寄せ
    button.setTitle("タイトル", forState: UIControlState.Normal)
    button.setTitleColor(UIColor.blackColor(), forState: .Normal)
    button.titleLabel?.font = UIFont(name:"HiraKakuProN-W3",size: 12)     
    button.setImage(UIImage(named: "leftArrow"), forState: .Normal)
    button.titleEdgeInsets = UIEdgeInsetsMake(0, 7, 0, 0);     //テキストにマージン。左に7px

    button.addTarget(self, action: #selector(toBack), forControlEvents: .TouchUpInside)

    return button

}

func toBack() {
    self.navigationController?.popViewControllerAnimated(true)
}