The picture flickers when swiping when I use NavigationLink. (Section One) I solved the image flickers problem. I used a different NavigationLink function. (Section Two) the problems don't stop there. When the navigation is running, the image shifts to the left while switching to the next page. (Section 3)
video link here
MovieCell
struct MovieCell: View {
var width = UIScreen.main.bounds.width
var height = UIScreen.main.bounds.height
var movie: Movie
@Binding var isOpeningDetailView: Bool
var body: some View {
GeometryReader { geometryReader in
Image(movie.poster)
.resizable()
.frame(width: width, height: height * 0.75)
.offset(x: -geometryReader.frame(in: .global).minX)
}
.frame(height: height * 0.75)
.cornerRadius(15)
.padding(10)
.background(Blur())
.cornerRadius(15)
// .edgesIgnoringSafeArea(.all)
}
}
MainView
Section One
NavigationView {
ZStack {
Image(selected.poster)
.resizable()
.overlay(Blur().edgesIgnoringSafeArea(.all))
.edgesIgnoringSafeArea(.all)
VStack {
TabView(selection: $selected) {
ForEach(movieList, id: \.self) { item in
NavigationLink(
destination: DetailView(),
label: {
MovieCell(movie: item, isOpeningDetailView: $isOpeneningDetailView)
})
}
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
.indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))
}
}
.navigationTitle("")
.navigationBarHidden(true)
}
Section Two
TabView(selection: $selected) {
ForEach(movieList, id: \.self) { item in
ZStack {
MovieCell(movie: item, isOpeningDetailView: $isOpeneningDetailView)
NavigationLink("", destination: DetailView(), isActive: $isOpeneningDetailView)
}
.onTapGesture {
withAnimation {
self.isOpeneningDetailView = true
}
}
}
}
Section Three
Normal
image link here
When I Swipe
image link here
the problem is here.
While navigating - the value is changing rapidly. When I remove the minus sign, the picture fits in its original place
In GeometryReader
.offset(x: (-)geometryReader.frame(in: .global).minX)//I deleted - negative sign
This is what I see instantly while navigating
