skip to Main Content

Noob to SwiftUI and WatchOS. I have NavigationLink wrapped around the row in the list. When I click on the row within the list, it does navigate to new view, but I only see ‘<‘ back arrow on the top left of the new view. I don’t see word ‘Back’ or even title of the view on it. Below is my code. My understanding is ‘Back’ word shows up by default. Am I missing something?

ContentView:

struct ContentView: View {
    @StateObject var userSettingsStore = UserSettingsStore()
    
    var body: some View {
        MainMenuListView()
    }
}

MainMenuListView:

struct MainMenuListView: View {
    @EnvironmentObject var userSettingsStore: UserSettingsStore
    
    var body: some View {
        VStack {
            let menuItems = MenuOptions().menu
            List(menuItems) { item in
                NavigationLink(destination: MenuDestination(rawValue: item.id)?.view) {
                    MenuListRowView(imageName: item.imageName, menuItemName: item.name)
                }.navigationViewStyle(StackNavigationViewStyle())
            }
        }.navigationTitle("Sample Application")
    }
}

Menu Destination returns the view to which each row is supposed to navigate. Let’s say I click on row 2 and it navigates to CustomView.

CustomView:

struct CustomView: View {
    @StateObject var viewModel: CustomViewModel
    
    var body: some View {
        VStack {
            HStack {
                Text("Books List")
                Spacer()
                Button(action: {}) {
                    Image(systemName: "calendar.circle").foregroundColor(Color(red: 32 / 255, green: 148 / 255, blue: 249 / 255))
                }.buttonStyle(PlainButtonStyle())
            }
            List(CustomMockData().booksList) { item in
                CustomRowView(bookItem: item)
            }
        }.onAppear() {
            self.viewModel.getBooksList()
        }
    }
}

Below is how the new view looks i.e. just ‘<‘ without any text besides it. How do I display the text?

enter image description here

Edit: Adding code for app file.

@main
struct myCustomApp: App {
    @WKExtensionDelegateAdaptor(ExtensionDelegate.self) var delegate
    @SceneBuilder var body: some Scene {
        WindowGroup {
            NavigationView {
                ContentView().environmentObject(UserSettingsStore())
            }
        }

        WKNotificationScene(controller: NotificationController.self, category: "myCategory")
    }
}

2

Answers


  1. Chosen as BEST ANSWER

    I was able to display the title besides '<' back arrow by adding .navigationBarTitle("Main Menu") in my next view i.e. Custom View.

    Code:

    struct CustomView: View {
        @StateObject var viewModel: CustomViewModel
        
        var body: some View {
            VStack {
                HStack {
                    Text("Books List")
                    Spacer()
                    Button(action: {}) {
                        Image(systemName: "calendar.circle").foregroundColor(Color(red: 32 / 255, green: 148 / 255, blue: 249 / 255))
                    }.buttonStyle(PlainButtonStyle())
                }
                List(CustomMockData().booksList) { item in
                    CustomRowView(bookItem: item)
                }
            }.navigationBarTitle("Main Menu").onAppear() {
                self.viewModel.getBooksList()
            }
        }
    }
    

  2. Try wrapping your MainMenuListView in an actual Navigation View:

    struct ContentView: View {
        @StateObject var userSettingsStore = UserSettingsStore()
    
        var body: some View {
            NavigationView{
                MainMenuListView()
            }
        }
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search