Merge pull request #1830 from onevcat/fix/force-transition-kfimage

Load image when appear when need force transition

Demo/Demo/Kingfisher-Demo/SwiftUIViews/SingleViewDemo.swift

@@ -32,6 +32,7 @@ struct SingleViewDemo : View {
 
     @State private var index = 1
     @State private var blackWhite = false
+    @State private var forceTransition = true
 
     var url: URL {
         URL(string: "https://raw.githubusercontent.com/onevcat/Kingfisher-TestImages/master/DemoAppImage/Loading/kingfisher-\(self.index).jpg")!
@@ -52,7 +53,7 @@ struct SingleViewDemo : View {
                     ProgressView(progress)
                 }
                 .fade(duration: index == 1 ? 0 : 1) // Do not animate for the first image. Otherwise it causes an unwanted animation when the page is shown.
-                .forceTransition()
+                .forceTransition(forceTransition)
                 .resizable()
                 .frame(width: 300, height: 300)
                 .cornerRadius(20)
@@ -65,6 +66,8 @@ struct SingleViewDemo : View {
             Button(action: {
                 self.blackWhite.toggle()
             }) { Text("Black & White") }
+            Toggle("Force Transition?", isOn: $forceTransition)
+                .frame(width: 300)
 
         }.navigationBarTitle(Text("Basic Image"), displayMode: .inline)
     }

Sources/SwiftUI/KFImageRenderer.swift

@@ -37,7 +37,10 @@ struct KFImageRenderer<HoldingView> : View where HoldingView: KFImageHoldingView
     let context: KFImage.Context<HoldingView>
     
     var body: some View {
-        binder.start(context: context)
+        if !context.options.forceTransition {
+            binder.start(context: context)
+        }
+        
         return ZStack {
             context.configurations
                 .reduce(HoldingView.created(from: binder.loadedImage, context: context)) {
@@ -52,6 +55,12 @@ struct KFImageRenderer<HoldingView> : View where HoldingView: KFImageHoldingView
                         Color.clear
                     }
                 }
+                .onAppear { [weak binder = self.binder] in
+                    guard let binder = binder else {
+                        return
+                    }
+                    binder.start(context: context)
+                }
                 .onDisappear { [weak binder = self.binder] in
                     guard let binder = binder else {
                         return