feat(iOS): tint color (#39)

duguyihou · Nov 19, 2023 · 13de94a · 13de94a
1 parent 486c20f
commit 13de94a
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 2 deletions.
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -29,6 +29,7 @@ export default function App() {
             fadeDuration={10}
             base64Placeholder={base64Placeholder}
             rounded
+            tintColor="red"
             onSuccess={handleOnSuccess}
             onError={handleOnError}
           />

diff --git a/ios/TurboImage/TurboImageView.swift b/ios/TurboImage/TurboImageView.swift
@@ -48,6 +48,8 @@ class TurboImageView : UIView {
     }
   }
 
+  @objc var tint: UIColor = .clear
+
   override init(frame: CGRect) {
     super.init(frame: frame)
     addSubview(lazyImageView)
@@ -76,7 +78,7 @@ fileprivate extension TurboImageView {
     guard let url = URL(string: url!)
     else { return }
 
-    let processor = composeProcessor(rounded)
+    let processor = composeProcessor(tint, rounded)
 
     KF.url(url)
       .fade(duration: TimeInterval(truncating: fadeDuration))
@@ -91,11 +93,17 @@ fileprivate extension TurboImageView {
       .set(to: lazyImageView)
   }
 
-  func composeProcessor(_ rounded: Bool?) -> ImageProcessor {
+  func composeProcessor( _ tint: UIColor?, _ rounded: Bool?) -> ImageProcessor {
     var processor: ImageProcessor = DefaultImageProcessor.default
+
+    if tint != nil && tint != .clear  {
+      processor = processor |> TintImageProcessor(tint: tint!)
+    }
+
     if rounded ?? false && (cornerRadius != nil) {
       processor = processor |> RoundCornerImageProcessor(cornerRadius: cornerRadius!)
     }
+
     return processor
   }
 }
diff --git a/ios/TurboImage/TurboImageViewManager.m b/ios/TurboImage/TurboImageViewManager.m
@@ -14,6 +14,8 @@ @interface RCT_EXTERN_MODULE(TurboImageViewManager, RCTViewManager)
 
 RCT_EXPORT_VIEW_PROPERTY(rounded, BOOL)
 
+RCT_REMAP_VIEW_PROPERTY(tintColor, tint, UIColor)
+
 RCT_EXPORT_VIEW_PROPERTY(onSuccess, RCTDirectEventBlock)
 
 RCT_EXPORT_VIEW_PROPERTY(onError, RCTDirectEventBlock)

diff --git a/src/TurboImage.d.ts b/src/TurboImage.d.ts
@@ -6,6 +6,7 @@ export interface TurboImageProps extends AccessibilityProps, ViewProps {
   base64Placeholder?: string;
   fadeDuration?: number;
   rounded?: boolean;
+  tintColor?: string;
   onSuccess?: () => void;
   onError?: (error: any) => void;
   ref?: React.Ref<any>;