Extra spacing in NavigationBarTitle in SwiftUI

user_11612215 0
Viewed 476

I have a detail view that displays with an absurd amount of spacing and I can't figure out why.

    struct MessageDetailView : View {
    var friend: Friend
    var body: some View {
        NavigationView {
            List {
                ForEach(0..<friend.messages.count) { message in
                    Text(self.friend.messages[message])
                        .modifier(textBubbleModifier())
                }
                }.navigationBarTitle(
                    Text(self.friend.name))
        }
    }
}

The Friend struct is pretty simple:

struct Friend: Identifiable {
    var id = UUID()
    var name: String = ""
    var messages: [String] = [""]
}

let friends: [Friend] = [
    Friend(name: "Mark Zuckerberg", messages: ["Let's keep things private between you and I, shall we?", "I can keep a secret", "I definitely won't sell all your data"])

Attached are two images. One from the simulator with the erroneous spacing and one from the canvas view, without. Any ideas? It might just be an Xcode bug.

Simulator Look Canvas View Look

swiftui swift
1 Answers

The canvas doesn't know that the view may be pushed to a NavigationView or not and displays correctly. But in runtime it's pushed and you're using a NavigationView as well in your detail view. Try unwrapping your content from the NavigationView in the detail view's body. So it will look like below code:

var body: some View {
  List {
    ForEach(0..<friend.messages.count) { message in
      Text(self.friend.messages[message])
        .modifier(textBubbleModifier())
    }
    }.navigationBarTitle(
      Text(self.friend.name))
}
user_38150690
Related