iOS text font support from custom loader.

doric-demo/src/TextDemo.ts

@@ -1,4 +1,4 @@
-import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log, input, text, Color, Text, InputType, hlayout, GradientOrientation } from "doric";
+import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log, input, text, Color, Text, InputType, hlayout, GradientOrientation, AssetsResource } from "doric";
 import { title } from "./utils";
 @Entry
 class TextDemo extends Panel {
@@ -207,6 +207,17 @@ class TextDemo extends Panel {
                         textSize: 30,
                         font: 'assets/fonts/assets_iconfont.ttf'
                     }),
+                    text({
+                        text: "Font from custom loader.",
+                        textSize: 10,
+                        font: 'Hanabi'
+                    }),
+                    text({
+                        text: "Font from custom loader.",
+                        textSize: 30,
+                        textColor: Color.BLUE,
+                        font: new AssetsResource('Hanabi.ttf')
+                    }),
                     text({
                         text: "This is line Spaceing 0,\nSecond line",
                         maxLines: 0,

doric-iOS/Pod/Classes/Shader/DoricTextNode.m

@@ -24,6 +24,7 @@
 #import "DoricUtil.h"
 #import "DoricGroupNode.h"
 #import "Doric.h"
+#import <CoreText/CoreText.h>
 
 @interface DoricTextView : UILabel
 @property(nonatomic, assign) DoricGravity gravity;
@@ -60,6 +61,7 @@ @interface DoricTextNode ()
 @property(nonatomic, copy) NSNumber *strikethrough;
 @property(nonatomic, strong) NSDictionary *textGradientProps;
 @property(nonatomic, assign) CGSize textGradientSize;
+@property(nonatomic, assign) CGFloat textSize;
 @end
 
 @implementation DoricTextNode
@@ -82,6 +84,7 @@ - (void)blendView:(UILabel *)view forPropName:(NSString *)name propValue:(id)pro
         } else {
             view.font = [UIFont systemFontOfSize:[(NSNumber *) prop floatValue]];
         }
+        self.textSize = [(NSNumber *) prop floatValue];
     } else if ([name isEqualToString:@"textColor"]) {
         if ([prop isKindOfClass:[NSNumber class]]) {
             view.textColor = DoricColor(prop);
@@ -134,10 +137,24 @@ - (void)blendView:(UILabel *)view forPropName:(NSString *)name propValue:(id)pro
     } else if ([name isEqualToString:@"maxHeight"]) {
         view.doricLayout.maxHeight = [prop floatValue];
     } else if ([name isEqualToString:@"font"]) {
+        if ([prop isKindOfClass:[NSString class]]) {
             NSString *iconfont = prop;
             UIFont *font = [UIFont fontWithName:[iconfont stringByReplacingOccurrencesOfString:@".ttf" withString:@""]
                                            size:view.font.pointSize];
             view.font = font;
+        } else if ([prop isKindOfClass:[NSDictionary class]]) {
+            DoricAsyncResult <NSData *> *asyncResult = [[self.doricContext.driver.registry.loaderManager
+                    load:prop
+             withContext:self.doricContext] fetch];
+            [asyncResult setResultCallback:^(NSData *fontData) {
+                [self.doricContext dispatchToMainQueue:^{
+                    view.font = [self registerFontWithFontData:fontData fontSize:self.textSize > 0 ? self.textSize : 12];
+                }];
+            }];
+            [asyncResult setExceptionCallback:^(NSException *e) {
+                DoricLog(@"Cannot load resource %@, %@", prop, e.reason);
+            }];
+        }
     } else if ([name isEqualToString:@"lineSpacing"]) {
         [[self ensureParagraphStyle] also:^(NSMutableParagraphStyle *it) {
             [it setLineSpacing:[prop floatValue]];
@@ -306,6 +323,19 @@ - (void)requestLayout {
     }];
 }
 
+- (UIFont *)registerFontWithFontData:(NSData *)fontData fontSize:(CGFloat)fontSize{
+    CGDataProviderRef fontDataProvider = CGDataProviderCreateWithCFData((__bridge CFDataRef)fontData);
+    CGFontRef fontRef = CGFontCreateWithDataProvider(fontDataProvider);
+    [UIFont familyNames];
+    CGDataProviderRelease(fontDataProvider);
+    CTFontManagerRegisterGraphicsFont(fontRef, NULL);
+    NSString *fontName = CFBridgingRelease(CGFontCopyPostScriptName(fontRef));
+    UIFont *font = [UIFont fontWithName:fontName size:fontSize];
+    CGFontRelease(fontRef);
+    return font;
+}
+
+
 - (UIImage *)gradientImageFromColors:(NSArray *)colors
                            locations:(CGFloat *)locations
                           startPoint:(CGPoint)startPoint

doric-js/bundle/doric-lib.es5.js

@@ -68,7 +68,7 @@ var Mutable = /** @class */ (function () {
  */
 var __uniqueId__ = 0;
 function uniqueId(prefix) {
-    return "__" + prefix + "_" + __uniqueId__++ + "__";
+    return "__".concat(prefix, "_").concat(__uniqueId__++, "__");
 }
 
 function toString(message) {
@@ -177,11 +177,11 @@ var __values$5 = (undefined && undefined.__values) || function(o) {
 function Property(target, propKey) {
     Object.defineProperty(target, propKey, {
         get: function () {
-            return Reflect.get(this, "__prop__" + propKey, this);
+            return Reflect.get(this, "__prop__".concat(propKey), this);
         },
         set: function (v) {
-            var oldV = Reflect.get(this, "__prop__" + propKey, this);
+            var oldV = Reflect.get(this, "__prop__".concat(propKey), this);
-            Reflect.set(this, "__prop__" + propKey, v, this);
+            Reflect.set(this, "__prop__".concat(propKey), v, this);
             if (oldV !== v) {
                 Reflect.apply(this.onPropertyChanged, this, [propKey, oldV, v]);
             }
@@ -191,11 +191,11 @@ function Property(target, propKey) {
 function InconsistProperty(target, propKey) {
     Object.defineProperty(target, propKey, {
         get: function () {
-            return Reflect.get(this, "__prop__" + propKey, this);
+            return Reflect.get(this, "__prop__".concat(propKey), this);
         },
         set: function (v) {
-            var oldV = Reflect.get(this, "__prop__" + propKey, this);
+            var oldV = Reflect.get(this, "__prop__".concat(propKey), this);
-            Reflect.set(this, "__prop__" + propKey, v, this);
+            Reflect.set(this, "__prop__".concat(propKey), v, this);
             Reflect.apply(this.onPropertyChanged, this, [propKey, oldV, v]);
         },
     });
@@ -373,7 +373,7 @@ var View = /** @class */ (function () {
             return Reflect.apply(f, this, argumentsList);
         }
         else {
-            loge("Cannot find callback:" + id + " for " + JSON.stringify(this.toModel()));
+            loge("Cannot find callback:".concat(id, " for ").concat(JSON.stringify(this.toModel())));
         }
     };
     View.prototype.toModel = function () {
@@ -714,7 +714,7 @@ var Group = /** @class */ (function (_super) {
             this.addChild(e);
         }
         else {
-            loge("Not allowed to add " + typeof e);
+            loge("Not allowed to add ".concat(typeof e));
         }
     };
     Object.defineProperty(Group.prototype, "innerElement", {
@@ -1225,7 +1225,7 @@ var Panel = /** @class */ (function () {
 
         var v = this.retrospectView(viewIds);
         if (v === undefined) {
-            loge("Cannot find view for " + viewIds);
+            loge("Cannot find view for ".concat(viewIds));
         }
         else {
             var argumentsList = [callbackId];
@@ -1427,7 +1427,7 @@ var Color = /** @class */ (function () {
     }
     Color.parse = function (str) {
         if (!str.startsWith("#")) {
-            throw new Error("Parse color error with " + str);
+            throw new Error("Parse color error with ".concat(str));
         }
         var val = parseInt(str.substr(1), 16);
         if (str.length === 7) {
@@ -1437,7 +1437,7 @@ var Color = /** @class */ (function () {
             return new Color(val);
         }
         else {
-            throw new Error("Parse color error with " + str);
+            throw new Error("Parse color error with ".concat(str));
         }
     };
     Color.safeParse = function (str, defVal) {
@@ -2089,7 +2089,7 @@ var Text = /** @class */ (function (_super) {
     ], Text.prototype, "fontStyle", void 0);
     __decorate$c([
         Property,
-        __metadata$c("design:type", String)
+        __metadata$c("design:type", Object)
     ], Text.prototype, "font", void 0);
     __decorate$c([
         Property,
@@ -2240,7 +2240,7 @@ var MainBundleResource = /** @class */ (function (_super) {
 var BundleResource = /** @class */ (function (_super) {
     __extends$f(BundleResource, _super);
     function BundleResource(bundleName, fileName) {
-        return _super.call(this, "bundle", bundleName + "://" + fileName) || this;
+        return _super.call(this, "bundle", "".concat(bundleName, "://").concat(fileName)) || this;
     }
     return BundleResource;
 }(iOSResource));
@@ -2514,7 +2514,7 @@ var List = /** @class */ (function (_super) {
     List.prototype.getItem = function (itemIdx) {
         var view = this.renderItem(itemIdx);
         view.superview = this;
-        this.cachedViews.set("" + itemIdx, view);
+        this.cachedViews.set("".concat(itemIdx), view);
         return view;
     };
     List.prototype.renderBunchedItems = function (start, length) {
@@ -2648,7 +2648,7 @@ var Slider = /** @class */ (function (_super) {
     Slider.prototype.getItem = function (itemIdx) {
         var view = this.renderPage(itemIdx);
         view.superview = this;
-        this.cachedViews.set("" + itemIdx, view);
+        this.cachedViews.set("".concat(itemIdx), view);
         return view;
     };
     Slider.prototype.renderBunchedItems = function (start, length) {
@@ -3012,7 +3012,7 @@ exports.jsx = void 0;
                 Reflect.set(e, "innerElement", children, e);
             }
             else {
-                throw new Error("Do not support " + constructor.name + " for " + children);
+                throw new Error("Do not support ".concat(constructor.name, " for ").concat(children));
             }
         }
         return e;
@@ -3130,7 +3130,7 @@ var FlowLayout = /** @class */ (function (_super) {
     FlowLayout.prototype.getItem = function (itemIdx) {
         var view = this.renderItem(itemIdx);
         view.superview = this;
-        this.cachedViews.set("" + itemIdx, view);
+        this.cachedViews.set("".concat(itemIdx), view);
         return view;
     };
     FlowLayout.prototype.renderBunchedItems = function (start, length) {
@@ -3811,7 +3811,7 @@ function navbar(context) {
 }
 
 function internalScheme(context, panelClass) {
-    return "_internal_://export?class=" + encodeURIComponent(panelClass.name) + "&context=" + context.id;
+    return "_internal_://export?class=".concat(encodeURIComponent(panelClass.name), "&context=").concat(context.id);
 }
 function navigator(context) {
     var moduleName = "navigator";
@@ -3851,9 +3851,9 @@ function transformRequest(request) {
     if (request.params !== undefined) {
         var queryStrings = [];
         for (var key in request.params) {
-            queryStrings.push(key + "=" + encodeURIComponent(request.params[key]));
+            queryStrings.push("".concat(key, "=").concat(encodeURIComponent(request.params[key])));
         }
-        request.url = "" + request.url + (url.indexOf('?') >= 0 ? '&' : '?') + queryStrings.join('&');
+        request.url = "".concat(request.url).concat(url.indexOf('?') >= 0 ? '&' : '?').concat(queryStrings.join('&'));
     }
     if (typeof request.data === 'object') {
         request.data = JSON.stringify(request.data);
@@ -4129,7 +4129,7 @@ function animate(context) {
     }
     else {
         return function (args) {
-            return Promise.reject("Cannot find panel in Context:" + context.id);
+            return Promise.reject("Cannot find panel in Context:".concat(context.id));
         };
     }
 }

doric-js/bundle/doric-lib.js

@@ -1571,7 +1571,7 @@ __decorate$c([
 ], Text.prototype, "fontStyle", void 0);
 __decorate$c([
     Property,
-    __metadata$c("design:type", String)
+    __metadata$c("design:type", Object)
 ], Text.prototype, "font", void 0);
 __decorate$c([
     Property,

doric-js/bundle/doric-vm.js

@@ -3099,7 +3099,7 @@ __decorate$c([
 ], Text.prototype, "fontStyle", void 0);
 __decorate$c([
     Property,
-    __metadata$c("design:type", String)
+    __metadata$c("design:type", Object)
 ], Text.prototype, "font", void 0);
 __decorate$c([
     Property,

doric-js/index.d.ts

@@ -590,6 +590,7 @@ declare module 'doric/lib/src/widget/text' {
     import { View } from "doric/lib/src/ui/view";
     import { Color, GradientColor } from "doric/lib/src/util/color";
     import { Gravity } from "doric/lib/src/util/gravity";
+    import { Resource } from "doric/lib/src/util/resource";
     export enum TruncateAt {
         End = 0,
         Middle = 1,
@@ -603,7 +604,7 @@ declare module 'doric/lib/src/widget/text' {
         maxLines?: number;
         textAlignment?: Gravity;
         fontStyle?: "normal" | "bold" | "italic" | "bold_italic";
-        font?: string;
+        font?: string | Resource;
         maxWidth?: number;
         maxHeight?: number;
         lineSpacing?: number;

doric-js/lib/src/widget/text.d.ts

@@ -1,6 +1,7 @@
 import { View } from "../ui/view";
 import { Color, GradientColor } from "../util/color";
 import { Gravity } from "../util/gravity";
+import { Resource } from "../util/resource";
 export declare enum TruncateAt {
     End = 0,
     Middle = 1,
@@ -14,7 +15,7 @@ export declare class Text extends View implements JSX.ElementChildrenAttribute {
     maxLines?: number;
     textAlignment?: Gravity;
     fontStyle?: "normal" | "bold" | "italic" | "bold_italic";
-    font?: string;
+    font?: string | Resource;
     maxWidth?: number;
     maxHeight?: number;
     lineSpacing?: number;

doric-js/lib/src/widget/text.js

@@ -63,7 +63,7 @@ __decorate([
 ], Text.prototype, "fontStyle", void 0);
 __decorate([
     Property,
-    __metadata("design:type", String)
+    __metadata("design:type", Object)
 ], Text.prototype, "font", void 0);
 __decorate([
     Property,

doric-js/src/widget/text.ts

@@ -17,6 +17,7 @@ import { View, Property } from "../ui/view"
 import { Color, GradientColor } from "../util/color"
 import { Gravity } from "../util/gravity"
 import { layoutConfig } from "../util/layoutconfig"
+import { Resource } from "../util/resource"
 
 export enum TruncateAt {
     End = 0,
@@ -45,7 +46,7 @@ export class Text extends View implements JSX.ElementChildrenAttribute {
     fontStyle?: "normal" | "bold" | "italic" | "bold_italic"
 
     @Property
-    font?: string
+    font?: string | Resource
 
     @Property
     maxWidth?: number

doric-web/dist/index.js

@@ -3173,7 +3173,7 @@ __decorate$c([
 ], Text.prototype, "fontStyle", void 0);
 __decorate$c([
     Property,
-    __metadata$c("design:type", String)
+    __metadata$c("design:type", Object)
 ], Text.prototype, "font", void 0);
 __decorate$c([
     Property,