Reputation: 103
When adding a NavigationLink in SwiftUI the destination is presented twice, ex: I tap on the NavigationLink and it pushes my destination but when I dismiss the destination, via the back button or the swipe gesture it pushes the destination again without taping on the link. Here is the part of my code that handles the link:
var body: some View {
HStack(spacing: 8.0) {
ForEach(part.getReference()) { (imageRef: ReferenceImage) in
ZStack(alignment: .topTrailing) {
Image(uiImage: imageRef.getUIImage())
.resizable()
.frame(width: 90, height: 90)
.cornerRadius(6)
.onLongPressGesture {
print("looong")
self.managedObjectContext.delete(imageRef)
do {
try self.managedObjectContext.save()
} catch {
print("error deleting: \(error.localizedDescription)")
}
}
ZStack(alignment: .center) {
Circle()
.foregroundColor(Color.appColors.lightRose)
.opacity(0.7)
.frame(width: 35, height: 35)
Image(systemName: "arkit")
.imageScale(.large)
}
NavigationLink(destination:
ZStack {
Color.appColors.rose
.edgesIgnoringSafeArea(.top)
ReferenceARSwiftUIView(currentImage: imageRef.getUIImage())
.navigationBarTitle("AR Reference")
}
) {
EmptyView()
.frame(width: 90, height: 90)
}
}
}.animation(.interpolatingSpring(stiffness: 0.5, damping: 0.5))
EDIT 01: As suggested I removed a bit of the noise in the code:
var part: Part
var body: some View {
HStack(spacing: 8.0) {
ForEach(part.getReference()) { (imageRef: ReferenceImage) in
ZStack(alignment: .topTrailing) {
Image(uiImage: imageRef.getUIImage())
.resizable()
.frame(width: 90, height: 90)
.cornerRadius(6)
NavigationLink(destination: ReferenceARSwiftUIView(currentImage: imageRef.getUIImage())) {
EmptyView()
.frame(width: 90, height: 90)
}
}
}.animation(.interpolatingSpring(stiffness: 0.5, damping: 0.5))
EDIT 02: I think I narrowed down, basically if I remove the ForEach the NavigationLink pushes correctly to the next View. Also depending on the number of itens I have on my array for the ForEach the number of pushes is the same.
Upvotes: 10
Views: 8111
Reputation: 333
Yeah changing List
to ScrollView
helped me in a similar situation.
ScrollView {
if !usersViewModel.isLoading {
ForEach(self.usersViewModel.users, id: \.id) { user in
NavigationLink(destination: UserDashboardView(showDashboardDetail: $showDashboardDetail, user: user)) {
VStack(alignment: .leading) {
NetworkCardView(user: user)
}
.frame(width: screen.size.width - 60, height: 250)
.padding(.top)
}
}
.listRowBackground(AppColor())
}
}
Upvotes: 1
Reputation: 711
I solved this by setting the NavigationLink's tag to the unique id of the model item.
Assuming you have an id for your imageRef, ReferenceImage class.
var part: Part
var body: some View {
HStack(spacing: 8.0) {
ForEach(part.getReference()) { (imageRef: ReferenceImage) in
ZStack(alignment: .topTrailing) {
Image(uiImage: imageRef.getUIImage())
.resizable()
.frame(width: 90, height: 90)
.cornerRadius(6)
NavigationLink(destination: ReferenceARSwiftUIView(currentImage: imageRef.getUIImage()), tag: imageRef.id) {
EmptyView()
.frame(width: 90, height: 90)
}
}
}.animation(.interpolatingSpring(stiffness: 0.5, damping: 0.5))
NavigationLink(destination: ReferenceARSwiftUIView(currentImage: imageRef.getUIImage()), tag: imageRef.id)
Upvotes: 6
Reputation: 1504
I'm sure that Part
conforms to Identifiable
protocol and has id
property.
The destination of the NavigationLink
is presented multiple times because you have multiple instances of Part
that have the exact same identity id
in the forEach
loop.
Just make sure that each instance of Part
has a unique id
and everything will work as expected.
Upvotes: 11
Reputation: 14378
I wasn't able to reproduce your issue, because even the stripped down version contains types declared by you, but not included in the question.
A couple of things:
If you want to use NavigationLink
, the view needs to be embeded in a NavigationView
.
If you are using ForEach
inside an HStack
there is a chance you are going to run out of space to display all the elements, so it would be a good idea to wrap it in a ScrollView
.
Last, but not least: inside ForEach
you have to make NavigationLink
your top level view and make any other views its content:
var body: some View {
NavigationView {
ScrollView(.horizontal) {
HStack {
ForEach(part.getReference()) { (imageRef: ReferenceImage) in
NavigationLink(destination: ReferenceARSwiftUIView(currentImage: imageRef.getUIImage())) {
Image(uiImage: imageRef.getUIImage())
.resizable()
.frame(width: 90, height: 90)
.cornerRadius(6)
}
}
}
}
}
}
Upvotes: 0