💫 Update: Exp - AdaptiveModal

Summary: Update experiment/test - `swift-programmatic-modal/AdaptiveModal`.
dominicstop · Jun 16, 2023 · fe35017 · fe35017
1 parent 6a07637
commit fe35017
Show file tree

Hide file tree

Showing 5 changed files with 339 additions and 105 deletions.
diff --git a/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalAnimationConfig.swift b/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalAnimationConfig.swift
@@ -9,31 +9,39 @@ import UIKit
 
 
 struct AdaptiveModalAnimationConfig {
-  let modalRotation: CGFloat?;
+  var modalRotation: CGFloat?;
 
-  let modalScaleX: CGFloat?;
-  let modalScaleY: CGFloat?;
+  var modalScaleX: CGFloat?;
+  var modalScaleY: CGFloat?;
 
-  let modalTranslateX: CGFloat?;
-  let modalTranslateY: CGFloat?;
+  var modalTranslateX: CGFloat?;
+  var modalTranslateY: CGFloat?;
 
-  let modalOpacity: CGFloat?;
-  let modalBackgroundColor: UIColor?;
-  let modalBackgroundOpacity: CGFloat?;
+  var modalOpacity: CGFloat?;
+  var modalBackgroundColor: UIColor?;
+  var modalBackgroundOpacity: CGFloat?;
 
-  let modalCornerRadius: CGFloat?;
-  let modalMaskedCorners: CACornerMask?;
+  var modalBorderWidth: CGFloat?;
+  var modalBorderColor: UIColor?;
 
-  let modalBackgroundVisualEffect: UIVisualEffect?;
-  let modalBackgroundVisualEffectOpacity: CGFloat?;
-  let modalBackgroundVisualEffectIntensity: CGFloat?;
+  var modalShadowColor: UIColor?;
+  var modalShadowOffset: CGSize?;
+  var modalShadowOpacity: CGFloat?;
+  var modalShadowRadius: CGFloat?;
 
-  let backgroundColor: UIColor?;
-  let backgroundOpacity: CGFloat?;
+  var modalCornerRadius: CGFloat?;
+  var modalMaskedCorners: CACornerMask?;
 
-  let backgroundVisualEffect: UIVisualEffect?;
-  let backgroundVisualEffectOpacity: CGFloat?;
-  let backgroundVisualEffectIntensity: CGFloat?;
+  var modalBackgroundVisualEffect: UIVisualEffect?;
+  var modalBackgroundVisualEffectOpacity: CGFloat?;
+  var modalBackgroundVisualEffectIntensity: CGFloat?;
+
+  var backgroundColor: UIColor?;
+  var backgroundOpacity: CGFloat?;
+
+  var backgroundVisualEffect: UIVisualEffect?;
+  var backgroundVisualEffectOpacity: CGFloat?;
+  var backgroundVisualEffectIntensity: CGFloat?;
 
   init(
      modalRotation: CGFloat? = nil,
@@ -44,6 +52,12 @@ struct AdaptiveModalAnimationConfig {
      modalOpacity: CGFloat? = nil,
      modalBackgroundColor: UIColor? = nil,
      modalBackgroundOpacity: CGFloat? = nil,
+     modalBorderWidth: CGFloat? = nil,
+     modalBorderColor: UIColor? = nil,
+     modalShadowColor: UIColor? = nil,
+     modalShadowOffset: CGSize? = nil,
+     modalShadowOpacity: CGFloat? = nil,
+     modalShadowRadius: CGFloat? = nil,
      modalCornerRadius: CGFloat? = nil,
      modalMaskedCorners: CACornerMask? = nil,
      modalBackgroundVisualEffect: UIVisualEffect? = nil,
@@ -67,6 +81,14 @@ struct AdaptiveModalAnimationConfig {
     self.modalBackgroundColor = modalBackgroundColor;
     self.modalBackgroundOpacity = modalBackgroundOpacity;
 
+    self.modalBorderWidth = modalBorderWidth;
+    self.modalBorderColor = modalBorderColor;
+
+    self.modalShadowColor = modalShadowColor;
+    self.modalShadowOffset = modalShadowOffset;
+    self.modalShadowOpacity = modalShadowOpacity;
+    self.modalShadowRadius = modalShadowRadius;
+
     self.modalCornerRadius = modalCornerRadius;
     self.modalMaskedCorners = modalMaskedCorners;
 

diff --git a/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalInterpolationPoint.swift b/experiments/swift-programmatic-modal/AdaptiveModal/AdaptiveModalInterpolationPoint.swift
@@ -9,13 +9,13 @@ import UIKit
 
 struct AdaptiveModalInterpolationPoint: Equatable {
 
-  private static let DefaultMaskedCorners: CACornerMask = [
+  static let DefaultMaskedCorners: CACornerMask = [
     .layerMaxXMinYCorner,
     .layerMinXMinYCorner,
     .layerMaxXMaxYCorner,
     .layerMinXMaxYCorner,
   ];
-
+  
   // MARK: - Properties
   // ------------------
 
@@ -40,6 +40,14 @@ struct AdaptiveModalInterpolationPoint: Equatable {
   var modalBackgroundColor: UIColor;
   var modalBackgroundOpacity: CGFloat;
 
+  var modalBorderWidth: CGFloat;
+  var modalBorderColor: UIColor;
+
+  var modalShadowColor: UIColor;
+  var modalShadowOffset: CGSize;
+  var modalShadowOpacity: CGFloat;
+  var modalShadowRadius: CGFloat;
+
   var modalCornerRadius: CGFloat;
   var modalMaskedCorners: CACornerMask;
 
@@ -81,8 +89,105 @@ struct AdaptiveModalInterpolationPoint: Equatable {
     };
   };
 
-  // MARK: - Init
-  // ------------
+  // MARK: - Functions
+  // -----------------
+
+  func getModalTransform(
+    shouldApplyRotation: Bool = true,
+    shouldApplyScale: Bool = true,
+    shouldApplyTranslate: Bool = true
+  ) -> CGAffineTransform {
+
+    var transforms: [CGAffineTransform] = [];
+
+    if shouldApplyRotation,
+       self.modalRotation != 0 {
+
+      transforms.append(
+        .init(rotationAngle: self.modalRotation)
+      );
+    };
+
+    if shouldApplyScale,
+      self.modalScaleX != 1 && self.modalScaleY != 1 {
+
+      transforms.append(
+        .init(scaleX: self.modalScaleX, y: self.modalScaleY)
+      );
+    };
+
+    if shouldApplyTranslate,
+       self.modalTranslateX != 0 && self.modalTranslateY != 0 {
+
+      transforms.append(
+        .init(translationX: self.modalTranslateX, y: self.modalTranslateY)
+      );
+    };
+
+    if transforms.isEmpty {
+      return .identity;
+    };
+
+    return transforms.reduce(.identity){
+      $0.concatenating($1);
+    };
+  };
+
+  func apply(toModalView modalView: UIView){
+    modalView.alpha = self.modalOpacity;
+
+    modalView.layer.cornerRadius = self.modalCornerRadius;
+    modalView.layer.maskedCorners = self.modalMaskedCorners;
+  };
+
+  func apply(toModalWrapperView modalWrapperView: UIView){
+    modalWrapperView.frame = self.computedRect;
+  };
+
+  func apply(toModalWrapperTransformView view: UIView?){
+    view?.transform = self.modalTransform;
+  };
+
+  func apply(toModalWrapperShadowView view: UIView?){
+    guard let view = view else { return };
+
+    // border
+    view.layer.borderWidth = self.modalBorderWidth;
+    view.layer.borderColor = self.modalBorderColor.cgColor;
+
+    // shadow
+    view.layer.shadowColor = self.modalShadowColor.cgColor;
+    view.layer.shadowOffset = self.modalShadowOffset;
+    view.layer.shadowOpacity = Float(self.modalShadowOpacity);
+    view.layer.shadowRadius = self.modalShadowRadius;
+  };
+
+  func apply(toDummyModalView dummyModalView: UIView){
+    dummyModalView.frame = self.computedRect;
+  };
+
+  func apply(toModalBackgroundView modalBgView: UIView?){
+    modalBgView?.alpha = self.modalBackgroundOpacity;
+    modalBgView?.backgroundColor = self.modalBackgroundColor;
+  };
+
+  func apply(toModalBackgroundEffectView effectView: UIVisualEffectView?){
+    effectView?.alpha = self.modalBackgroundVisualEffectOpacity;
+  };
+
+  func apply(toBackgroundView bgView: UIView?){
+    bgView?.alpha = self.backgroundOpacity;
+  };
+
+  func apply(toBackgroundVisualEffectView effectView: UIView?){
+    effectView?.alpha = self.backgroundVisualEffectOpacity;
+  };
+};
+
+// MARK: - Init
+// ------------
+
+extension AdaptiveModalInterpolationPoint {
 
   init(
     usingModalConfig modalConfig: AdaptiveModalConfig,
@@ -157,6 +262,30 @@ struct AdaptiveModalInterpolationPoint: Equatable {
     self.modalBackgroundOpacity = keyframeCurrent?.modalBackgroundOpacity
       ?? keyframePrev?.modalBackgroundOpacity
       ?? 1;
+
+    self.modalBorderWidth = keyframeCurrent?.modalBorderWidth
+      ?? keyframePrev?.modalBorderWidth
+      ?? 0;
+
+    self.modalBorderColor = keyframeCurrent?.modalBorderColor
+      ?? keyframePrev?.modalBorderColor
+      ?? .black;
+
+    self.modalShadowColor = keyframeCurrent?.modalShadowColor
+      ?? keyframePrev?.modalShadowColor
+      ?? .black;
+
+    self.modalShadowOffset = keyframeCurrent?.modalShadowOffset
+      ?? keyframePrev?.modalShadowOffset
+      ?? .zero;
+
+    self.modalShadowOpacity = keyframeCurrent?.modalShadowOpacity
+      ?? keyframePrev?.modalShadowOpacity
+      ?? 0;
+
+    self.modalShadowRadius = keyframeCurrent?.modalShadowRadius
+      ?? keyframePrev?.modalShadowRadius
+      ?? 0;
 
     self.modalCornerRadius = keyframeCurrent?.modalCornerRadius
       ?? keyframePrev?.modalCornerRadius
@@ -196,88 +325,11 @@ struct AdaptiveModalInterpolationPoint: Equatable {
       ?? keyframePrev?.backgroundVisualEffectIntensity
       ?? (isFirstSnapPoint ? 0 : 1);
   };
-
-  // MARK: - Functions
-  // -----------------
-
-  func getModalTransform(
-    shouldApplyRotation: Bool = true,
-    shouldApplyScale: Bool = true,
-    shouldApplyTranslate: Bool = true
-  ) -> CGAffineTransform {
-
-    var transforms: [CGAffineTransform] = [];
-
-    if shouldApplyRotation,
-       self.modalRotation != 0 {
-
-      transforms.append(
-        .init(rotationAngle: self.modalRotation)
-      );
-    };
-
-    if shouldApplyScale,
-      self.modalScaleX != 1 && self.modalScaleY != 1 {
-
-      transforms.append(
-        .init(scaleX: self.modalScaleX, y: self.modalScaleY)
-      );
-    };
-
-    if shouldApplyTranslate,
-       self.modalTranslateX != 0 && self.modalTranslateY != 0 {
-
-      transforms.append(
-        .init(translationX: self.modalTranslateX, y: self.modalTranslateY)
-      );
-    };
-
-    if transforms.isEmpty {
-      return .identity;
-    };
-
-    return transforms.reduce(.identity){
-      $0.concatenating($1);
-    };
-  };
-
-  func apply(toModalView modalView: UIView){
-    modalView.alpha = self.modalOpacity;
-
-    modalView.layer.cornerRadius = self.modalCornerRadius;
-    modalView.layer.maskedCorners = self.modalMaskedCorners;
-  };
-
-  func apply(toModalWrapperView modalWrapperView: UIView){
-    modalWrapperView.frame = self.computedRect;
-  };
-
-  func apply(toModalWrapperTransformView view: UIView?){
-    view?.transform = self.modalTransform;
-  };
-
-  func apply(toDummyModalView dummyModalView: UIView){
-    dummyModalView.frame = self.computedRect;
-  };
-
-  func apply(toModalBackgroundView modalBgView: UIView?){
-    modalBgView?.alpha = self.modalBackgroundOpacity;
-    modalBgView?.backgroundColor = self.modalBackgroundColor;
-  };
-
-  func apply(toModalBackgroundEffectView effectView: UIVisualEffectView?){
-    effectView?.alpha = self.modalBackgroundVisualEffectOpacity;
-  };
-
-  func apply(toBackgroundView bgView: UIView?){
-    bgView?.alpha = self.backgroundOpacity;
-  };
-
-  func apply(toBackgroundVisualEffectView effectView: UIView?){
-    effectView?.alpha = self.backgroundVisualEffectOpacity;
-  };
 };
 
+// MARK: - Helpers
+// ---------------
+
 extension AdaptiveModalInterpolationPoint {
 
   static func compute(