SwiftUI: Kingfisher KFImage flashing images within LazyHStack

1.1k views Asked by At

KFImage within LazyHStask flashes image while dragging the view in spite of I set loadDiskFileSynchronously() to the view.

I suspect that KFImage loads image every time its onAppear() called, and it makes image flashing. But it seems that KFImage preventing waste reloading image inside its onAppear(). https://github.com/onevcat/Kingfisher/blob/e30efd82368276664b9ffb8a10dc29cd6a6810da/Sources/SwiftUI/KFImageRenderer.swift#L75

How can I fix this?

This is sample snippet reproducing the problem.

struct SampleView : View {

    let urls: [URL?]

    @GestureState private var draggingOffset: CGFloat = 0
    @State private var index: Int = 0

    init(urls: [URL?]) {
        self.urls = urls
    }

    var body: some View {
        LazyHStack(spacing: 0) {
            ForEach(urls.indices, id: \.self) { position in
                KFImage(urls[position])
                    .resizable()
                    .loadDiskFileSynchronously()
                    .frame(width: UIScreen.main.bounds.width, alignment: .center)
                    .scaledToFit()
            }
        }
            .frame(width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height, alignment: .leading)
            .offset(x: -CGFloat(index) * UIScreen.main.bounds.width)
            .offset(x: draggingOffset)
            .animation(.interactiveSpring(), value: index)
            .animation(.interactiveSpring(), value: draggingOffset)
            .gesture(
                DragGesture()
                    .updating($draggingOffset) { value, state, _ in
                        state = value.translation.width
                    }
                    .onEnded { value in
                        let offset = value.translation.width / UIScreen.main.bounds.width
                        let newIndex = (CGFloat(index) - offset).rounded()
                        index = min(max(Int(newIndex), 0), urls.count - 1)
                    }
            )
    }
}

flashing images(gif)

0

There are 0 answers