Home > Back-end >  How to show sheet inside NavigatoinLink?
How to show sheet inside NavigatoinLink?

Time:05-25

I have the following code in SwiftUI that is working, but I want to show the sales page as a sheet, not as a navigation link.

ForEach(modelData.groupedStories(selectedCategory).shuffled()) {
                    item in
                    NavigationLink {
                        if item.paid == false {
                            StoryDetails(story: item)
                        } else {
                            SalesPage()
                        }
                        
                    } label: {
                        GeneralCard(story: item)
                            .foregroundColor(.black)
                    }
                }

I don't know if there is a way to show the sales page as a full cover sheet, that pops from below, with a close button to dismiss, instead of showing in a NavigatioLink

Thanks in advance

CodePudding user response:

I like to make a State var and toggle it to open my sheet like the following using a @State var Open: Bool = false. You will need to wrap the NavigationLink in an if statement.

ForEach(modelData.groupedStories(selectedCategory).shuffled()) { item in
if item.paid == false {
    NavigationLink (destination: {
            StoryDetails(story: item)
     }, label: {
        GeneralCard(story: item)
           .foregroundColor(.black)
           
      }.sheet(isPresented: self.Open){
           SalesView()
      })

    } else {
        self.Open = true
    }
}

You will likely want to wrap your SalesView with another View so you can pass in the State var as a binding var in order to close the sheet.

CodePudding user response:

I solve it changing where I put the sheet and where the navigation link:

ForEach(modelData.groupedStories(selectedCategory).shuffled()) { item in 
 if item.paid == true {
                        GeneralCard(story: item)
                            .onTapGesture{
                                self.Open = true
                            }
                            .sheet(isPresented: self.$Open) {
                                SalesPage()
                            }
                    } else {
                        NavigationLink {
                            StoryDetails(story: item)
                        } label: {
                            GeneralCard(story: item)
                                .foregroundColor(.black)
                        }

                    }
}
  • Related