iOS Development

ios – Including a Picker to a NavigationView internet hosting a TabView

March 5, 2023

I hoped so as to add a TabView (as a .web page) inside a NavigationView, and have a Picker to manage the navigation between them.

I’ve the performance, however when it’s rendered there are white segments – one within the navigation bar, the opposite within the backside protected space.

As a result of I’ve a Listing within the TabView, I assume that’s what is inflicting the .navigationTitle to not scroll. Nonetheless, I used to be questioning if there’s a option to obtain it?

That is the code that I’ve:

struct ContentView: View {
  enum Tabs: String, CaseIterable, Identifiable {
    var id: String { rawValue }
    case all
    case saved
    case deleted
  }
  @State personal var selectedTab: Tabs = .all
  var physique: some View {
    NavigationView {
      TabView(choice: $selectedTab) {
        Listing {
          ForEach(0..<10) { index in
            Textual content("Merchandise quantity: (index)")
          }
        }
        .tag(Tabs.all)
        Listing {
          ForEach(20..<30) { index in
            Textual content("Merchandise quantity: (index)")
          }
        }
        .tag(Tabs.saved)
        Listing {
          ForEach(30..<40) { index in
            Textual content("Merchandise quantity: (index)")
          }
        }
        .tag(Tabs.deleted)
      }
      .tabViewStyle(.web page(indexDisplayMode: .by no means))
      .navigationTitle("My objects")
      .navigationViewStyle(.stack)
      .toolbar {
        ToolbarItem(placement: .principal) {
          Picker("", choice: $selectedTab) {
            ForEach(Tabs.allCases) { tab in
              Textual content(tab.rawValue.capitalized)
                .tag(tab)
            }
          }
          .pickerStyle(.segmented)
          .body(width: 300, peak: 40)
        }
      }
    }
  }
}

Which produces this: