watchOS 8 から表示されるようになった NavigationBar の Large title 表示をやめたい

はじめに

ご存知の通り watchOS 8 から NavigationBar のタイトル部分が
デフォルトで Large title 表示されるようになりました。

watchOS 7	watchOS 8

今夏 Watch App 開発していたのですが，watchOS 8 での動作確認は
後回しにしていてリリース前に確認して，あぁ〜変わったんだという感じでした。
Apple Watch のシリーズが新しくなるごとに
少しずつ画面サイズが大きくなってるとはいえ，
コンテンツ領域狭くしてまでも表示すべきなのかは諸説ありそうです。

私は(デフォルトにすることは)改悪だと考えてて watchOS 7 までの表示に共通化したいなー
ということで実装見直しました。

表示を共通化

iOS の実装経験から大体予想はついていたのですが，
NavigationBar の titleDisplayMode 周りを調べると…
ふむふむなるほど，watchOS の large の設定は watchOS 8 以上になってますね。

https://developer.apple.com/documentation/swiftui/navigationbaritem/titledisplaymode/large

つまり inline の設定を明示的に書いてやればいいだけです。

struct HogeView: View {
    var body: some View {
        NavigationView {
            // 省略
            .navigationTitle("Hoge Title")
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}

watchOS 7 以下の実装も考慮すると ViewModifier などを使えば良さそうです。

import SwiftUI

struct NaviDisplayMode: ViewModifier {
    func body(content: Content) -> some View {
        if #available(watchOSApplicationExtension 8.0, *) {
            content.navigationBarTitleDisplayMode(.inline)
        }
    }
}

同じように適用してあげます。

struct HogeView: View {
    var body: some View {
        NavigationView {
            // 省略
            .navigationTitle("Hoge Title")
            .modifier(NaviDisplayMode())
        }
    }
}

無事に watchOS 7 までの表示になりました。

修正前	修正後

Apple の純正アプリの表示までは変更できないのでモヤモヤ感は残ります。
慣れたら問題なくなりそうではあります・・・

おわりに

今回は watchOS 8 から表示されるようになった，
NavigationBar の Large title 表示をやめたいということでその対応について書きました。

(一部 iOS App と勝手が異なりますが) Watch App 開発も
SwiftUI でできるようになって取り組みやすくなっています。
なかなか UIKit を完全に使わないというわけにいかず尻込みしている方がいたら，
損なので Watch App くらいの小さい規模のアプリから作ってみるのもアリだと思います。

乱文になりましたが，ご覧いただきありがとうございました