finish basic Text features on iOS

README.md

@@ -581,6 +581,7 @@ npm install
 4. implement Animated elements
 5. load Image from url
 6. Mask element
+7. Fix rotate prop ON Text
 
 ### Known issues:
 1. cannot set alpha channel for Gradient on iOS.

ios/Text/RNSVGSpan.h

@@ -9,11 +9,12 @@
 #import <Foundation/Foundation.h>
 #import <CoreText/CoreText.h>
 #import "RNSVGPath.h"
+#import "RNSVGText.h"
 
 @interface RNSVGSpan : RNSVGPath
 
-@property (nonatomic, assign) CGFloat *dx;
+@property (nonatomic, assign) CGFloat dx;
-@property (nonatomic, assign) CGFloat *dy;
+@property (nonatomic, assign) CGFloat dy;
 @property (nonatomic, strong) NSString *px;
 @property (nonatomic, strong) NSString *py;
 @property (nonatomic, assign) CTFontRef font;

ios/Text/RNSVGSpan.m

@@ -10,6 +10,7 @@
 #import "RNSVGSpan.h"
 #import "RNSVGBezierPath.h"
 
+@class RNSVGText;
 @implementation RNSVGSpan
 
 - (CGPathRef)getPath:(CGContextRef)context
@@ -36,7 +37,21 @@
         CGFloat px = self.px ? [self getWidthRelatedValue:self.px] : 0;
         CGFloat py = self.py ? [self getHeightRelatedValue:self.py] : 0;
         
-        CGAffineTransform offset = CGAffineTransformMakeTranslation(px, size + py);
+        RNSVGText *text = [self getText];
+        if (self.px) {
+            text.offsetX = px;
+        }
+        
+        if (self.py) {
+            text.offsetY = py + size * 1.1;
+        }
+        
+        text.offsetX += self.dx;
+        text.offsetY += self.dy;
+        
+        CGAffineTransform offset = CGAffineTransformMakeTranslation(text.offsetX, text.offsetY);
+        
+        text.offsetX += CTLineGetTypographicBounds(line, nil, nil, nil);
         
         CGPathAddPath(path, &offset, linePath);
         CGPathRelease(linePath);
@@ -45,6 +60,11 @@
     return (CGPathRef)CFAutorelease(path);
 }
 
+- (RNSVGText *)getText
+{
+    return self.superview;
+}
+
 - (CGMutablePathRef)setLinePath:(CTLineRef)line
 {
     CGAffineTransform upsideDown = CGAffineTransformMakeScale(1.0, -1.0);

ios/Text/RNSVGText.h

@@ -13,5 +13,7 @@
 
 @property (nonatomic, assign) CTTextAlignment alignment;
 @property (nonatomic, copy) NSArray<NSArray *> *path;
+@property (nonatomic, assign) CGFloat offsetX;
+@property (nonatomic, assign) CGFloat offsetY;
 
 @end

ios/Text/RNSVGText.m

@@ -17,13 +17,6 @@
     [self invalidate];
     _alignment = alignment;
 }
-//
-//- (void)setTextFrame:(RNSVGTextFrame)textFrame
-//{
-//    RNSVGFreeTextFrame(_textFrame);
-//    [self invalidate];
-//    _textFrame = textFrame;
-//}
 
 - (void)setPath:(NSArray *)path
 {
@@ -34,15 +27,10 @@
     _path = path;
 }
 
-//- (void)dealloc
-//{
-//    RNSVGFreeTextFrame(_textFrame);
-//}
-
 - (void)renderLayerTo:(CGContextRef)context
 {
     CGFloat shift = [self getShift:context path:nil];
-    // translate path by alignment offset
+    // Translate path by alignment offset
     CGContextSaveGState(context);
     CGContextConcatCTM(context, CGAffineTransformMakeTranslation(-shift, 0));
     [super renderLayerTo:context];
@@ -86,33 +74,4 @@
     return shift;
 }
 
-//- (CGPathRef)getPath:(CGContextRef)context
-//{
-//    CGMutablePathRef path = CGPathCreateMutable();
-//    RNSVGTextFrame frame = self.textFrame;
-//    for (int i = 0; i < frame.count; i++) {
-//        CGFloat shift;
-//        CGFloat width = frame.widths[i];
-//        switch (self.alignment) {
-//            case kCTTextAlignmentRight:
-//                shift = width;
-//                break;
-//            case kCTTextAlignmentCenter:
-//                shift = width / 2;
-//                break;
-//            default:
-//                shift = 0;
-//                break;
-//        }
-//        // We should consider snapping this shift to device pixels to improve rendering quality
-//        // when a line has subpixel width.
-//        CGAffineTransform offset = CGAffineTransformMakeTranslation(-shift, frame.baseLine + frame.lineHeight * i + (self.path ? -frame.lineHeight : 0));
-//        
-//        CGMutablePathRef line = [self setLinePath:frame.lines[i]];
-//        CGPathAddPath(path, &offset, line);
-//        CGPathRelease(line);
-//    }
-    
-//    return (CGPathRef)CFAutorelease(path);
-//}
 @end

lib/extract/extractText.js

@@ -107,13 +107,14 @@ function parseText(props, inheritedProps = {}, deltas = []) {
 
 
     if (typeof children === 'string') {
+
         let computedProps = _.reduce(inheritedProps, (prev, value, name) => {
             if (!prev.hasOwnProperty(name)) {
                 prev[name] = value;
             }
 
             return prev;
-        }, _.omit(props, ['children', 'x', 'y']));
+        }, _.pick(props, fontAndRenderPropsKeys));
 
         let delta = deltas.shift();
 
@@ -135,6 +136,8 @@ function parseText(props, inheritedProps = {}, deltas = []) {
                 positionY: y || null
             });
 
+            x = y = null;
+
             if (!text) {
                 return spanArray;
             } else {
@@ -143,6 +146,7 @@ function parseText(props, inheritedProps = {}, deltas = []) {
         };
 
     } else {
+        inheritedProps = _.assign({}, inheritedProps);
         fontAndRenderPropsKeys.forEach(inheritablePropName => {
             if (props.hasOwnProperty(inheritablePropName)) {
                 inheritedProps[inheritablePropName] = props[inheritablePropName];