0

Im trying to create a sticky header and change the background color to a different color once the header yOffset is 0. This is how my code looks like.

struct TestView: View {
    var body: some View {
            ScrollView {
                LazyVStack(spacing: 20, pinnedViews: .sectionHeaders) {
                    Image(systemName: "xmark")
                        .resizable()
                        .scaledToFit()
                        .background(.red)
                    
                    Section {
                        Text("SOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST\n\nSOME REALLY LONG TEST")
                    } header: {
                        Text("Title")
                            .font(.largeTitle.bold())
                            .frame(maxWidth: .infinity)
                            .padding(.top, 40)
                            .padding(.bottom, 20)
                            .background(
                                GeometryReader { reader -> Color in
                                    let minY = reader.frame(in: .global).minY
                                    print("Y +\(minY)")
                                    return minY > 0 ? .white : .blue
                                }
                            )
                    }
                }
            }
            .ignoresSafeArea()
    }
}

Now this works but it causes the background to glitch sometimes. What I mean by this is when I keep scrolling down it sometimes switches back to white. I don't know if I am doing this right. Is there another way to do this without the background glitching?

Luis Ramirez
  • 966
  • 1
  • 8
  • 25

0 Answers0