Add embedded example for iOS

doric-demo/src/CellModule1Demo.tsx

@@ -10,16 +10,20 @@ import {
   Gravity,
   Color,
   createRef,
+  Ref,
 } from "doric";
 
 @Entry
 export class Cell1 extends Panel {
-  imageRef = createRef<Image>();
+  imageRef?: Ref<Image>;
-  titleRef = createRef<Text>();
+  titleRef?: Ref<Text>;
-  contentRef = createRef<Text>();
+  contentRef?: Ref<Text>;
   data?: { imageUrl: string; title: string; content: string };
 
   build(root: Group) {
+    this.imageRef = createRef<Image>();
+    this.titleRef = createRef<Text>();
+    this.contentRef = createRef<Text>();
     <VLayout parent={root} layoutConfig={layoutConfig().most()} space={20}>
       <Text
         layoutConfig={layoutConfig().mostWidth().justHeight()}
@@ -77,11 +81,7 @@ export class Cell1 extends Panel {
   //从客户端直接调用方法
   setData(data: { imageUrl: string; title: string; content: string }) {
     this.data = data;
-    if (
+    if (this.imageRef && this.titleRef && this.contentRef) {
-      this.imageRef.current &&
-      this.titleRef.current &&
-      this.contentRef.current
-    ) {
       const { imageUrl, title, content } = data;
       this.imageRef.current.imageUrl = imageUrl;
       this.titleRef.current.text = title;

doric-demo/src/CellModule2Demo.tsx

@@ -10,17 +10,21 @@ import {
   Gravity,
   Color,
   createRef,
+  Ref,
 } from "doric";
 
 @Entry
 export class Cell2 extends Panel {
-  imageRef = createRef<Image>();
+  imageRef?: Ref<Image>;
-  titleRef = createRef<Text>();
+  titleRef?: Ref<Text>;
-  contentRef = createRef<Text>();
+  contentRef?: Ref<Text>;
 
   data?: { imageUrl: string; title: string; content: string };
 
   build(root: Group) {
+    this.imageRef = createRef<Image>();
+    this.titleRef = createRef<Text>();
+    this.contentRef = createRef<Text>();
     <VLayout parent={root} layoutConfig={layoutConfig().most()} space={20}>
       <Text
         layoutConfig={layoutConfig().mostWidth().justHeight()}
@@ -78,11 +82,7 @@ export class Cell2 extends Panel {
   //从客户端直接调用方法
   setData(data: { imageUrl: string; title: string; content: string }) {
     this.data = data;
-    if (
+    if (this.imageRef && this.titleRef && this.contentRef) {
-      this.imageRef.current &&
-      this.titleRef.current &&
-      this.contentRef.current
-    ) {
       const { imageUrl, title, content } = data;
       this.imageRef.current.imageUrl = imageUrl;
       this.titleRef.current.text = title;

doric-iOS/Example/Example.xcodeproj/project.pbxproj

@@ -22,6 +22,7 @@
 		E2334AFE22E9D2070098A085 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = E2334AFD22E9D2070098A085 /* main.m */; };
 		E2334B0822E9D2070098A085 /* ExampleTests.m in Sources */ = {isa = PBXBuildFile; fileRef = E2334B0722E9D2070098A085 /* ExampleTests.m */; };
 		E2334B1322E9D2070098A085 /* ExampleUITests.m in Sources */ = {isa = PBXBuildFile; fileRef = E2334B1222E9D2070098A085 /* ExampleUITests.m */; };
+		E24217DA287E999900F4DBEA /* DoricEmbeddedExampleVC.m in Sources */ = {isa = PBXBuildFile; fileRef = E24217D9287E999900F4DBEA /* DoricEmbeddedExampleVC.m */; };
 		E2C9315923B0A263007933D9 /* src in Resources */ = {isa = PBXBuildFile; fileRef = E2C9315823B0A263007933D9 /* src */; };
 		E2EF0C0F275F6702007801C5 /* iconfont.ttf in Resources */ = {isa = PBXBuildFile; fileRef = E2EF0C0E275F6702007801C5 /* iconfont.ttf */; };
 		E2EF0C13275F6934007801C5 /* assets in Resources */ = {isa = PBXBuildFile; fileRef = E2EF0C12275F6934007801C5 /* assets */; };
@@ -77,6 +78,8 @@
 		E2334B0E22E9D2070098A085 /* ExampleUITests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = ExampleUITests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		E2334B1222E9D2070098A085 /* ExampleUITests.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = ExampleUITests.m; sourceTree = "<group>"; };
 		E2334B1422E9D2070098A085 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+		E24217D9287E999900F4DBEA /* DoricEmbeddedExampleVC.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = DoricEmbeddedExampleVC.m; sourceTree = "<group>"; };
+		E24217DB287E99D100F4DBEA /* DoricEmbeddedExampleVC.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = DoricEmbeddedExampleVC.h; sourceTree = "<group>"; };
 		E2C9315823B0A263007933D9 /* src */ = {isa = PBXFileReference; lastKnownFileType = folder; name = src; path = "../../../doric-demo/bundle/src"; sourceTree = "<group>"; };
 		E2EF0C0E275F6702007801C5 /* iconfont.ttf */ = {isa = PBXFileReference; lastKnownFileType = file; name = iconfont.ttf; path = "../../doric-demo/bundle/assets/iconfont.ttf"; sourceTree = "<group>"; };
 		E2EF0C12275F6934007801C5 /* assets */ = {isa = PBXFileReference; lastKnownFileType = folder; name = assets; path = "../../../doric-demo/bundle/assets"; sourceTree = "<group>"; };
@@ -179,6 +182,8 @@
 				D751DDEC114E037231257E64 /* DemoVC.h */,
 				D751D2175D09F2C10691FB81 /* DemoLibrary.m */,
 				D751DB0CB3009E12990F661E /* DemoLibrary.h */,
+				E24217D9287E999900F4DBEA /* DoricEmbeddedExampleVC.m */,
+				E24217DB287E99D100F4DBEA /* DoricEmbeddedExampleVC.h */,
 			);
 			path = Example;
 			sourceTree = "<group>";
@@ -447,6 +452,7 @@
 				8BE3A340287C098100D399FA /* DoricPanelListViewController.m in Sources */,
 				E2334AF322E9D2060098A085 /* ViewController.m in Sources */,
 				E2334AFE22E9D2070098A085 /* main.m in Sources */,
+				E24217DA287E999900F4DBEA /* DoricEmbeddedExampleVC.m in Sources */,
 				E2334AF022E9D2060098A085 /* AppDelegate.m in Sources */,
 				D751D4B065D8D4FA6594B5EE /* DemoVC.m in Sources */,
 				D751DDB012BAF476A252CD93 /* DemoLibrary.m in Sources */,

doric-iOS/Example/Example/DoricEmbeddedExampleVC.h

@@ -0,0 +1,14 @@
+//
+//  Header.h
+//  Example
+//
+//  Created by pengfei.zhou on 2022/7/13.
+//  Copyright © 2022 pengfei.zhou. All rights reserved.
+//
+
+#import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+
+
+@interface DoricEmbeddedExampleVC : UIViewController
+@end

doric-iOS/Example/Example/DoricEmbeddedExampleVC.m

@@ -0,0 +1,168 @@
+//
+//  DoricEmbeddedExampleVC.m
+//  Example
+//
+//  Created by pengfei.zhou on 2022/7/13.
+//  Copyright © 2022 pengfei.zhou. All rights reserved.
+//
+
+#import <Foundation/Foundation.h>
+#import "DoricEmbeddedExampleVC.h"
+#import <DoricCore/Doric.h>
+#import <DoricCore/DoricSingleton.h>
+
+
+@interface MyFlowLayout : UICollectionViewLayout
+@property(nonatomic, readonly) NSInteger columnCount;
+@property(nonatomic, strong) NSMutableDictionary <NSNumber *, NSNumber *> *columnHeightInfo;
+@end
+
+@implementation MyFlowLayout
+- (instancetype)init {
+    if (self = [super init]) {
+        _columnHeightInfo = [NSMutableDictionary new];
+    }
+    return self;
+}
+
+- (NSInteger)columnCount {
+    return 2;
+}
+
+- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds {
+    return YES;
+}
+
+- (void)prepareLayout {
+    [super prepareLayout];
+    for (int i = 0; i < self.columnCount; i++) {
+        self.columnHeightInfo[@(i)] = @(0);
+    }
+}
+
+- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
+    for (int i = 0; i < self.columnCount; i++) {
+        self.columnHeightInfo[@(i)] = @(0);
+    }
+    NSMutableArray *array = [NSMutableArray array];
+    NSInteger count = [self.collectionView numberOfItemsInSection:0];
+    for (int i = 0; i < count; i++) {
+        UICollectionViewLayoutAttributes *attrs = [self layoutAttributesForItemAtIndexPath:[NSIndexPath indexPathForItem:i inSection:0]];
+        [array addObject:attrs];
+    }
+    return array;
+}
+
+- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath {
+    NSNumber *minYOfColumn = @(0);
+    NSArray<NSNumber *> *keys = self.columnHeightInfo.allKeys;
+    NSArray<NSNumber *> *sortedKeys = [keys sortedArrayUsingComparator:^NSComparisonResult(NSNumber *obj1, NSNumber *obj2) {
+        return ([obj1 intValue] <= [obj2 intValue] ? NSOrderedAscending : NSOrderedDescending);
+    }];
+
+    for (NSNumber *key in sortedKeys) {
+        if ([self.columnHeightInfo[key] floatValue] < [self.columnHeightInfo[minYOfColumn] floatValue]) {
+            minYOfColumn = key;
+        }
+    }
+    CGFloat columnWidth = self.collectionView.width / self.columnCount;
+    CGFloat width = columnWidth;
+    CGFloat height = 200;
+    CGFloat x = 0;
+    CGFloat y = [self.columnHeightInfo[minYOfColumn] floatValue];
+    x = columnWidth * [minYOfColumn integerValue];
+    self.columnHeightInfo[minYOfColumn] = @(y + height);
+    UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
+    attrs.frame = CGRectMake(x, y, width, height);
+    return attrs;
+}
+
+- (CGSize)collectionViewContentSize {
+    CGFloat width = self.collectionView.width;
+    CGFloat height = 0;
+    for (NSNumber *column in self.columnHeightInfo.allValues) {
+        height = MAX(height, [column floatValue]);
+    }
+    return CGSizeMake(width, height);
+}
+@end
+
+
+@interface MyCollectionViewCell : UICollectionViewCell
+@property(nonatomic, strong) DoricPanel *panel;
+@end
+
+@implementation MyCollectionViewCell
+@end
+
+
+@interface DoricEmbeddedExampleVC () <UICollectionViewDelegate, UICollectionViewDataSource>
+@end
+
+@implementation DoricEmbeddedExampleVC
+
+- (instancetype)init {
+    if (self = [super init]) {
+    }
+    return self;
+}
+
+
+- (void)viewDidAppear:(BOOL)animated {
+    [super viewDidAppear:animated];
+    [self.view addSubview:[[[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, self.view.width, self.view.height) collectionViewLayout:[MyFlowLayout new]] also:^(UICollectionView *it) {
+        it.dataSource = self;
+        it.delegate = self;
+    }]];
+}
+
+- (void)viewDidLoad {
+    [super viewDidLoad];
+    self.title = @"Doric Embedded Demo";
+    [self.navigationController.navigationBar setBackgroundImage:UIImageWithColor(UIColor.whiteColor) forBarMetrics:UIBarMetricsDefault];
+}
+
+- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
+    return 1000;
+}
+
+- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
+    NSString *cellId = (indexPath.row % 2 == 0) ? @"cell0" : @"cell1";
+    [collectionView registerClass:[MyCollectionViewCell class] forCellWithReuseIdentifier:cellId];
+    MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellId forIndexPath:indexPath];
+    NSDictionary *data = @{
+            @"imageUrl": (indexPath.row % 2 == 0)
+                    ? @"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202107%2F09%2F20210709142454_dc8dc.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1660279617&t=8caf9c88dbeb00c6436f76e90c54eecc"
+                    : @"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F202005%2F02%2F20200502185802_FuFU2.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1660279617&t=77131edf568efeda32c3a6513412f324",
+            @"title": [NSString stringWithFormat:@"%@", @(indexPath.row + 1)],
+            @"content": [NSString stringWithFormat:@"第%@项\n++++++++可填充内容++++++++%@", @(indexPath.row + 1), (indexPath.row % 2 == 0) ? @"\n+++再加一行+++" : @""],
+    };
+    if (cell.panel == nil) {
+        cell.panel = [[DoricPanel new] also:^(DoricPanel *it) {
+            it.view.width = self.view.width / 2;
+            it.view.height = 200;
+            NSString *scheme = (indexPath.row % 2 == 0) ? @"assets://src/CellModule1Demo.js" : @"assets://src/CellModule2Demo.js";
+            NSString *alias = (indexPath.row % 2 == 0) ? @"CellModule1Demo.js" : @"CellModule2Demo.js";
+            [[DoricSingleton.instance.jsLoaderManager request:scheme]
+                    setResultCallback:^(NSString *script) {
+                        [it config:script alias:alias extra:nil];
+                    }];
+            [cell.panel.doricContext callEntity:@"setData", data, nil];
+        }];
+    }
+    if (cell.panel.doricContext != nil) {
+        [cell.panel.doricContext callEntity:@"setData", data, nil];
+    }
+    __weak typeof(cell) _cell = cell;
+    cell.panel.frameChangedBlock = ^(CGSize frameSize) {
+        __strong typeof(_cell) c = _cell;
+        c.width = frameSize.width;
+        c.height = frameSize.height;
+        c.contentView.width = c.width;
+        c.contentView.height = c.height;
+    };
+    [cell.contentView addSubview:cell.panel.view];
+    return cell;
+}
+
+@end

doric-iOS/Example/Example/ViewController.m

@@ -11,7 +11,8 @@
 
 #import "ViewController.h"
 #import "DemoLibrary.h"
-#import "DoricPanelListViewController.h""
+#import "DoricPanelListViewController.h"
+#import "DoricEmbeddedExampleVC.h"
 
 @interface ViewController () <UITableViewDelegate, UITableViewDataSource>
 @property(nonatomic, copy) NSArray <NSString *> *demoFilePaths;
@@ -38,6 +39,8 @@ - (void)viewDidLoad {
     }];
     [tmp insertObject:@"Dev Kit" atIndex:0];
     [tmp insertObject:@"Doric Panel List" atIndex:1];
+    [tmp insertObject:@"Doric Embedded Example" atIndex:2];
+
     self.demoFilePaths = tmp;
 
     [Doric registerLibrary:[DemoLibrary new]];
@@ -96,6 +99,18 @@ - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath
         }
         [navigationController pushViewController:panelListViewController animated:NO];
         return;
+    } else if (indexPath.row == 2) {
+        DoricEmbeddedExampleVC *vc = [DoricEmbeddedExampleVC new];
+
+        UIViewController *viewController = [UIApplication sharedApplication].delegate.window.rootViewController;
+        UINavigationController *navigationController;
+        if ([viewController isKindOfClass:[UINavigationController class]]) {
+            navigationController = (UINavigationController *) viewController;
+        } else {
+            navigationController = viewController.navigationController;
+        }
+        [navigationController pushViewController:vc animated:NO];
+        return;
     }
     NSString *file = self.demoFilePaths[(NSUInteger) indexPath.row];
     DoricViewController *doricViewController = [[DoricViewController alloc]