fix: iOS image scale adapt to android

Author: JimmyDaddy

docs/v1.0.1/interfaces/ImageOptions.html

@@ -72,7 +72,7 @@ <h4>Example</h4><pre><code class="language-ts"><span class="hl-9">rotate</span><
 <h3 class="tsd-anchor-link"><code class="tsd-tag ts-flagOptional">Optional</code> <span>scale</span><a href="#scale" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="#icon-anchor"></use></svg></a></h3>
 <div class="tsd-signature"><span class="tsd-kind-property">scale</span><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">number</span></div>
 <div class="tsd-comment tsd-typography">
-<h4>Description</h4><p>image scale <code>0-1</code></p>
+<h4>Description</h4><p>image scale <code>>0</code></p>
 
 <h4>Default Value</h4><p>1</p>
 

example/ios/Podfile.lock

@@ -329,7 +329,7 @@ PODS:
   - React-jsinspector (0.71.11)
   - React-logger (0.71.11):
     - glog
-  - react-native-image-marker (0.9.1):
+  - react-native-image-marker (1.0.1):
     - React-Core
   - react-native-image-picker (5.6.0):
     - React-Core
@@ -611,7 +611,7 @@ SPEC CHECKSUMS:
   React-jsiexecutor: 18b5b33c5f2687a784a61bc8176611b73524ae77
   React-jsinspector: b6ed4cb3ffa27a041cd440300503dc512b761450
   React-logger: 186dd536128ae5924bc38ed70932c00aa740cd5b
-  react-native-image-marker: efeeb67685557d90c946c7f8a4806c7674630986
+  react-native-image-marker: d827a4eb93416933a83f0b1e32be9aaf1c50633e
   react-native-image-picker: db60857e03d63721f19b6f4027de20429ddd9cba
   React-perflogger: e706562ab7eb8eb590aa83a224d26fa13963d7f2
   React-RCTActionSheet: 57d4bd98122f557479a3359ad5dad8e109e20c5a

example/src/App.tsx

@@ -153,11 +153,11 @@ function ImageOptions(props: {
         defaultValue={String(scale)}
         onChangeText={(v) => {
           const value = Number(v);
-          if (value < 0 || value > 1) {
+          if (value < 0) {
             Toast.show({
               type: 'error',
               text1: 'scale range error',
-              text2: 'scale must be between 0 and 1',
+              text2: 'scale must greater than or equal to 1',
             });
             return;
           }

ios/RCTImageMarker/ImageMarker.swift

@@ -86,10 +86,14 @@ public final class ImageMarker: NSObject, RCTBridgeModule {
     }
 
     func markerImgWithText(_ image: UIImage, _ opts: MarkTextOptions) -> UIImage? {
-        let w = Int(image.size.width)
-        let h = Int(image.size.height)
+        var bg = image;
+        if (opts.backgroundImage.scale > 0) {
+            bg = UIImage(cgImage: image.cgImage!, scale: 1 / opts.backgroundImage.scale, orientation: image.imageOrientation)
+        }
 
-        UIGraphicsBeginImageContextWithOptions(image.size, false, opts.backgroundImage.scale)
+        let w = Int(bg.size.width)
+        let h = Int(bg.size.height)
+        UIGraphicsBeginImageContextWithOptions(bg.size, false, 1 / opts.backgroundImage.scale)
 
         guard let context = UIGraphicsGetCurrentContext() else {
             return nil
@@ -105,11 +109,11 @@ public final class ImageMarker: NSObject, RCTBridgeModule {
             context.beginTransparencyLayer(auxiliaryInfo: nil)
             context.setAlpha(opts.backgroundImage.alpha)
             context.setBlendMode(.multiply)
-            context.draw(image.cgImage!, in: canvasRect)
+            context.draw(bg.cgImage!, in: canvasRect)
             context.endTransparencyLayer()
             context.setBlendMode(.normal)
         } else {
-            context.draw(image.cgImage!, in: canvasRect)
+            context.draw(bg.cgImage!, in: canvasRect)
         }
         context.restoreGState()
 
@@ -228,17 +232,29 @@ public final class ImageMarker: NSObject, RCTBridgeModule {
     }
 
     func markeImage(with image: UIImage, waterImage: UIImage, options: MarkImageOptions) -> UIImage? {
-        let w = Int(image.size.width)
-        let h = Int(image.size.height)
+        
+        var bg = image;
+        if (options.backgroundImage.scale > 0) {
+            bg = UIImage(cgImage: image.cgImage!, scale: 1 / options.backgroundImage.scale, orientation: image.imageOrientation)
+        }
+        
+        let w = Int(bg.size.width)
+        let h = Int(bg.size.height)
+        UIGraphicsBeginImageContextWithOptions(bg.size, false, 1 / options.backgroundImage.scale)
+        
+        var marker = waterImage;
+        if (options.watermarkImage.scale > 0) {
+            marker = UIImage(cgImage: waterImage.cgImage!, scale: 1 / options.watermarkImage.scale, orientation: waterImage.imageOrientation)
+        }
 
-        let ww = waterImage.size.width * options.watermarkImage.scale
-        let wh = waterImage.size.height * options.watermarkImage.scale
+        let ww = marker.size.width
+        let wh = marker.size.height
 
         let diagonal = sqrt(pow(ww, 2) + pow(ww, 2)) // 计算对角线长度
 
         let canvasRect = CGRect(x: 0, y: 0, width: CGFloat(w), height: CGFloat(h))
 
-        UIGraphicsBeginImageContextWithOptions(image.size, false, options.backgroundImage.scale)
+        UIGraphicsBeginImageContextWithOptions(bg.size, false, options.backgroundImage.scale)
 
         let transform = CGAffineTransform(translationX: 0, y: canvasRect.height)
             .scaledBy(x: 1, y: -1)
@@ -253,15 +269,15 @@ public final class ImageMarker: NSObject, RCTBridgeModule {
             context?.setAlpha(options.backgroundImage.alpha)
             context?.setBlendMode(.multiply)
 
-            context?.draw(image.cgImage!, in: canvasRect)
+            context?.draw(bg.cgImage!, in: canvasRect)
             context?.endTransparencyLayer()
             context?.setBlendMode(.normal)
             context?.restoreGState()
         } else {
             context = UIGraphicsGetCurrentContext()
             context?.saveGState()
             context?.concatenate(transform)
-            context?.draw(image.cgImage!, in: canvasRect)
+            context?.draw(bg.cgImage!, in: canvasRect)
             context?.restoreGState()
         }
 

src/index.ts

@@ -489,7 +489,7 @@ export interface ImageOptions {
    */
   src: any;
   /**
-   * @description image scale `0-1`
+   * @description image scale `> 0`
    * @defaultValue 1
    * @example
    * scale: 1