ナビゲーションバーの色とタイトルを変更する

  • 2022年8月26日
  • 2022年8月26日
  • Swift

xcodeのバージョン:13.4.1

シミュレーター:iphone11

https://cpoint-lab.co.jp/article/202208/23226/ ←で書いたナビゲーションバーの続きになります。

上の記事でナビゲーションバーをつけたもののナビゲーションバー全体の色とタイトルを

どうやって変更したらいいかわからない!という人向けの記事になります。

少し前までは、コードでナビゲーションバーの色を変えてましたが、xcodeのバージョンが

新しくなってからは右のsho the attribute inspectorからすぐに変更できるようになりました。

まず、Appearancesのscroll edgsにチェックを入れます。

Scroll Edge Appearancesの中のbackgroundから好きな色を選ぶ。

ビルド

上記の手順を踏んでビルドすると、ナビゲーションバーの色が変わっていることが確認できます。

ここまでやって、色は変えられたもののテキストはどうやって変えようかと考えると思います。

テキストの内容は、UINavigationItemクラスをextensionして、新たにタイトル・文字サイズ

をsetTitleViewで更新することで追加することができます。

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        navigationItem.setTitleView(withTitle: "タイトル", subTitile: "")     
    }
}
extension UINavigationItem {

    func setTitleView(withTitle title: String, subTitile: String) {

        let titleLabel = UILabel()
        titleLabel.text = title
        titleLabel.font = .boldSystemFont(ofSize: 17)
        titleLabel.textColor = .black

        let stackView = UIStackView(arrangedSubviews: [titleLabel])
        stackView.distribution = .equalCentering
        stackView.alignment = .center
        stackView.axis = .vertical

        self.titleView = stackView
    }
}

xcodeが出た当初はめんどくさい実装手順でしたが、今はかなり楽になっています。

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG