CODEWITHSUNDEEP
iosswiftlistswiftui
Jeffrey
Jeffrey

Reputation: 658

SwiftUI List looks and behaves differently in Sheet than in NavigationLink

I've created a list view with sections for the user to select from (See LocationPickerModalView.swift), this list is available via a NavigationLink and works as expected. However I decided to move this exact view to a Sheet (See ThrillEditView.swift), but this drastically changed how the view looks and worked. (See Gif below) Would there be a way to get the same behaviour using a Sheet?

// ThrillEditView.swift
public struct ThrillEditView: View {
  @State private var isLocationPickerSheetPresented: Bool = false

  public var body: some View {
    form {
      // ...
      NavigationLink("NavigationLink", destination: LocationPickerModalView())
      Button("Sheet (Via Button)") {
        self.isLocationPickerSheetPresented = true
      }
      // ...
    }
    .sheet(isPresented: self.$isLocationPickerSheetPresented, content: {
      LocationPickerModalView()
    })
  }
}

// LocationPickerModalView.swift
public struct LocationPickerModalView: View {
  public var body: some View {
    List {
      Button("1")
      Button("2")
      Section(header: Text("one")) {
        Button("3")
        Button("4")
      }
      Section(header: Text("two")) {
        Button("5")
        Button("6")
      }
    }
  }
}

Example of the behaviour

Upvotes: 1

Views: 237

Answers (1)

Asperi
Asperi

Reputation: 257693

The .sheet creates new view hierarchy, so you need explicit NavigationView in it, like

.sheet(isPresented: self.$isLocationPickerSheetPresented, content: {
  NavigationView {
     LocationPickerModalView()
  }
})

Upvotes: 1

Related Questions