From 7474c909571ef9569d71c759d942b3d7f30c9d04 Mon Sep 17 00:00:00 2001
From: Horcrux <master@horcrux.cn>
Date: Wed, 8 Nov 2017 12:25:39 +0800
Subject: [PATCH] Fix image render

---
 .../java/com/horcrux/svg/ImageShadowNode.java | 43 ++++++++++---------
 ios/Elements/RNSVGImage.m                     | 34 ++++++---------
 2 files changed, 36 insertions(+), 41 deletions(-)

diff --git a/android/src/main/java/com/horcrux/svg/ImageShadowNode.java b/android/src/main/java/com/horcrux/svg/ImageShadowNode.java
index 4e29c595..13777e27 100644
--- a/android/src/main/java/com/horcrux/svg/ImageShadowNode.java
+++ b/android/src/main/java/com/horcrux/svg/ImageShadowNode.java
@@ -50,7 +50,8 @@ class ImageShadowNode extends RenderableShadowNode {
     private String mW;
     private String mH;
     private Uri mUri;
-    private float mImageRatio;
+    private int mImageWidth;
+    private int mImageHeight;
     private String mAlign;
     private int mMeetOrSlice;
     private final AtomicBoolean mLoading = new AtomicBoolean(false);
@@ -97,9 +98,11 @@ class ImageShadowNode extends RenderableShadowNode {
             }
 
             if (src.hasKey("width") && src.hasKey("height")) {
-                mImageRatio = (float)src.getInt("width") / (float)src.getInt("height");
+                mImageWidth = src.getInt("width");
+                mImageHeight = src.getInt("height");
             } else {
-                mImageRatio = 0f;
+                mImageWidth = 0;
+                mImageHeight = 0;
             }
             mUri = Uri.parse(uriString);
         }
@@ -198,32 +201,32 @@ class ImageShadowNode extends RenderableShadowNode {
         float rectHeight = (float)rect.height();
         float rectX = (float)rect.left;
         float rectY = (float)rect.top;
-        float rectRatio = rectWidth / rectHeight;
-        RectF renderRect;
-
-        if (mImageRatio == 0f || mImageRatio == rectRatio) {
-            renderRect = new RectF(rect);
-        } else if (mImageRatio < rectRatio) {
-            renderRect = new RectF(0, 0, (int)(rectHeight * mImageRatio), (int)rectHeight);
-        } else {
-            renderRect = new RectF(0, 0, (int)rectWidth, (int)(rectWidth / mImageRatio));
-        }
-
         float canvasLeft = getCanvasLeft();
         float canvasTop = getCanvasTop();
-        RectF vbRect = new RectF(0, 0, renderRect.width() / mScale, renderRect.height() / mScale);
-        RectF eRect = new RectF(canvasLeft, canvasTop, rectWidth / mScale + canvasLeft, rectHeight / mScale + canvasTop);
+
+        if (mImageWidth == 0 || mImageHeight == 0) {
+            mImageWidth = bitmap.getWidth();
+            mImageHeight = bitmap.getHeight();
+        }
+
+        RectF renderRect = new RectF(0, 0, mImageWidth, mImageHeight);
+
+        RectF vbRect = new RectF(0, 0, mImageWidth, mImageHeight);
+        RectF eRect = new RectF(canvasLeft, canvasTop, (rectWidth / mScale) + canvasLeft, (rectHeight / mScale) + canvasTop);
         Matrix transform = ViewBox.getTransform(vbRect, eRect, mAlign, mMeetOrSlice);
 
         Matrix translation = new Matrix();
+        transform.mapRect(renderRect);
         if (mMatrix != null) {
             translation.postConcat(mMatrix);
+            //mMatrix.mapRect(renderRect);
         }
-        float dx = rectX + canvasLeft;
-        float dy = rectY + canvasTop;
-        translation.postTranslate(-dx, -dy);
+        float dx = rectX / mScale + canvasLeft;
+        float dy = rectY / mScale + canvasTop;
+        translation.postTranslate(dx, dy);
+        translation.postScale(mScale, mScale);
         translation.mapRect(renderRect);
-        transform.mapRect(renderRect);
+
 
         Path clip = new Path();
 
diff --git a/ios/Elements/RNSVGImage.m b/ios/Elements/RNSVGImage.m
index 66b750f8..fed48df2 100644
--- a/ios/Elements/RNSVGImage.m
+++ b/ios/Elements/RNSVGImage.m
@@ -15,7 +15,7 @@
 @implementation RNSVGImage
 {
     CGImageRef _image;
-    CGFloat _imageRatio;
+    CGSize _imageSize;
 }
 
 - (void)setSrc:(id)src
@@ -25,14 +25,13 @@
     }
     _src = src;
     CGImageRelease(_image);
+    _image = CGImageRetain([RCTConvert CGImage:src]);
     RCTImageSource *source = [RCTConvert RCTImageSource:src];
     if (source.size.width != 0 && source.size.height != 0) {
-        _imageRatio = source.size.width / source.size.height;
+        _imageSize = source.size;
     } else {
-        _imageRatio = 0.0;
+        _imageSize = CGSizeMake(CGImageGetWidth(_image), CGImageGetHeight(_image));
     }
-
-    _image = CGImageRetain([RCTConvert CGImage:src]);
     [self invalidate];
 }
 
@@ -108,31 +107,24 @@
     CGContextScaleCTM(context, 1, -1);
 
     // apply viewBox transform on Image render.
-    CGFloat imageRatio = _imageRatio;
+    CGRect renderRect = CGRectMake(0, 0, _imageSize.width, _imageSize.height);
+    
     CGFloat rectWidth = CGRectGetWidth(rect);
     CGFloat rectHeight = CGRectGetHeight(rect);
     CGFloat rectX = CGRectGetMinX(rect);
     CGFloat rectY = CGRectGetMinY(rect);
-    CGFloat rectRatio = rectWidth / rectHeight;
-    CGRect renderRect;
-
-    if (!imageRatio || imageRatio == rectRatio) {
-        renderRect = rect;
-    } else if (imageRatio < rectRatio) {
-        renderRect = CGRectMake(0, 0, rectHeight * imageRatio, rectHeight);
-    } else {
-        renderRect = CGRectMake(0, 0, rectWidth, rectWidth / imageRatio);
-    }
-
     CGFloat canvasLeft = [self getContextLeft];
     CGFloat canvasTop = [self getContextTop];
-    CGRect vbRect = CGRectMake(0, 0, CGRectGetWidth(renderRect), CGRectGetHeight(renderRect));
+    
     CGRect eRect = CGRectMake(canvasLeft, canvasTop, rectWidth, rectHeight);
-
+    CGRect vbRect = CGRectMake(0, 0, CGRectGetWidth(renderRect), CGRectGetHeight(renderRect));
     CGAffineTransform transform = [RNSVGViewBox getTransform:vbRect eRect:eRect align:self.align meetOrSlice:self.meetOrSlice];
-
     renderRect = CGRectApplyAffineTransform(renderRect, transform);
-
+    
+    CGFloat dx = rectX + canvasLeft;
+    CGFloat dy = rectY + canvasTop;
+    renderRect = CGRectApplyAffineTransform(renderRect, CGAffineTransformMakeTranslation(dx, dy));
+    
     [self clip:context];
     CGContextClipToRect(context, rect);