fix: update setters to change blur properties in the UIView subclass

candlefinance · Jun 1, 2023 · 311f672 · 311f672
1 parent f42f12a
commit 311f672
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 41 deletions.
diff --git a/README.md b/README.md
@@ -30,6 +30,15 @@ import { BlurViewView } from '@candlefinance/blur-view';
 />;
 ```
 
+## Docs
+
+View the example app in the [example](./example/src/App.tsx) folder.
+
+| Property        | Type     | Default                                 | Description                                       |
+| --------------- | -------- | --------------------------------------- | ------------------------------------------------- |
+| `maxBlurRadius` | `number` | `20`                                    | The amount of blur to apply to the view.          |
+| `gradientMask`  | `string` | see [source](./ios/images/Gradient.png) | The gradient mask to apply to the view in base64. |
+
 ## Contributing
 
 See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock
@@ -1,6 +1,6 @@
 PODS:
   - boost (1.76.0)
-  - candlefinance-blur-view (0.1.0):
+  - candlefinance-blur-view (0.3.0):
     - React-Core
   - CocoaAsyncSocket (7.6.5)
   - DoubleConversion (1.1.6)
@@ -574,7 +574,7 @@ EXTERNAL SOURCES:
 
 SPEC CHECKSUMS:
   boost: 57d2868c099736d80fcd648bf211b4431e51a558
-  candlefinance-blur-view: 7a7baae3a3c8cd4c84c6973e6c3cff7bd2c87d4f
+  candlefinance-blur-view: 0818b16cefbe918e533fbdd78771c92764a2a0e2
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
   DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
   FBLazyVector: f637f31eacba90d4fdeff3fa41608b8f361c173b

diff --git a/ios/BlurViewViewManager.swift b/ios/BlurViewViewManager.swift
@@ -13,32 +13,33 @@ class BlurViewViewManager: RCTViewManager {
 class BlurViewView : UIView {
 
     var gradientMaskImage: UIImage = VariableBlurViewConstants.defaultGradientMask
-    var _maxBlurRadius: CGFloat = 20
 
-    @objc var filterType: String = "variableBlur"
+    private let filterType: String = "variableBlur"
     @objc var gradientMask: String = "" {
         didSet {
             if
                 let data = Data(base64Encoded: gradientMask, options: .ignoreUnknownCharacters),
                 let image = UIImage(data: data)
             {
-                gradientMaskImage = image
+                self.gradientMaskImage = image
+                blurView.update(gradientMask: image, maxBlurRadius: CGFloat(truncating: maxBlurRadius), filterType: filterType)
             } else {
                 print("[VariableBlurView] Couldn't create the gradient mask image.")
-                gradientMaskImage = UIImage(systemName: "xmark")!
+                let image = UIImage(systemName: "xmark")!
+                blurView.update(gradientMask: image, maxBlurRadius: CGFloat(truncating: maxBlurRadius), filterType: filterType)
             }
         }
     }
 
     @objc var maxBlurRadius: NSNumber = 20 {
         didSet {
-            self._maxBlurRadius = CGFloat(truncating: maxBlurRadius)
+            blurView.update(gradientMask: gradientMaskImage, maxBlurRadius: maxBlurRadius.doubleValue, filterType: filterType)
         }
     }
 
     lazy var blurView = VariableBlurUIView(
-        gradientMask: gradientMaskImage,
-        maxBlurRadius: _maxBlurRadius,
+        gradientMask: VariableBlurViewConstants.defaultGradientMask,
+        maxBlurRadius: maxBlurRadius.doubleValue,
         filterType: filterType
     )
 

diff --git a/ios/VariableFilterBlurView.swift b/ios/VariableFilterBlurView.swift
@@ -28,8 +28,6 @@
 //  OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
 //  WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
-import SwiftUI
-
 /// A variable blur view.
 public class VariableBlurUIView: UIVisualEffectView {
     public init(
@@ -39,6 +37,14 @@ public class VariableBlurUIView: UIVisualEffectView {
     ) {
         super.init(effect: UIBlurEffect(style: .regular))
 
+        update(gradientMask: gradientMask, maxBlurRadius: maxBlurRadius, filterType: filterType)
+    }
+
+    public func update(
+        gradientMask: UIImage,
+        maxBlurRadius: CGFloat = 20,
+        filterType: String = "variableBlur"
+    ) {
         /// This is a private QuartzCore class, encoded in base64.
         ///
         ///             CAFilter
@@ -129,35 +135,6 @@ public class VariableBlurUIView: UIVisualEffectView {
     }
 }
 
-/// A variable blur view.
-public struct VariableBlurView: UIViewRepresentable {
-    public var gradientMask: UIImage
-    public var maxBlurRadius: CGFloat
-    public var filterType: String
-
-    /// A variable blur view.
-    public init(
-        gradientMask: UIImage = VariableBlurViewConstants.defaultGradientMask,
-        maxBlurRadius: CGFloat = 20,
-        filterType: String = "variableBlur"
-    ) {
-        self.gradientMask = gradientMask
-        self.maxBlurRadius = maxBlurRadius
-        self.filterType = filterType
-    }
-
-    public func makeUIView(context: Context) -> VariableBlurUIView {
-        let view = VariableBlurUIView(
-            gradientMask: gradientMask,
-            maxBlurRadius: maxBlurRadius,
-            filterType: filterType
-        )
-        return view
-    }
-
-    public func updateUIView(_ uiView: VariableBlurUIView, context: Context) {}
-}
-
 public enum VariableBlurViewConstants {
 
     /// A gradient mask image (top is opaque, bottom is clear). The gradient includes easing.
@@ -332,4 +309,4 @@ public enum VariableBlurViewConstants {
     hRk7ZiOn82b8tBT4z9WYYimWfkLE9NPSNSC9M8IteGAx2NVHvDRQaepzekklf1xAyM26roGzLps3
     bjvf9+1Pfl3/GTX2ayFpmkPjAAAAAElFTkSuQmCC
     """
-}
+}