native prop trans => matrix

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

@@ -135,10 +135,10 @@ public abstract class RNSVGVirtualNode extends LayoutShadowNode {
         markUpdated();
     }
 
-    @ReactProp(name = "trans")
-    public void setTrans(@Nullable ReadableArray transformArray) {
-        if (transformArray != null) {
-            int matrixSize = PropHelper.toFloatArray(transformArray, sMatrixData);
+    @ReactProp(name = "matrix")
+    public void setMatrix(@Nullable ReadableArray matrixArray) {
+        if (matrixArray != null) {
+            int matrixSize = PropHelper.toFloatArray(matrixArray, sMatrixData);
             if (matrixSize == 6) {
                 setupMatrix();
             } else if (matrixSize != -1) {

elements/Image.js

@@ -34,7 +34,7 @@ class Image extends Shape {
         let {props} = this;
         return <RNSVGImage
             ref={ele => {this.root = ele;}}
-            {...this.extractProps(props, {responder: true})}
+            {...this.extractProps({...props, x: null, y: null}, {responder: true, transform: true})}
             x={props.x.toString()}
             y={props.y.toString()}
             width={props.width.toString()}

ios/Elements/RNSVGGroup.m

@@ -29,7 +29,7 @@
 {
     CGMutablePathRef path = CGPathCreateMutable();
     for (RNSVGNode *node in self.subviews) {
-        CGAffineTransform transform = node.transform;
+        CGAffineTransform transform = node.matrix;
         CGPathAddPath(path, &transform, [node getPath:context]);
     }
     return (CGPathRef)CFAutorelease(path);

ios/RNSVGNode.h

@@ -23,7 +23,7 @@
 @property (nonatomic, assign) CGPathRef clipPath; // convert clipPath="M0,0 L0,10 L10,10z" into path
 @property (nonatomic, strong) NSString *clipPathRef; // use clipPath="url(#clip)" as ClipPath
 @property (nonatomic, assign) BOOL responsible;
-@property (nonatomic, assign) CGAffineTransform trans;
+@property (nonatomic, assign) CGAffineTransform matrix;
 
 - (void)invalidate;
 

ios/RNSVGNode.m

@@ -69,15 +69,10 @@
     _opacity = opacity;
 }
 
-- (void)setTrans:(CGAffineTransform)trans
-{
-    self.transform = trans;
-}
-
-- (void)setTransform:(CGAffineTransform)transform
+- (void)setMatrix:(CGAffineTransform)matrix
 {
+    _matrix = matrix;
     [self invalidate];
-    super.transform = transform;
 }
 
 - (void)beginTransparencyLayer:(CGContextRef)context
@@ -100,7 +95,7 @@
 
     // This needs to be painted on a layer before being composited.
     CGContextSaveGState(context);
-    CGContextConcatCTM(context, self.transform);
+    CGContextConcatCTM(context, self.matrix);
     CGContextSetAlpha(context, opacity);
 
     [self beginTransparencyLayer:context];

ios/RNSVGRenderable.m

@@ -121,7 +121,7 @@
     // This is a terminal with only one painting. Therefore we don't need to paint this
     // off-screen. We can just composite it straight onto the buffer.
     CGContextSaveGState(context);
-    CGContextConcatCTM(context, self.transform);
+    CGContextConcatCTM(context, self.matrix);
     CGContextSetAlpha(context, self.opacity);
     [self renderClip:context];
     [self renderLayerTo:context];

ios/ViewManagers/RNSVGNodeManager.m

@@ -31,7 +31,7 @@ RCT_EXPORT_MODULE()
 
 RCT_EXPORT_VIEW_PROPERTY(name, NSString)
 RCT_EXPORT_VIEW_PROPERTY(opacity, CGFloat)
-RCT_EXPORT_VIEW_PROPERTY(trans, CGAffineTransform)
+RCT_EXPORT_VIEW_PROPERTY(matrix, CGAffineTransform)
 RCT_EXPORT_VIEW_PROPERTY(clipPathRef, NSString)
 RCT_EXPORT_VIEW_PROPERTY(clipPath, CGPath)
 RCT_EXPORT_VIEW_PROPERTY(clipRule, RNSVGCGFCRule)

lib/attributes.js

@@ -53,7 +53,7 @@ const ViewBoxAttributes = {
 
 const NodeAttributes = {
     name: true,
-    trans: {
+    matrix: {
         diff: arrayDiffer
     },
     opacity: true,

lib/extract/extractProps.js

@@ -46,9 +46,9 @@ export default function(props, options = {stroke: true, transform: true, fill: t
     }
 
     if (options.transform) {
-        extractedProps.trans = extractTransform(props);
+        extractedProps.matrix = extractTransform(props);
     } else if (props.transform) {
-        extractedProps.trans = extractTransform(props.transform);
+        extractedProps.matrix = extractTransform(props.transform);
     }
 
     if (options.responder) {