🔙

SwiftUIとUIKitでナビゲーションバーの戻るボタンのテキストを隠す方法

2023/12/20に公開

バックボタンを非表示にするカスタム化してタイトルを空の文字列にすることが多いのですが

このやり方だとバックボタン長押しで出るメニューが空文字列の配列みたいになって使えないが、最近(でもない?)そのためのツールがUIKitとSwiftUIに入っていますので紹介したいと思います

UIKit

iOS 14から

viewDidLoadなどでnavigationItembackButtonDisplayMode.minimalに設定することでバックボタンのタイトルを非表示にできます

navigationItem.backButtonDisplayMode = .minimal

class HogeViewController: UIViewController {
    override func viewDidLoad() {
        title = "ホゲ" 
        navigationItem.backButtonTitle = "ホゲ"
        navigationItem.backButtonDisplayMode = .minimal // < ---
    }
}

SwiftUI

iOS 16から

バックボタンのタイトルに .toolbarRole(.editor) を設定する

バックボタンのタイトルを非表示にするだけの機能ではないので、iPadなどで他の影響がありそう。.editor 以外には.browser.navigationStackがあります。 .default で設定するとiOSでは.navigationStackになります

var body: some View {
        VStack(alignment: .leading, spacing: 20) {
            Text("ホゲホゲ")
        }
        .frame(maxHeight: .infinity, alignment: .top)
        .padding(20)
        .navigationTitle("タイトル")
        .navigationBarTitleDisplayMode(.inline)
        .toolbarRole(.editor) // <----
    }
株式会社ガラパゴス(有志)

Discussion