Implement version of toDataURL with width and height options

#855

Author: msand

android/src/main/java/com/horcrux/svg/SvgView.java

@@ -306,6 +306,20 @@ String toDataURL() {
         return Base64.encodeToString(bitmapBytes, Base64.DEFAULT);
     }
 
+    String toDataURL(int width, int height) {
+        Bitmap bitmap = Bitmap.createBitmap(
+                width,
+                height,
+                Bitmap.Config.ARGB_8888);
+
+        drawChildren(new Canvas(bitmap));
+        ByteArrayOutputStream stream = new ByteArrayOutputStream();
+        bitmap.compress(Bitmap.CompressFormat.PNG, 100, stream);
+        bitmap.recycle();
+        byte[] bitmapBytes = stream.toByteArray();
+        return Base64.encodeToString(bitmapBytes, Base64.DEFAULT);
+    }
+
     void enableTouchEvents() {
         if (!mResponsible) {
             mResponsible = true;

android/src/main/java/com/horcrux/svg/SvgViewModule.java

@@ -13,6 +13,7 @@
 import com.facebook.react.bridge.ReactApplicationContext;
 import com.facebook.react.bridge.ReactContextBaseJavaModule;
 import com.facebook.react.bridge.ReactMethod;
+import com.facebook.react.bridge.ReadableMap;
 
 class SvgViewModule extends ReactContextBaseJavaModule {
     SvgViewModule(ReactApplicationContext reactContext) {
@@ -33,4 +34,19 @@ public void toDataURL(int tag, Callback successCallback) {
             successCallback.invoke(svg.toDataURL());
         }
     }
+
+
+    @ReactMethod
+    public void toDataURL(int tag, ReadableMap options, Callback successCallback) {
+        SvgView svg = SvgViewManager.getSvgViewByTag(tag);
+
+        if (svg != null) {
+            successCallback.invoke(
+                svg.toDataURL(
+                    options.getInt("width"),
+                    options.getInt("height")
+                )
+            );
+        }
+    }
 }

elements/Svg.js

@@ -49,9 +49,16 @@ export default class Svg extends Shape {
     this.root.setNativeProps(props);
   };
 
-  toDataURL = callback => {
-    callback &&
-      RNSVGSvgViewManager.toDataURL(findNodeHandle(this.root), callback);
+  toDataURL = (callback, options) => {
+    if (!callback) {
+      return;
+    }
+    const handle = findNodeHandle(this.root);
+    if (options) {
+      RNSVGSvgViewManager.toDataURL(handle, options, callback);
+    } else {
+      RNSVGSvgViewManager.toDataURL(handle, callback);
+    }
   };
 
   render() {

ios/Elements/RNSVGSvgView.h

@@ -52,6 +52,8 @@
 
 - (NSString *)getDataURL;
 
+- (NSString *)getDataURLwithBounds:(CGSize)bounds;
+
 - (CGRect)getContextBounds;
 
 - (void)drawRect:(CGRect)rect;

ios/Elements/RNSVGSvgView.m

@@ -247,7 +247,6 @@ - (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
     return nil;
 }
 
-
 - (NSString *)getDataURL
 {
     UIGraphicsBeginImageContextWithOptions(_boundingBox.size, NO, 0);
@@ -258,6 +257,16 @@ - (NSString *)getDataURL
     return base64;
 }
 
+- (NSString *)getDataURLwithBounds:(CGSize)bounds
+{
+    UIGraphicsBeginImageContextWithOptions(bounds, NO, 0);
+    [self drawRect:_boundingBox];
+    NSData *imageData = UIImagePNGRepresentation(UIGraphicsGetImageFromCurrentImageContext());
+    NSString *base64 = [imageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength];
+    UIGraphicsEndImageContext();
+    return base64;
+}
+
 - (void)reactSetInheritedBackgroundColor:(UIColor *)inheritedBackgroundColor
 {
     self.backgroundColor = inheritedBackgroundColor;

ios/ViewManagers/RNSVGSvgViewManager.m

@@ -43,4 +43,30 @@ - (UIView *)view
     }];
 }
 
+RCT_EXPORT_METHOD(toDataURL:(nonnull NSNumber *)reactTag options:(NSDictionary *)options callback:(RCTResponseSenderBlock)callback)
+{
+    [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary<NSNumber *,UIView *> *viewRegistry) {
+        __kindof UIView *view = viewRegistry[reactTag];
+        if ([view isKindOfClass:[RNSVGSvgView class]]) {
+            RNSVGSvgView *svg = view;
+            id width = [options objectForKey:@"width"];
+            id height = [options objectForKey:@"height"];
+            if (![width isKindOfClass:NSNumber.class] ||
+                ![height isKindOfClass:NSNumber.class]) {
+                RCTLogError(@"Invalid width or height given to toDataURL");
+                return;
+            }
+            NSNumber* w = width;
+            NSInteger wi = (NSInteger)[w intValue];
+            NSNumber* h = height;
+            NSInteger hi = (NSInteger)[h intValue];
+
+            CGSize bounds = CGSizeMake(wi, hi);
+            callback(@[[svg getDataURLwithBounds:bounds]]);
+        } else {
+            RCTLogError(@"Invalid svg returned frin registry, expecting RNSVGSvgView, got: %@", view);
+        }
+    }];
+}
+
 @end