💫 Update: Exp - AdaptiveModal

Summary: Update experiment/test - `swift-programmatic-modal/AdaptiveModal`.
dominicstop · Jun 5, 2023 · 9afde4e · 9afde4e
1 parent 61b4ed4
commit 9afde4e
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 95 deletions.
diff --git a/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalInterpolationPoint.swift b/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalInterpolationPoint.swift
@@ -65,10 +65,6 @@ struct AdaptiveModalInterpolationPoint: Equatable {
       .init(scaleX: self.modalScaleX, y: self.modalScaleY)
     );
 
-    transforms.append(
-      .init(translationX: self.modalTranslateX, y: self.modalTranslateY)
-    );
-
     return transforms;
   };
 
@@ -221,7 +217,6 @@ struct AdaptiveModalInterpolationPoint: Equatable {
 
   func apply(toModalView modalView: UIView){
     modalView.frame = self.computedRect;
-    modalView.transform = self.getModalTransform(shouldApplyTranslate: false);
 
     modalView.layer.cornerRadius = self.modalCornerRadius;
     modalView.layer.maskedCorners = self.modalMaskedCorners;

diff --git a/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalManager.swift b/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalManager.swift
@@ -45,8 +45,10 @@ class AdaptiveModalManager {
 
   var nextSnapPointIndex: Int?;
 
-  var backgroundVisualEffectAnimator: AdaptiveModalPropertyAnimator?;
-  var modalBackgroundVisualEffectAnimator: AdaptiveModalPropertyAnimator?;
+  var modalTransformAnimator: AdaptiveModalKeyframePropertyAnimator?;
+
+  var backgroundVisualEffectAnimator: AdaptiveModalRangePropertyAnimator?;
+  var modalBackgroundVisualEffectAnimator: AdaptiveModalRangePropertyAnimator?;
 
   // MARK: -  Properties
   // -------------------
@@ -447,73 +449,6 @@ class AdaptiveModalManager {
     );
   };
 
-  func interpolateModalTransform(
-    forInputPercentValue inputPercentValue: CGFloat,
-    rangeInput: [CGFloat]? = nil,
-    rangeOutput: [AdaptiveModalInterpolationPoint]? = nil
-  ) -> CGAffineTransform? {
-
-    guard let interpolationSteps      = rangeOutput ?? self.interpolationStepsSorted,
-          let interpolationRangeInput = rangeInput  ?? self.interpolationRangeInput
-    else { return nil };
-
-    let clampConfig = modalConfig.interpolationClampingConfig;
-
-    let nextModalRotation = Self.interpolate(
-      inputValue: inputPercentValue,
-      rangeInput: interpolationRangeInput,
-      rangeOutput: interpolationSteps.map {
-        $0.modalRotation
-      },
-      shouldClampMin: clampConfig.shouldClampModalInitRotation,
-      shouldClampMax: clampConfig.shouldClampModalLastRotation
-    );
-
-    let nextScaleX = Self.interpolate(
-      inputValue: inputPercentValue,
-      rangeInput: interpolationRangeInput,
-      rangeOutput: interpolationSteps.map {
-        $0.modalScaleX;
-      },
-      shouldClampMin: clampConfig.shouldClampModalLastScaleX,
-      shouldClampMax: clampConfig.shouldClampModalLastScaleX
-    );
-
-    let nextScaleY = Self.interpolate(
-      inputValue: inputPercentValue,
-      rangeInput: interpolationRangeInput,
-      rangeOutput: interpolationSteps.map {
-        $0.modalScaleY
-      },
-      shouldClampMin: clampConfig.shouldClampModalLastScaleY,
-      shouldClampMax: clampConfig.shouldClampModalLastScaleY
-    );
-
-    let nextTransform: CGAffineTransform = {
-      var transforms: [CGAffineTransform] = [];
-
-      if let rotation = nextModalRotation {
-        transforms.append(
-          .init(rotationAngle: rotation)
-        );
-      };
-
-      if let nextScaleX = nextScaleX,
-         let nextScaleY = nextScaleY {
-
-        transforms.append(
-          .init(scaleX: nextScaleX, y: nextScaleY)
-        );
-      };
-
-      return transforms.reduce(.identity) {
-        $0.concatenating($1);
-      };
-    }();
-
-    return nextTransform;
-  };
-
   func interpolateModalBackgroundOpacity(
     forInputPercentValue inputPercentValue: CGFloat,
     rangeInput: [CGFloat]? = nil,
@@ -575,11 +510,41 @@ class AdaptiveModalManager {
     );
   };
 
+  func applyInterpolationToModalTransform(
+    forInputPercentValue inputPercentValue: CGFloat
+  ) {
+
+    let animator: AdaptiveModalKeyframePropertyAnimator? = {
+      if let modalTransformAnimator = self.modalTransformAnimator {
+        return modalTransformAnimator;
+      };
+
+      guard let interpolationSteps = self.interpolationStepsSorted,
+            let modalView = self.modalView
+      else { return nil };
+
+      return .init(
+        interpolationPoints: interpolationSteps,
+        forComponent: modalView
+      ) {
+        $0.transform = $1.modalTransform;
+      };
+    }();
+
+    self.modalTransformAnimator = animator;
+    animator?.setFractionComplete(forPercent: inputPercentValue);
+
+    print(
+        "applyInterpolationToModalTransform"
+      + " - inputPercentValue: \(inputPercentValue)"
+    );
+  };
+
   func applyInterpolationToModalBackgroundVisualEffect(
     forInputPercentValue inputPercentValue: CGFloat
   ) {
 
-    let animator: AdaptiveModalPropertyAnimator? = {
+    let animator: AdaptiveModalRangePropertyAnimator? = {
       let interpolationRange = self.getInterpolationStepRange(
         forInputPercentValue: inputPercentValue
       );
@@ -603,7 +568,7 @@ class AdaptiveModalManager {
 
       visualEffectView.effect = nil;
 
-      return AdaptiveModalPropertyAnimator(
+      return AdaptiveModalRangePropertyAnimator(
         interpolationRangeStart: interpolationRange.rangeStart,
         interpolationRangeEnd: interpolationRange.rangeEnd,
         forComponent: visualEffectView,
@@ -623,7 +588,7 @@ class AdaptiveModalManager {
     forInputPercentValue inputPercentValue: CGFloat
   ) {
 
-    let animator: AdaptiveModalPropertyAnimator? = {
+    let animator: AdaptiveModalRangePropertyAnimator? = {
       let interpolationRange = self.getInterpolationStepRange(
         forInputPercentValue: inputPercentValue
       );
@@ -647,7 +612,7 @@ class AdaptiveModalManager {
 
       visualEffectView.effect = nil;
 
-      return AdaptiveModalPropertyAnimator(
+      return AdaptiveModalRangePropertyAnimator(
         interpolationRangeStart: interpolationRange.rangeStart,
         interpolationRangeEnd: interpolationRange.rangeEnd,
         forComponent: visualEffectView,
@@ -674,12 +639,6 @@ class AdaptiveModalManager {
       self.modalFrame = nextModalRect;
     };
 
-    if let nextModalTransform = self.interpolateModalTransform(
-      forInputPercentValue: inputPercentValue
-    ) {
-      //modalView.transform = nextModalTransform;
-    };
-
     if let nextModalRadius = self.interpolateModalBorderRadius(
       forInputPercentValue: inputPercentValue,
       modalBounds: modalView.bounds
@@ -710,6 +669,10 @@ class AdaptiveModalManager {
     self.applyInterpolationToModalBackgroundVisualEffect(
       forInputPercentValue: inputPercentValue
     );
+
+    self.applyInterpolationToModalTransform(
+      forInputPercentValue: inputPercentValue
+    );
   };
 
   func applyInterpolationToModal(forPoint point: CGPoint){

diff --git a/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalRangePropertyAnimator.swift b/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalRangePropertyAnimator.swift
@@ -7,6 +7,7 @@
 
 import UIKit
 
+
 struct AdaptiveModalRangePropertyAnimator {
 
   var interpolationRangeStart: AdaptiveModalInterpolationPoint;
@@ -24,7 +25,7 @@ struct AdaptiveModalRangePropertyAnimator {
     self.interpolationRangeEnd
   ]};
 
-  init<T: AnyObject>(
+  init<T: UIView>(
     interpolationRangeStart: AdaptiveModalInterpolationPoint,
     interpolationRangeEnd: AdaptiveModalInterpolationPoint,
     forComponent component: T,
@@ -50,7 +51,6 @@ struct AdaptiveModalRangePropertyAnimator {
       animation(component, interpolationRangeEnd);
     };
 
-
     self.animator = animator;
   };
 

diff --git a/experiments/swift-programmatic-modal/Test/RNIDraggableTestViewController.swift b/experiments/swift-programmatic-modal/Test/RNIDraggableTestViewController.swift
@@ -35,7 +35,7 @@ enum AdaptiveModalConfigTestPresets: CaseIterable {
               )
             ),
             animationKeyframe: AdaptiveModalAnimationConfig(
-              modalRotation: 0,
+              modalRotation: -0.2,
               modalScaleX: 1,
               modalScaleY: 1,
               modalTranslateX: 0,
@@ -59,8 +59,8 @@ enum AdaptiveModalConfigTestPresets: CaseIterable {
               modalRotation: 0.1,
               modalScaleX: 0.5,
               modalScaleY: 1,
-              modalTranslateX: 500,
-              modalTranslateY: 500
+              modalTranslateX: 0,
+              modalTranslateY: 0
             )
           ),
           // snap point - 2
@@ -76,10 +76,10 @@ enum AdaptiveModalConfigTestPresets: CaseIterable {
               )
             ),
             animationKeyframe: AdaptiveModalAnimationConfig(
-              modalRotation: -0.1,
+              modalRotation: 1,
               modalScaleX: 1,
               modalScaleY: 1,
-              modalTranslateX: -600,
+              modalTranslateX: 0,
               modalTranslateY: 0
             )
           ),

diff --git a/experiments/swift-programmatic-modal/swift-programmatic-modal.xcodeproj/project.pbxproj b/experiments/swift-programmatic-modal/swift-programmatic-modal.xcodeproj/project.pbxproj
@@ -15,9 +15,10 @@
 		88B7D0F829C593F600490628 /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 88B7D0F729C593F600490628 /* Assets.xcassets */; };
 		88B7D0FB29C593F600490628 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 88B7D0F929C593F600490628 /* LaunchScreen.storyboard */; };
 		88C2F45C2A275B2800DA7450 /* AdaptiveModalSnapPointPreset.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F45B2A275B2800DA7450 /* AdaptiveModalSnapPointPreset.swift */; };
-		88C2F45E2A278A9200DA7450 /* AdaptiveModalPropertyAnimator.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F45D2A278A9200DA7450 /* AdaptiveModalPropertyAnimator.swift */; };
+		88C2F45E2A278A9200DA7450 /* AdaptiveModalRangePropertyAnimator.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F45D2A278A9200DA7450 /* AdaptiveModalRangePropertyAnimator.swift */; };
 		88C2F4602A2CA8CF00DA7450 /* RoundedViewTestViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F45F2A2CA8CF00DA7450 /* RoundedViewTestViewController.swift */; };
 		88C2F4622A2CD81F00DA7450 /* AdaptiveModalEventNotifiable.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F4612A2CD81F00DA7450 /* AdaptiveModalEventNotifiable.swift */; };
+		88C2F4642A2D8D3400DA7450 /* AdaptiveModalKeyframePropertyAnimator.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88C2F4632A2D8D3400DA7450 /* AdaptiveModalKeyframePropertyAnimator.swift */; };
 		88D016602A14C86B004664D2 /* RootViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88D0165F2A14C86B004664D2 /* RootViewController.swift */; };
 		88D0168D2A1730B1004664D2 /* RNILayoutTestViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88D0168C2A1730B1004664D2 /* RNILayoutTestViewController.swift */; };
 		88D0169E2A1B0DD3004664D2 /* RNIDraggableTestViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 88D0169D2A1B0DD3004664D2 /* RNIDraggableTestViewController.swift */; };
@@ -104,9 +105,10 @@
 		88B7D0FA29C593F600490628 /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
 		88B7D0FC29C593F600490628 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		88C2F45B2A275B2800DA7450 /* AdaptiveModalSnapPointPreset.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AdaptiveModalSnapPointPreset.swift; sourceTree = "<group>"; };
-		88C2F45D2A278A9200DA7450 /* AdaptiveModalPropertyAnimator.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AdaptiveModalPropertyAnimator.swift; sourceTree = "<group>"; };
+		88C2F45D2A278A9200DA7450 /* AdaptiveModalRangePropertyAnimator.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AdaptiveModalRangePropertyAnimator.swift; sourceTree = "<group>"; };
 		88C2F45F2A2CA8CF00DA7450 /* RoundedViewTestViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RoundedViewTestViewController.swift; sourceTree = "<group>"; };
 		88C2F4612A2CD81F00DA7450 /* AdaptiveModalEventNotifiable.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AdaptiveModalEventNotifiable.swift; sourceTree = "<group>"; };
+		88C2F4632A2D8D3400DA7450 /* AdaptiveModalKeyframePropertyAnimator.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AdaptiveModalKeyframePropertyAnimator.swift; sourceTree = "<group>"; };
 		88D0165F2A14C86B004664D2 /* RootViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RootViewController.swift; sourceTree = "<group>"; };
 		88D0168C2A1730B1004664D2 /* RNILayoutTestViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RNILayoutTestViewController.swift; sourceTree = "<group>"; };
 		88D0169D2A1B0DD3004664D2 /* RNIDraggableTestViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RNIDraggableTestViewController.swift; sourceTree = "<group>"; };
@@ -522,10 +524,11 @@
 				88E8C0192A228289008C2FF8 /* AdaptiveModalClampingConfig.swift */,
 				88D018872A1D0A36004664D2 /* AdaptiveModalConfig.swift */,
 				880492572A23F89000D74E9F /* AdaptiveModalInterpolationPoint.swift */,
-				88C2F45D2A278A9200DA7450 /* AdaptiveModalPropertyAnimator.swift */,
+				88C2F45D2A278A9200DA7450 /* AdaptiveModalRangePropertyAnimator.swift */,
 				88D0188D2A1DCA61004664D2 /* AdaptiveModalManager.swift */,
 				88075E262A2121FE00B78388 /* AdaptiveModalManager+Helpers.swift */,
 				88C2F4612A2CD81F00DA7450 /* AdaptiveModalEventNotifiable.swift */,
+				88C2F4632A2D8D3400DA7450 /* AdaptiveModalKeyframePropertyAnimator.swift */,
 			);
 			path = AdaptiveModal;
 			sourceTree = "<group>";
@@ -604,6 +607,7 @@
 				88D0186A2A1B3030004664D2 /* RNIModalData.swift in Sources */,
 				88D0185D2A1B3030004664D2 /* RNIIdentifiable.swift in Sources */,
 				88D0169E2A1B0DD3004664D2 /* RNIDraggableTestViewController.swift in Sources */,
+				88C2F4642A2D8D3400DA7450 /* AdaptiveModalKeyframePropertyAnimator.swift in Sources */,
 				88D018452A1B3030004664D2 /* RNIDictionarySynthesizable.swift in Sources */,
 				88D018232A1B3030004664D2 /* RNINavigationEventsReportingViewController.swift in Sources */,
 				88D018822A1D09DD004664D2 /* AdaptiveModalAnimationConfig.swift in Sources */,
@@ -667,7 +671,7 @@
 				88E8C0182A224A8D008C2FF8 /* AdaptiveModalSnapAnimationConfig.swift in Sources */,
 				88D018562A1B3030004664D2 /* RNIWeakDictionary.swift in Sources */,
 				88203DC12A122AC20088C8E2 /* RNIDynamicModal.swift in Sources */,
-				88C2F45E2A278A9200DA7450 /* AdaptiveModalPropertyAnimator.swift in Sources */,
+				88C2F45E2A278A9200DA7450 /* AdaptiveModalRangePropertyAnimator.swift in Sources */,
 				88D018542A1B3030004664D2 /* RNIWeakArray.swift in Sources */,
 				88D018792A1B3030004664D2 /* RNIComputableValueMode.swift in Sources */,
 				88D018212A1B3030004664D2 /* CAGradientLayerType+Init.swift in Sources */,