如何让导航标题与后退按钮对齐？

Question

我试图让导航标题与 SwiftUI 中的 NavigationDetail 视图中的后退按钮垂直对齐。这是目前的样子：

下面是我将导航栏标题添加到视图的代码。如何使其与“后退”按钮垂直对齐？

var body: some View {
    Text("My Detail View")
        .navigationBarTitleDisplayMode(.inline)

    VStack {
        List {
            ForEach(0..<layerSettings.count, id: \.self) { each in

        ...
       }
    }

Answer 1

如果您需要在“后退”按钮所在的同一行绘制“我的详细信息视图”，请尝试这样做：

 NavigationView {
    VStack() {
       ...
    }
    .navigationBarTitle(Text("My Detail View"),
                        displayMode: .inline)
 }

Answer 2

因为

navigationBarTitle(_:)

已弃用。在 iOS 14.0+ 中将

navigationTitle(_:)

与

navigationBarTitleDisplayMode(_:)

一起使用

NavigationView {
    VStack() {
       ...
    }
    .navigationTitle(Text("My Detail View"))
    .navigationBarTitleDisplayMode(.inline)
 }

Answer 3

正确的方法是将

.navigationTitle(..)

和

. navigationBarTitleDisplayMode(..)

添加到

NavigationView

而不是

VStack

。 由于将其添加到 VStack 方法不会将标题与“后退”按钮对齐，因为它是 NavigationView 的子级。如下所示：

NavigationView {
    VStack() {
       ...
    }
 }
 .navigationTitle(Text("My Detail View"))
 .navigationBarTitleDisplayMode(.inline)

Answer 4

这个答案迟了一年，但我遇到了同样的问题，这完全取决于你放置代码的位置。

这里有一个例子：

struct ContentView: View{
    var body: some View {
        AnotherView()
    }
}

struct AnotherView: View {
    var body: some View {
        YetAnotherView()
     }
}

struct YetAnotherView: View {
    var body: some View {
        Group {
           SampleStuff()
        }
         .navigationTitle("AmazingTitle")
         .toolbar {
                SomeToolBarButton
          }
     }
}

像这样设置将使标题和工具栏与提供的诽谤相比有一个差距

这个示例只是为了提供问题的图像，我没有完全写出来，但我希望这会有所帮助