cleanup, docs, animation splitting

Author: gh123man

Diff for: Examples/ContentView.swift

@@ -49,14 +49,14 @@ struct ContentView: View {
 struct DetailsView: View {
     @State var refreshed = 0
     var style: Style
-    var useImage = true
+    @State var useImage = true
     var body: some View {
         ScrollView {
             VStack {
                 if useImage {
                     Image("photo")
                         .resizable()
-                        .aspectRatio(contentMode: .fit)
+                        .aspectRatio(contentMode: .fill)
                 }
                 Text("Details!")
                 Text("Refreshed: \(refreshed)")
@@ -113,7 +113,7 @@ struct DetailsCustom: View {
             }
         }
         .refresher(refreshView: EmojiRefreshView.init ) { done in
-            DispatchQueue.main.asyncAfter(deadline: .now() + .seconds(2)) {
+            DispatchQueue.main.asyncAfter(deadline: .now() + .milliseconds(1500)) {
                 refreshed += 1
                 done()
             }
@@ -124,23 +124,19 @@ struct DetailsCustom: View {
 
 public struct EmojiRefreshView: View {
     @Binding var state: RefresherState
-    @State var angle: Double = 0.0
-    @State var isAnimating = false
+    @State private var angle: Double = 0.0
+    @State private var isAnimating = false
 
     var foreverAnimation: Animation {
         Animation.linear(duration: 1.0)
             .repeatForever(autoreverses: false)
     }
 
-    public init(state: Binding<RefresherState>) {
-        self._state = state
-    }
-    
     public var body: some View {
         VStack {
             switch state.mode {
             case .notRefreshing:
-                Text("😂")
+                Text("🤪")
                     .onAppear {
                         isAnimating = false
                     }

Diff for: README.md

@@ -68,23 +68,19 @@ Refresher can take a custom spinner view. Your custom view will get a binding in
 ```swift
 public struct EmojiRefreshView: View {
     @Binding var state: RefresherState
-    @State var angle: Double = 0.0
-    @State var isAnimating = false
+    @State private var angle: Double = 0.0
+    @State private var isAnimating = false
 
     var foreverAnimation: Animation {
         Animation.linear(duration: 1.0)
             .repeatForever(autoreverses: false)
     }
 
-    public init(state: Binding<RefresherState>) {
-        self._state = state
-    }
-    
     public var body: some View {
         VStack {
             switch state.mode {
             case .notRefreshing:
-                Text("😂")
+                Text("🤪")
                     .onAppear {
                         isAnimating = false
                     }

Diff for: Sources/Refresher/RefreshSpinner.swift

@@ -46,7 +46,8 @@ public struct SystemStyleRefreshSpinner<RefreshView: View>: View {
                 refreshView
                     .frame(maxWidth: .infinity)
                     .position(x: geometry.size.width / 2, y: -position + refreshHoldPoint)
-                    .opacity(state.mode == .refreshing ? 1 : normalize(from: opacityClipPoint, to: 1, by: state.dragPosition))
+                    .opacity(state.modeAnimated == .refreshing ? 1 : normalize(from: opacityClipPoint, to: 1, by: state.dragPosition))
+                    .animation(.easeInOut(duration: 0.2), value: state.modeAnimated == .notRefreshing)
             }
         }
     }

Diff for: Sources/Refresher/Refresher.swift

@@ -4,8 +4,14 @@ import SwiftUI
 public typealias RefreshAction = (_ completion: @escaping () -> ()) -> ()
 
 public enum Style {
+    
+    /// Spinner pulls down and centers on a padding view above the scrollview
     case `default`
+    
+    /// Mimic the system refresh controller as close as possible
     case system
+    
+    /// Overlay the spinner onto the cotained view - good for static images
     case overlay
 }
 
@@ -16,8 +22,17 @@ public enum RefreshMode {
 }
 
 public struct RefresherState {
+    
+    /// Updated without animation - NOTE: Both modes are always updated in sequence (this one is first)
     public var mode: RefreshMode = .notRefreshing
+    
+    /// Updated with animation (this one is second)
+    public var modeAnimated: RefreshMode = .notRefreshing
+    
+    /// Value from 0 - 1. 0 is resting state, 1 is refresh trigger point - use this value for custom translations
     public var dragPosition: CGFloat = 0
+    
+    /// the configuration style - useful if you want your custom spinner to change behavior based on the style
     public var style: Style = .default
 }
 
@@ -57,7 +72,7 @@ public struct RefreshableScrollView<Content: View, RefreshView: View>: View {
     private var refreshBanner: AnyView? {
         switch state.style {
         case .default, .system:
-            if case .refreshing = state.mode {
+            if case .refreshing = state.modeAnimated {
                 return AnyView(Color.clear.frame(height: headerShimMaxHeight * (1 - state.dragPosition)))
             }
         case .overlay:
@@ -69,7 +84,7 @@ public struct RefreshableScrollView<Content: View, RefreshView: View>: View {
 
     private var refershSpinner: AnyView? {
         return state.style == .default || state.style == .overlay
-            ? AnyView(RefreshSpinnerView(mode: state.mode,
+            ? AnyView(RefreshSpinnerView(mode: state.modeAnimated,
                                          stopPoint: spinnerStopPoint,
                                          refreshHoldPoint: headerShimMaxHeight / 2,
                                          refreshView: refreshView($state),
@@ -134,25 +149,30 @@ public struct RefreshableScrollView<Content: View, RefreshView: View>: View {
         if !canRefresh { return }
 
         guard distance > 0 else {
-            state.mode = .notRefreshing
+            set(mode: .notRefreshing)
             return
         }
 
         if distance >= refreshAt {
             UIImpactFeedbackGenerator(style: .medium).impactOccurred()
-            state.mode = .refreshing
+            set(mode: .refreshing)
             canRefresh = false
 
             refreshAction {
                 DispatchQueue.main.asyncAfter(deadline: .now() + .milliseconds(300)) {
-                    withAnimation {
-                        state.mode = .notRefreshing
-                    }
+                    set(mode: .notRefreshing)
                 }
             }
 
         } else if distance > 0 {
-            state.mode = .pulling
+            set(mode: .pulling)
+        }
+    }
+    
+    func set(mode: RefreshMode) {
+        state.mode = mode
+        withAnimation {
+            state.modeAnimated = mode
         }
     }
 }