iOS render

iOS/Pod/Classes/DoricContext.h

@@ -10,11 +10,14 @@
 
 NS_ASSUME_NONNULL_BEGIN
 
+@class DoricRootNode;
+
 @interface DoricContext : NSObject
 
 @property (nonatomic,strong) NSString *contextId;
 @property (nonatomic,strong) DoricDriver *driver;
 @property (nonatomic,strong) NSMutableDictionary *pluginInstanceMap;
+@property (nonatomic,strong) DoricRootNode *rootNode;
 
 - (instancetype)initWithScript:(NSString *)script source:(NSString *)source;
 

iOS/Pod/Classes/DoricContext.m

@@ -7,6 +7,7 @@
 
 #import "DoricContext.h"
 #import "DoricContextManager.h"
+#import "DoricRootNode.h"
 
 @implementation DoricContext
 
@@ -15,6 +16,7 @@ - (instancetype)initWithScript:(NSString *)script source:(NSString *)source {
         _driver = [DoricDriver instance];
         _pluginInstanceMap = [[NSMutableDictionary alloc] init];
         [[DoricContextManager instance] createContext:self script:script source:source];
+        _rootNode = [[DoricRootNode alloc] initWithContext:self];
     }
     return self;
 }

iOS/Pod/Classes/DoricRegistry.m

@@ -11,6 +11,7 @@
 #import "DoricStackNode.h"
 #import "DoricVLayoutNode.h"
 #import "DoricHLayoutNode.h"
+#import "DoricTextNode.h"
 
 @interface DoricRegistry ()
 
@@ -39,6 +40,8 @@ - (void)innerRegister {
     [self registerViewNode:DoricStackNode.class withName:@"Stack"];
     [self registerViewNode:DoricVLayoutNode.class withName:@"VLayout"];
     [self registerViewNode:DoricHLayoutNode.class withName:@"HLayout"];
+    [self registerViewNode:DoricTextNode.class withName:@"Text"];
+
 }
 
 - (void)registerJSBundle:(NSString *)bundle withName:(NSString *)name {

iOS/Pod/Classes/Plugin/DoricShaderPlugin.m

@@ -6,11 +6,16 @@
 //
 
 #import "DoricShaderPlugin.h"
+#import "DoricRootNode.h"
 
 @implementation DoricShaderPlugin
 
 - (void)render:(NSDictionary *)argument withPromise:(DoricPromise *)promise {
-    NSLog(@"%@",argument);
+    __weak typeof(self) _self = self;
+    dispatch_async(dispatch_get_main_queue(), ^{
+        __strong typeof(_self) self = _self;
+        [self.doricContext.rootNode render:[argument objectForKey:@"props"]];
+    });
 }
 
 @end

iOS/Pod/Classes/Shader/DoricGroupNode.h

@@ -12,6 +12,10 @@ NS_ASSUME_NONNULL_BEGIN
 @interface DoricGroupNode : DoricViewNode<UIView *>
 
 @property (nonatomic,strong) NSMutableDictionary *children;
+@property (nonatomic,strong) NSMutableArray *indexedChildren;
+
+@property (nonatomic) CGFloat desiredWidth;
+@property (nonatomic) CGFloat desiredHeight;
 
 - (void)blendChild:(DoricViewNode *)child layoutConfig:(NSDictionary *)layoutconfig;
 

iOS/Pod/Classes/Shader/DoricGroupNode.m

@@ -7,16 +7,12 @@
 
 #import "DoricGroupNode.h"
 
-@interface DoricGroupNode ()
-@property (nonatomic,strong) NSMutableArray *indexInfo;
-@end
-
 @implementation DoricGroupNode
 
 - (instancetype)init {
     if(self = [super init]) {
         _children = [[NSMutableDictionary alloc] init];
-        _indexInfo = [[NSMutableArray alloc] init];
+        _indexedChildren = [[NSMutableArray alloc] init];
     }
     return self;
 }
@@ -52,18 +48,20 @@ - (void)blendView:(UIView *)view forPropName:(NSString *)name propValue:(id)prop
                 params = [self generateDefaultLayoutParams];
             }
             [node blend:[val objectForKey:@"props"]];
