Splitup of Form Inline Navigation Bar Title

Question

I created an entry form as an independent project with the navigation bar working great. I then copied the view to my overall project. In the process my inline navigation bar title split up leaving the Back button where it should be and creating a large space before displaying the title and the Save button (See photo below). There is a similar question at How to remove the default Navigation Bar space in SwiftUI NavigiationView but they are trying to remove the space in addition to the title from a List whereas I'm working with a form. Another question with large navigation bar space was due to a duplicate navigation bar title (Removing large amounts of whitespace in a SwiftUI subview). That is not the case here. Any ideas?

here is some of the code:

`struct entryView: View {

    @EnvironmentObject var userData: UserData
    @Environment(\.managedObjectContext) var viewContext    // core data
    
     . . .

    var body: some View {
       
        NavigationView {
            Form {
                
                // get entry date and time
                Section {
                    HStack {
                        Image("iconCalendar24")
                        Spacer()
                        DatePicker("", selection: $entryDT, in: ...Date())
                            .datePickerStyle(CompactDatePickerStyle())
                    }
                }

           . . .

 // select entry category
                Section {
                    HStack {
                        Text("Select Category")
                            .font(Font.subheadline.bold())
                        Picker(selection: $entryCat, label: Text("")) {
                            ForEach(0 ..< self.categories.count) {
                                Text(self.categories[$0]).tag($0)
                            }
                        }
                    }
                }

                .navigationBarTitle(Text("Expense Entry"), displayMode: .inline)
                .navigationBarItems(trailing:
                                    Button(action: {
                                        self.saveButton()   // button pressed
                                    }) {
                                        Text ("Save")
                                    }.disabled(moneyS.isEmpty)
                                
            )
        }
    } 
}

}

Simulator view of the Expense Entry screen

score 0 · Answer 1 · answered Nov 17 '20 at 04:17

It looks like you already have one NavigationView somewhere in parent view, so you don't need another one here.

Try to remove

struct entryView: View {

    @EnvironmentObject var userData: UserData
    @Environment(\.managedObjectContext) var viewContext    // core data
    
     . . .

    var body: some View {
       
        //NavigationView {        // << this one !!

score 0 · Answer 2 · answered Nov 17 '20 at 15:31

I texted out the whole view then slowly brought pieces in one at a time. It turns out the navigation bar return to inline format when I removed NavigationView { } from the view.

It is strange that the navigation bar displayed correctly in the standalone project but then failed when brought into the main project with other files / views.

Splitup of Form Inline Navigation Bar Title

2 Answers2