diff --git a/Example/examples/Svg.js b/Example/examples/Svg.js
index c227e1c3..3ec6ee17 100644
--- a/Example/examples/Svg.js
+++ b/Example/examples/Svg.js
@@ -1,6 +1,8 @@
import {
StyleSheet,
- View
+ View,
+ Image,
+ Text
} from 'react-native';
import React, {
@@ -149,6 +151,38 @@ class SvgLayout extends Component{
}
}
+class SvgNativeMethods extends Component {
+ constructor() {
+ super(...arguments);
+ this.state = {
+ base64: null
+ };
+ }
+
+ alert = function () {
+ this.root.toDataURL(base64 => {
+ this.setState({
+ base64
+ });
+ });
+ };
+ render() {
+ return
+
+ Tap the shapes to render the Image below based on the base64-data of the Svg
+
+ ;
+ }
+}
+
const icon =
;
-const samples = [SvgExample, SvgOpacity, SvgViewbox, SvgLayout];
+const samples = [
+ SvgExample,
+ SvgOpacity,
+ SvgViewbox,
+ SvgLayout,
+ SvgNativeMethods
+];
export {
icon,
diff --git a/elements/Svg.js b/elements/Svg.js
index a3a0d217..3563fef9 100644
--- a/elements/Svg.js
+++ b/elements/Svg.js
@@ -1,7 +1,18 @@
-import React, {Component, PropTypes} from 'react';
-import {View, requireNativeComponent, StyleSheet} from 'react-native';
+import React, {
+ Component,
+ PropTypes
+} from 'react';
+import {
+ View,
+ requireNativeComponent,
+ StyleSheet,
+ UIManager,
+ findNodeHandle,
+ NativeModules
+} from 'react-native';
import ViewBox from './ViewBox';
import _ from 'lodash';
+const RNSVGSvgViewManager = NativeModules.RNSVGSvgViewManager;
// Svg - Root node of all Svg elements
let id = 0;
@@ -45,6 +56,10 @@ class Svg extends Component{
this.root.setNativeProps(...args);
};
+ toDataURL = (callback = _.noop) => {
+ RNSVGSvgViewManager.toDataURL(findNodeHandle(this.root), callback);
+ };
+
render() {
let {props} = this;
let opacity = +props.opacity;
diff --git a/ios/Elements/RNSVGSvgView.h b/ios/Elements/RNSVGSvgView.h
index e3c72d11..828c2a5a 100644
--- a/ios/Elements/RNSVGSvgView.h
+++ b/ios/Elements/RNSVGSvgView.h
@@ -20,15 +20,11 @@
* define content as clipPath template.
*/
- (void)defineClipPath:(__kindof RNSVGNode *)clipPath clipPathRef:(NSString *)clipPathRef;
-
- (RNSVGNode *)getDefinedClipPath:(NSString *)clipPathRef;
-
- (void)defineTemplate:(__kindof RNSVGNode *)template templateRef:(NSString *)templateRef;
-
- (RNSVGNode *)getDefinedTemplate:(NSString *)tempalteRef;
-
- (void)defineBrushConverter:(RNSVGBrushConverter *)brushConverter brushConverterRef:(NSString *)brushConverterRef;
-
- (RNSVGBrushConverter *)getDefinedBrushConverter:(NSString *)brushConverterRef;
+- (NSString *)getDataURL;
@end
diff --git a/ios/Elements/RNSVGSvgView.m b/ios/Elements/RNSVGSvgView.m
index 7cda66c6..52535ea1 100644
--- a/ios/Elements/RNSVGSvgView.m
+++ b/ios/Elements/RNSVGSvgView.m
@@ -16,6 +16,7 @@
NSMutableDictionary *clipPaths;
NSMutableDictionary *templates;
NSMutableDictionary *brushConverters;
+ CGRect _boundingBox;
}
- (void)insertReactSubview:(UIView *)subview atIndex:(NSInteger)atIndex
@@ -47,6 +48,7 @@
templates = nil;
brushConverters = nil;
CGContextRef context = UIGraphicsGetCurrentContext();
+ _boundingBox = rect;
for (RNSVGNode *node in self.subviews) {
if ([node isKindOfClass:[RNSVGNode class]]) {
@@ -63,10 +65,17 @@
[node renderTo:context];
}
}
-// CGImageRef image = CGBitmapContextCreateImage(context);
-// NSData *imageData = UIImagePNGRepresentation([[UIImage alloc] initWithCGImage:image]);
-// NSString *base64 = [imageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength];
-// NSLog(base64);
+}
+
+- (NSString *)getDataURL
+{
+ UIGraphicsBeginImageContextWithOptions(_boundingBox.size, NO, 0);
+ [self drawRect:_boundingBox];
+ UIImage * image = UIGraphicsGetImageFromCurrentImageContext();
+ NSData *imageData = UIImagePNGRepresentation(image);
+ NSString *base64 = [imageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength];
+ UIGraphicsEndImageContext();
+ return base64;
}
- (void)reactSetInheritedBackgroundColor:(UIColor *)inheritedBackgroundColor
diff --git a/ios/ViewManagers/RNSVGSvgViewManager.m b/ios/ViewManagers/RNSVGSvgViewManager.m
index b88282b4..3636cb51 100644
--- a/ios/ViewManagers/RNSVGSvgViewManager.m
+++ b/ios/ViewManagers/RNSVGSvgViewManager.m
@@ -6,6 +6,8 @@
* LICENSE file in the root directory of this source tree.
*/
+#import "RCTBridge.h"
+#import "RCTUIManager.h"
#import "RNSVGSvgViewManager.h"
#import "RNSVGSvgView.h"
@@ -18,4 +20,18 @@ RCT_EXPORT_MODULE()
return [RNSVGSvgView new];
}
+
+RCT_EXPORT_METHOD(toDataURL:(nonnull NSNumber *)reactTag callback:(RCTResponseSenderBlock)callback)
+{
+ [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary *viewRegistry) {
+ UIView *view = viewRegistry[reactTag];
+ if (![view isKindOfClass:[RNSVGSvgView class]]) {
+ RCTLogError(@"Invalid svg returned frin registry, expecting RNSVGSvgView, got: %@", view);
+ } else {
+ RNSVGSvgView *svg = view;
+ callback(@[[svg getDataURL]]);
+ }
+ }];
+}
+
@end