4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

NavigationBarのTitleを左に寄せたい時の手っ取り早い方法とExtension

Posted at

iOSでNavigationControllerを使用した際のTitleは通常中央に表示されます。
Large Titleを選択したら、大きいTitleが左寄せで表示されます。

ただし、Androidでは通常左寄せの表示になるようです。

Androidファーストな企画の場合、Large Titleではないのにも関わらず左寄せを要求されることがあります。

その時の実装を備忘録として残しておきます。

##実装

UIViewController+ext.swift
import UIKit

extension UIViewController {
    /// NavigationBarの左にローカライズされたタイトルを表示する
    func setLeftTitle(_ localizedStringKey: String) {
        let titleLabel = UILabel(frame: CGRect(x: 4, y: 0, width: view.frame.width, height: 28))
        titleLabel.text = localizedStringKey.localized
        titleLabel.textAlignment = .left
        titleLabel.font = .systemFont(ofSize: 17, weight: .semibold)
        titleLabel.textColor = .white
        navigationItem.titleView = titleLabel
    }
}

全ての画面で実装を書くのは流石にしんどかったのでエクステンションで実装しました。

UIViewController.swift
    override func viewDidLoad() {
        super.viewDidLoad()

        setLeftTitle("左寄せで表示したいタイトル名")
    }

この実装でいけました!
余白もいい感じ(?)に開いてます。

また、戻るボタンをカスタマイズしている画面ても問題なく同時表示できたので良かったです。

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?