feat: allow user to set CropView background color via config (#309)

guoyingtao · May 23, 2023 · a54521b · a54521b
1 parent 3882317
commit a54521b
Show file tree

Hide file tree

Showing 9 changed files with 47 additions and 11 deletions.
diff --git a/Example/Base.lproj/Main.storyboard b/Example/Base.lproj/Main.storyboard
@@ -1,9 +1,9 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="20037" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="BYZ-38-t0r">
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="21507" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="BYZ-38-t0r">
     <device id="retina4_7" orientation="portrait" appearance="light"/>
     <dependencies>
         <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="21505"/>
         <capability name="Safe area layout guides" minToolsVersion="9.0"/>
         <capability name="System colors in document resources" minToolsVersion="11.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
@@ -146,7 +146,6 @@
                                                 <state key="normal" title="Dark Background"/>
                                                 <connections>
                                                     <action selector="darkBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="edW-tG-CJq"/>
-                                                    <action selector="noBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="Chc-Ek-cMW"/>
                                                 </connections>
                                             </button>
                                             <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="249" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="FmB-6O-5mY">
@@ -156,16 +155,15 @@
                                                 <state key="normal" title="Light Background"/>
                                                 <connections>
                                                     <action selector="lightBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="K1m-Uc-kdy"/>
-                                                    <action selector="noBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="tYd-3z-IQT"/>
                                                 </connections>
                                             </button>
                                             <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="249" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="system" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="iaH-5e-UFH">
                                                 <rect key="frame" x="207.5" y="0.0" width="98.5" height="29"/>
                                                 <color key="backgroundColor" systemColor="systemGray6Color"/>
                                                 <fontDescription key="fontDescription" type="system" pointSize="11"/>
-                                                <state key="normal" title="No Background"/>
+                                                <state key="normal" title="Color Background"/>
                                                 <connections>
-                                                    <action selector="noBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="7oq-dx-dxn"/>
+                                                    <action selector="customColorBackgroundEffect:" destination="BYZ-38-t0r" eventType="touchUpInside" id="2nA-kh-Ri9"/>
                                                 </connections>
                                             </button>
                                         </subviews>

diff --git a/Example/ViewController.swift b/Example/ViewController.swift
@@ -198,8 +198,19 @@ class ViewController: UIViewController, CropViewControllerDelegate {
         presentWith(backgroundEffect: .light)
     }
 
-    @IBAction func noBackgroundEffect(_ sender: Any) {
-        presentWith(backgroundEffect: .none)
+    @IBAction func customColorBackgroundEffect(_ sender: Any) {
+        guard let image = image else {
+            return
+        }
+
+        var config = Mantis.Config()
+        config.cropViewConfig.backgroundColor = .yellow
+        let cropViewController = Mantis.cropViewController(image: image,
+                                                           config: config)
+        cropViewController.modalPresentationStyle = .fullScreen
+        cropViewController.delegate = self
+        present(cropViewController, animated: true)
+
     }
 
     typealias CropShapeItem = (type: Mantis.CropShapeType, title: String)

diff --git a/Sources/Mantis/CropView/CropView.swift b/Sources/Mantis/CropView/CropView.swift
@@ -106,6 +106,10 @@ class CropView: UIView {
         self.cropMaskViewManager = cropMaskViewManager
 
         super.init(frame: .zero)
+
+        if let color = cropViewConfig.backgroundColor {
+            self.backgroundColor = color
+        }
 
         viewModel.statusChanged = { [weak self] status in
             self?.render(by: status)

diff --git a/Sources/Mantis/CropViewConfig.swift b/Sources/Mantis/CropViewConfig.swift
@@ -20,6 +20,15 @@ public struct CropViewConfig {
 
     public var cropBorderColor: UIColor = .clear
 
+    /**
+     When backgroundColor is set, cropMaskVisualEffectType is automatically set to custom type
+     */
+    public var backgroundColor: UIColor? {
+        didSet {
+            cropMaskVisualEffectType = .custom(color: backgroundColor!)
+        }
+    }
+
     public var cropMaskVisualEffectType: CropMaskVisualEffectType = .blurDark
 
     public var presetTransformationType: PresetTransformationType = .none

diff --git a/Sources/Mantis/Enum.swift b/Sources/Mantis/Enum.swift
@@ -41,7 +41,8 @@ public enum CropMaskVisualEffectType {
     case blurDark
     case dark
     case light
-    case none
+    case custom(color: UIColor)
+    case `default`
 }
 
 public enum CropShapeType: Hashable {

diff --git a/Sources/Mantis/Mantis.swift b/Sources/Mantis/Mantis.swift
@@ -119,6 +119,12 @@ private func buildCropMaskViewManager(with cropViewConfig: CropViewConfig) -> Cr
     let dimmingView = CropDimmingView(cropShapeType: cropViewConfig.cropShapeType)
     let visualEffectView = CropMaskVisualEffectView(cropShapeType: cropViewConfig.cropShapeType,
                                                     effectType: cropViewConfig.cropMaskVisualEffectType)
+
+    if let color = cropViewConfig.backgroundColor {
+        dimmingView.overLayerFillColor = color.cgColor
+        visualEffectView.overLayerFillColor = color.cgColor
+    }
+
     return CropMaskViewManager(dimmingView: dimmingView, visualEffectView: visualEffectView)
 }
 

diff --git a/Sources/Mantis/MaskBackground/CropDimmingView.swift b/Sources/Mantis/MaskBackground/CropDimmingView.swift
@@ -9,6 +9,8 @@
 import UIKit
 
 class CropDimmingView: UIView, CropMaskProtocol {
+    var overLayerFillColor: CGColor = UIColor.black.cgColor
+
     var innerLayer: CALayer?
 
     var cropShapeType: CropShapeType = .rect

diff --git a/Sources/Mantis/MaskBackground/CropMaskProtocal.swift b/Sources/Mantis/MaskBackground/CropMaskProtocal.swift
@@ -14,6 +14,7 @@ private let initialFrameLength: CGFloat = 1000
 protocol CropMaskProtocol: UIView {
     var cropShapeType: CropShapeType { get set }
     var innerLayer: CALayer? { get set }
+    var overLayerFillColor: CGColor { get set }
 
     func initialize(cropRatio: CGFloat)
     func setMask(cropRatio: CGFloat)
@@ -123,7 +124,7 @@ extension CropMaskProtocol {
         let fillLayer = CAShapeLayer()
         fillLayer.path = path.cgPath
         fillLayer.fillRule = .evenOdd
-        fillLayer.fillColor = UIColor.black.cgColor
+        fillLayer.fillColor = overLayerFillColor
         fillLayer.opacity = opacity
         return fillLayer
     }

diff --git a/Sources/Mantis/MaskBackground/CropVisualEffectView.swift b/Sources/Mantis/MaskBackground/CropVisualEffectView.swift
@@ -9,6 +9,8 @@
 import UIKit
 
 class CropMaskVisualEffectView: UIVisualEffectView, CropMaskProtocol {
+    var overLayerFillColor: CGColor = UIColor.black.cgColor
+
     var innerLayer: CALayer?
 
     var cropShapeType: CropShapeType = .rect
@@ -47,7 +49,9 @@ class CropMaskVisualEffectView: UIVisualEffectView, CropMaskProtocol {
             return (nil, UIColor.black.withAlphaComponent(0.75))
         case .light:
             return (nil, UIColor.black.withAlphaComponent(0.35))
-        case .none:
+        case .custom(let color):
+            return(nil, color)
+        case .default:
             return (nil, .black)
         }
     }