-            if ([self.indexInfo objectAtIndex:i] == nil) {
+            if ([self.indexedChildren objectAtIndex:i] == nil) {
                 [self.view insertSubview:node.view atIndex:i];
-                [self.indexInfo setObject:node atIndexedSubscript:i];
+                [self.indexedChildren setObject:node atIndexedSubscript:i];
             }
         }
-        for (; i < self.view.subviews.count; i++) {
+        
+        while (i < self.view.subviews.count) {
             [self.view.subviews[i] removeFromSuperview];
-            DoricViewNode *node = [self.indexInfo objectAtIndex:i];
+            DoricViewNode *node = [self.indexedChildren objectAtIndex:i];
             if (node != nil) {
                 [self.children removeObjectForKey: node.viewId];
-                [self.indexInfo removeObjectAtIndex:i];
+                [self.indexedChildren removeObjectAtIndex:i];
             }
+            i++;
         }
     } else {
         [super blendView:view forPropName:name propValue:prop];
@@ -78,9 +76,12 @@ - (LayoutParams *)generateDefaultLayoutParams {
 - (void)blendChild:(DoricViewNode *)child layoutConfig:(NSDictionary *)layoutconfig {
     LayoutParams *params = child.layoutParams;
     NSDictionary *margin = [layoutconfig objectForKey:@"margin"];
-    params.margin.top = [(NSNumber *)[margin objectForKey:@"top"] floatValue];
-    params.margin.left = [(NSNumber *)[margin objectForKey:@"left"] floatValue];
-    params.margin.right = [(NSNumber *)[margin objectForKey:@"right"] floatValue];
-    params.margin.bottom = [(NSNumber *)[margin objectForKey:@"bottom"] floatValue];
+    if (margin) {
+        params.margin.top = [(NSNumber *)[margin objectForKey:@"top"] floatValue];
+        params.margin.left = [(NSNumber *)[margin objectForKey:@"left"] floatValue];
+        params.margin.right = [(NSNumber *)[margin objectForKey:@"right"] floatValue];
+        params.margin.bottom = [(NSNumber *)[margin objectForKey:@"bottom"] floatValue];
+    }
 }
+
 @end

iOS/Pod/Classes/Shader/DoricHLayoutNode.h

@@ -10,7 +10,8 @@
 NS_ASSUME_NONNULL_BEGIN
 
 @interface DoricHLayoutNode : DoricGroupNode
-
+@property (nonatomic) CGFloat space;
+@property (nonatomic) DoricGravity gravity;
 @end
 
 NS_ASSUME_NONNULL_END

iOS/Pod/Classes/Shader/DoricHLayoutNode.m

@@ -8,5 +8,39 @@
 #import "DoricHLayoutNode.h"
 
 @implementation DoricHLayoutNode
+- (instancetype)init {
+    if (self = [super init]) {
+        _space = 0;
+        _gravity = 0;
+    }
+    return self;
+}
+
+- (void)measureByParent:(DoricGroupNode *)parent {
+    DoricLayoutDesc widthSpec = self.layoutParams.width;
+    DoricLayoutDesc heightSpec = self.layoutParams.height;
+    CGFloat maxWidth = 0,maxHeight = 0;
+    for (DoricViewNode *child in self.indexedChildren) {
+        [child measureByParent:self];
+        UIView *childView = child.view;
+        CGFloat placeWidth = childView.width + child.layoutParams.margin.left + child.layoutParams.margin.right;
+        CGFloat placeHeight = childView.height + child.layoutParams.margin.top + child.layoutParams.margin.bottom;
+        maxWidth += placeWidth + self.space;
+        maxHeight = MAX(maxHeight, placeHeight);
+    }
+    
+    maxWidth -= self.space;
+    
+    self.desiredWidth = maxWidth;
+    self.desiredHeight = maxHeight;
+    
+    if (widthSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.width = maxWidth;
+    }
+    
+    if (heightSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.height = maxHeight;
+    }
+}
 
 @end

iOS/Pod/Classes/Shader/DoricRootNode.h

@@ -11,6 +11,9 @@ NS_ASSUME_NONNULL_BEGIN
 
 @interface DoricRootNode : DoricStackNode
 
+- (void)setupRootView:(UIView *)view;
+
+- (void)render:(NSDictionary *)props;
 @end
 
 NS_ASSUME_NONNULL_END

iOS/Pod/Classes/Shader/DoricRootNode.m

@@ -8,5 +8,18 @@
 #import "DoricRootNode.h"
 
 @implementation DoricRootNode
+- (void)setupRootView:(UIView *)view {
+    self.view = view;
+}
+
+- (void)measureByParent:(DoricGroupNode *)parent {
+    // Do noting for root
+}
+
+
+- (void)render:(NSDictionary *)props {
+    [self blend:props];
+    [self measureByParent:self];
+}
 
 @end

iOS/Pod/Classes/Shader/DoricStackNode.h

@@ -10,7 +10,7 @@
 NS_ASSUME_NONNULL_BEGIN
 
 @interface DoricStackNode : DoricGroupNode
-
+@property (nonatomic) DoricGravity gravity;
 @end
 
 NS_ASSUME_NONNULL_END

iOS/Pod/Classes/Shader/DoricStackNode.m

@@ -9,4 +9,67 @@
 
 @implementation DoricStackNode
 
+- (instancetype)init {
+    if (self = [super init]){
+        _gravity = 0;
+    }
+    return self;
+}
+
+- (void)measureByParent:(DoricGroupNode *)parent {
+    DoricLayoutDesc widthSpec = self.layoutParams.width;
+    DoricLayoutDesc heightSpec = self.layoutParams.height;
+    CGFloat maxWidth = 0,maxHeight = 0;
+    for (DoricViewNode *child in self.indexedChildren) {
+        [child measureByParent:self];
+        UIView *childView = child.view;
+        CGFloat placeWidth = childView.width + child.layoutParams.margin.left + child.layoutParams.margin.right;
+        CGFloat placeHeight = childView.height + child.layoutParams.margin.top + child.layoutParams.margin.bottom;
+        maxWidth = MAX(maxWidth, placeWidth);
+        maxHeight = MAX(maxHeight, placeHeight);
+    }
+    self.desiredWidth = maxWidth;
+    self.desiredHeight = maxHeight;
+    
+    if (widthSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.width = maxWidth;
+    }
+    
+    if (heightSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.height = maxHeight;
+    }
+    
+}
+
+- (void)layoutByParent:(DoricGroupNode *)parent {
+    for (DoricViewNode *child in self.indexedChildren) {
+        [child measureByParent:self];
+        UIView *childView = child.view;
+        if (child.layoutParams.width == LAYOUT_MATCH_PARENT) {
+            childView.width = self.view.width;
+        }
+        if (child.layoutParams.height == LAYOUT_MATCH_PARENT) {
+            childView.height = self.view.height;
+        }
+        DoricGravity gravity = self.layoutParams.alignment;
+        if ((gravity & LEFT) == LEFT) {
+            childView.left = self.view.left;
+        }
+        if ((gravity & RIGHT) == RIGHT) {
+            childView.right = self.view.right;
+        }
+        if ((gravity & TOP) == TOP) {
+            childView.top = self.view.top;
+        }
+        if ((gravity & BOTTOM) == BOTTOM) {
+            childView.bottom = self.view.bottom;
+        }
+        if ((gravity & CENTER_X) == CENTER_X) {
+            childView.centerX = self.view.centerX;
+        }
+        if ((gravity & CENTER_Y) == CENTER_Y) {
+            childView.centerY = self.view.centerY;
+        }
+    }
+}
 @end

iOS/Pod/Classes/Shader/DoricTextNode.h

@@ -0,0 +1,16 @@
+//
+//  DoricTextNode.h
+//  Doric
+//
+//  Created by pengfei.zhou on 2019/7/31.
+//
+
+#import "DoricViewNode.h"
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface DoricTextNode : DoricViewNode<UILabel *>
+
+@end
+
+NS_ASSUME_NONNULL_END

iOS/Pod/Classes/Shader/DoricTextNode.m

@@ -0,0 +1,50 @@
+//
+//  DoricTextNode.m
+//  Doric
+//
+//  Created by pengfei.zhou on 2019/7/31.
+//
+
+#import "DoricTextNode.h"
+#import "DoricUtil.h"
+#import "DoricGroupNode.h"
+
+@implementation DoricTextNode
+- (id)build:(NSDictionary *)props {
+    return [[UILabel alloc] init];
+}
+
+- (void)blendView:(UILabel *)view forPropName:(NSString *)name propValue:(id)prop {
+    if ([name isEqualToString:@"text"]) {
+        view.text = prop;
+    } else if ([name isEqualToString:@"textSize"]) {
+        view.font = [UIFont systemFontOfSize:[(NSNumber *)prop floatValue]];
+    } else if ([name isEqualToString:@"textColor"]) {
+        view.textColor = DoricColor(prop);
+    } else if ([name isEqualToString:@"textAlignment"]) {
+        DoricGravity gravity = [(NSNumber *)prop integerValue];
+        NSTextAlignment alignment = NSTextAlignmentCenter;
+        switch (gravity) {
+            case LEFT:
+                alignment = NSTextAlignmentLeft;
+                break;
+            case RIGHT:
+                alignment = NSTextAlignmentRight;
+                break;
+            default:
+                break;
+        }
+        view.textAlignment = alignment;
+    } else {
+        [super blendView:view forPropName:name propValue:prop];
+    }
+}
+
+- (void)measureByParent:(DoricGroupNode *)parent {
+    DoricLayoutDesc widthSpec = self.layoutParams.width;
+    DoricLayoutDesc heightSpec = self.layoutParams.height;
+    if (widthSpec == LAYOUT_WRAP_CONTENT || heightSpec == LAYOUT_WRAP_CONTENT) {
+        [self.view sizeToFit];
+    }
+}
+@end

iOS/Pod/Classes/Shader/DoricVLayoutNode.h

@@ -10,7 +10,8 @@
 NS_ASSUME_NONNULL_BEGIN
 
 @interface DoricVLayoutNode : DoricGroupNode
-
+@property (nonatomic) CGFloat space;
+@property (nonatomic) DoricGravity gravity;
 @end
 
 NS_ASSUME_NONNULL_END

iOS/Pod/Classes/Shader/DoricVLayoutNode.m

@@ -8,5 +8,78 @@
 #import "DoricVLayoutNode.h"
 
 @implementation DoricVLayoutNode
+- (instancetype)init {
+    if (self = [super init]) {
+        _space = 0;
+        _gravity = 0;
+    }
+    return self;
+}
 
+- (void)measureByParent:(DoricGroupNode *)parent {
+    DoricLayoutDesc widthSpec = self.layoutParams.width;
+    DoricLayoutDesc heightSpec = self.layoutParams.height;
+    CGFloat maxWidth = 0,maxHeight = 0;
+    for (DoricViewNode *child in self.indexedChildren) {
+        [child measureByParent:self];
+        UIView *childView = child.view;
+        CGFloat placeWidth = childView.width + child.layoutParams.margin.left + child.layoutParams.margin.right;
+        CGFloat placeHeight = childView.height + child.layoutParams.margin.top + child.layoutParams.margin.bottom;
+        maxWidth = MAX(maxWidth, placeWidth);
+        maxHeight += placeHeight + self.space;
+    }
+    maxHeight -= self.space;
+    
+    self.desiredWidth = maxWidth;
+    self.desiredHeight = maxHeight;
+    
+    if (widthSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.width = maxWidth;
+    }
+    
+    if (heightSpec == LAYOUT_WRAP_CONTENT) {
+        self.view.height = maxHeight;
+    }
+}
+
+- (void)layoutByParent:(DoricGroupNode *)parent {
+    if (self.layoutParams.width == LAYOUT_MATCH_PARENT) {
+        self.view.width = parent.view.width;
+    }
+    if (self.layoutParams.height == LAYOUT_MATCH_PARENT) {
+        self.view.height = parent.view.height;
+    }
+    CGFloat start = 0;
+    for (DoricViewNode *child in self.indexedChildren) {
+        [child measureByParent:self];
+        UIView *childView = child.view;
+        if (child.layoutParams.width == LAYOUT_MATCH_PARENT) {
+            childView.width = self.view.width;
+        }
+        if (child.layoutParams.height == LAYOUT_MATCH_PARENT) {
+            childView.height = self.view.height;
+        }
+        DoricGravity gravity = self.layoutParams.alignment;
+        if ((gravity & LEFT) == LEFT) {
+            childView.left = self.view.left;
+        }
+        if ((gravity & RIGHT) == RIGHT) {
+            childView.right = self.view.right;
+        }
+        if ((gravity & TOP) == TOP) {
+            childView.top = self.view.top;
+        }
+        if ((gravity & BOTTOM) == BOTTOM) {
+            childView.bottom = self.view.bottom;
+        }
+        if ((gravity & CENTER_X) == CENTER_X) {
+            childView.centerX = self.view.centerX;
+        }
+        if ((gravity & CENTER_Y) == CENTER_Y) {
+            childView.centerY = self.view.centerY;
+        }
+        childView.top = start;
+        start = childView.bottom + self.space;
+    }
+}
 @end

iOS/Pod/Classes/Shader/DoricViewContainer.h

@@ -7,9 +7,6 @@
 
 #import "UIView+Doric.h"
 
-#define LAYOUT_MATCH_PARENT -1
-#define LAYOUT_WRAP_CONTENT -2
-
 typedef NS_ENUM(NSInteger,DoricGravity) {
     SPECIFIED = 1,
     START = 1 << 1,
@@ -25,6 +22,12 @@ typedef NS_ENUM(NSInteger,DoricGravity) {
     CENTER = CENTER_X | CENTER_Y,
 };
 
+typedef NS_ENUM(NSInteger,DoricLayoutDesc) {
+    LAYOUT_DEFAULT = 0,
+    LAYOUT_MATCH_PARENT = -1,
+    LAYOUT_WRAP_CONTENT = -2,
+};
+
 NS_ASSUME_NONNULL_BEGIN
 
 @interface DoricRect :NSObject
@@ -35,7 +38,10 @@ NS_ASSUME_NONNULL_BEGIN
 @end
 
 
+
 @interface LayoutParams : NSObject
+@property (nonatomic) DoricLayoutDesc width;
+@property (nonatomic) DoricLayoutDesc height;
 @property (nonatomic) DoricGravity alignment;
 @property (nonatomic,strong) DoricRect *margin;
 @end

iOS/Pod/Classes/Shader/DoricViewContainer.m

@@ -9,12 +9,24 @@
 #import <objc/runtime.h>
 
 @implementation DoricRect
+- (instancetype)init {
+    if (self  = [super init]) {
+        _left = 0;
+        _right = 0;
+        _top = 0;
+        _bottom = 0;
+    }
+    return self;
+}
 @end
 
 @implementation LayoutParams
 - (instancetype)init {
     if (self  = [super init]) {
         _margin = [[DoricRect alloc] init];
+        _width = LAYOUT_DEFAULT;
+        _height = LAYOUT_DEFAULT;
+        _alignment = 0;
     }
     return self;
 }

iOS/Pod/Classes/Shader/DoricViewNode.h

@@ -26,6 +26,18 @@ NS_ASSUME_NONNULL_BEGIN
 
 @property (nonatomic,strong,readonly) NSArray<NSString *> *idList;
 
+
+@property (nonatomic) CGFloat x;
+@property (nonatomic) CGFloat y;
+@property (nonatomic) CGFloat width;
+@property (nonatomic) CGFloat height;
+@property (nonatomic) CGFloat centerX;
+@property (nonatomic) CGFloat centerY;
+@property (nonatomic) CGFloat top;
+@property (nonatomic) CGFloat left;
+@property (nonatomic) CGFloat right;
+@property (nonatomic) CGFloat bottom;
+
 - (V)build:(NSDictionary *)props;
 
 - (void)blend:(NSDictionary *)props;
@@ -34,6 +46,10 @@ NS_ASSUME_NONNULL_BEGIN
 
 - (void)callJSResponse:(NSString *)funcId,...;
 
+- (void)measureByParent:(DoricGroupNode *)parent;
+
+- (void)layoutByParent:(DoricGroupNode *)parent;
+
 + (DoricViewNode *)create:(DoricContext *)context withType:(NSString *)type;
 
 @end

iOS/Pod/Classes/Shader/DoricViewNode.m

@@ -29,9 +29,19 @@ - (void)blend:(NSDictionary *)props {
 
 - (void)blendView:(UIView *)view forPropName:(NSString *)name propValue:(id)prop {
     if([name isEqualToString:@"width"]) {
-        view.width = [(NSNumber *)prop floatValue];
+        NSNumber *width = (NSNumber *)prop;
+        if ([width integerValue] < 0) {
+            self.layoutParams.width = [width integerValue];
+        } else {
+            view.width = [width floatValue];
+        }
     } else if([name isEqualToString:@"height"]) {
-        view.height = [(NSNumber *)prop floatValue];
+        NSNumber *height = (NSNumber *)prop;
+        if ([height integerValue] < 0) {
+            self.layoutParams.height = [height integerValue];
+        } else {
+            view.height = [height floatValue];
+        }
     } else if([name isEqualToString:@"x"]) {
         view.x = [(NSNumber *)prop floatValue];
     } else if([name isEqualToString:@"y"]) {
@@ -47,6 +57,14 @@ - (void)blendView:(UIView *)view forPropName:(NSString *)name propValue:(id)prop
     }
 }
 
+- (void)measureByParent:(DoricGroupNode *)parent {
+    
+}
+
+- (void)layoutByParent:(DoricGroupNode *)parent {
+    
+}
+
 - (NSArray<NSString *> *)idList {
     NSMutableArray *ret = [[NSMutableArray alloc] init];
     DoricViewNode *node = self;
@@ -78,4 +96,84 @@ + (DoricViewNode *)create:(DoricContext *)context withType:(NSString *)type {
     return [[clz alloc] initWithContext:context];
 }
 
+- (CGFloat)x {
+    return ((UIView *)self.view).x;
+}
+
+- (CGFloat)y {
+    return ((UIView *)self.view).y;
+}
+
+- (CGFloat)width {
+    return ((UIView *)self.view).width;
+}
+
+- (CGFloat)height {
+    return ((UIView *)self.view).height;
+}
+
+- (CGFloat)top {
+    return ((UIView *)self.view).top;
+}
+
+- (CGFloat)bottom {
+    return ((UIView *)self.view).bottom;
+}
+
+- (CGFloat)left {
+    return ((UIView *)self.view).left;
+}
+
+- (CGFloat)right {
+    return ((UIView *)self.view).right;
+}
+
+- (CGFloat)centerX {
+    return ((UIView *)self.view).centerX;
+}
+
+- (CGFloat)centerY {
+    return ((UIView *)self.view).centerX;
+}
+
+- (void)setX:(CGFloat)x {
+    ((UIView *)self.view).x = x;
+}
+
+- (void)setY:(CGFloat)y {
+    ((UIView *)self.view).y = y;
+}
+
+- (void)setWidth:(CGFloat)width {
+    ((UIView *)self.view).width = width;
+}
+
+- (void)setHeight:(CGFloat)height {
+    ((UIView *)self.view).height = height;
+}
+
+- (void)setLeft:(CGFloat)left {
+    ((UIView *)self.view).left = left;
+}
+
+- (void)setRight:(CGFloat)right {
+    ((UIView *)self.view).right = right;
+}
+
+- (void)setTop:(CGFloat)top {
+    ((UIView *)self.view).top = top;
+}
+
+- (void)setBottom:(CGFloat)bottom {
+    ((UIView *)self.view).bottom = bottom;
+}
+
+- (void)setCenterX:(CGFloat)centerX {
+    ((UIView *)self.view).centerX = centerX;
+}
+
+- (void)setCenterY:(CGFloat)centerY {
+    ((UIView *)self.view).centerY = centerY;
+}
+
 @end