Text add strikethrough and underline

doric-android/doric/src/main/java/pub/doric/shader/TextNode.java

@@ -143,6 +143,16 @@ public class TextNode extends ViewNode<TextView> {
                 }
                 view.setLineSpacing(DoricUtils.dp2px(prop.asNumber().toFloat()), 1);
                 break;
+            case "strikethrough":
+                if (prop.isBoolean()) {
+                    view.getPaint().setStrikeThruText(prop.asBoolean().value());
+                }
+                break;
+            case "underline":
+                if (prop.isBoolean()) {
+                    view.getPaint().setUnderlineText(prop.asBoolean().value());
+                }
+                break;
             default:
                 super.blend(view, name, prop);
                 break;

doric-demo/src/FlexDemo.ts

@@ -46,6 +46,36 @@ class LayoutDemo extends Panel {
                         },
                         height: 50,
                     }),
+                    image({
+                        imageBase64: icon_refresh,
+                        scaleType: ScaleType.ScaleAspectFit,
+                        backgroundColor: Color.GRAY,
+                        layoutConfig: {
+                            widthSpec: LayoutSpec.FIT,
+                            heightSpec: LayoutSpec.JUST,
+                        },
+                        height: 50,
+                    }),
+                    image({
+                        imageBase64: icon_refresh,
+                        scaleType: ScaleType.ScaleAspectFit,
+                        backgroundColor: Color.GRAY,
+                        layoutConfig: {
+                            widthSpec: LayoutSpec.FIT,
+                            heightSpec: LayoutSpec.JUST,
+                        },
+                        height: 50,
+                    }),
+                    image({
+                        imageBase64: icon_refresh,
+                        scaleType: ScaleType.ScaleAspectFit,
+                        backgroundColor: Color.GRAY,
+                        layoutConfig: {
+                            widthSpec: LayoutSpec.FIT,
+                            heightSpec: LayoutSpec.JUST,
+                        },
+                        height: 50,
+                    }),
                     image({
                         imageBase64: icon_refresh,
                         scaleType: ScaleType.ScaleAspectFit,
@@ -75,9 +105,10 @@ class LayoutDemo extends Panel {
                     flexConfig: {
                         flexDirection: FlexDirection.ROW,
                         width: 200,
-                        height: 100,
+                        height: 200,
                         flexWrap: Wrap.WRAP,
-                        alignContent: Align.CENTER,
+                        alignContent: Align.FLEX_END,
+                        alignItems: Align.FLEX_START,
                     },
                     backgroundColor: Color.GRAY.alpha(0.1),
                 }

doric-demo/src/TextDemo.ts

@@ -69,6 +69,18 @@ class TextDemo extends Panel {
                             (this as Text).textColor = Color.BLACK;
                         }
                     }),
+                    text({
+                        text: "This is strikethrough text.",
+                        textSize: 20,
+                        textColor: Color.RED,
+                        strikethrough: true,
+                    }),
+                    text({
+                        text: "This is underline text.",
+                        textSize: 20,
+                        textColor: Color.BLUE,
+                        underline: true,
+                    }),
                 ],
                 {
                     space: 10,

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

@@ -42,6 +42,8 @@ - (void)drawTextInRect:(CGRect)rect {
 
 @interface DoricTextNode ()
 @property(nonatomic, strong) NSMutableParagraphStyle *paragraphStyle;
+@property(nonatomic, assign) NSNumber *underline;
+@property(nonatomic, assign) NSNumber *strikethrough;
 @end
 
 @implementation DoricTextNode
@@ -53,12 +55,9 @@ - (UILabel *)build {
 
 - (void)blendView:(UILabel *)view forPropName:(NSString *)name propValue:(id)prop {
     if ([name isEqualToString:@"text"]) {
+        view.text = prop;
         if (self.paragraphStyle) {
-            NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:prop];
+            [self reloadParagraphStyle];
-            [attributedString addAttribute:NSParagraphStyleAttributeName value:self.paragraphStyle range:NSMakeRange(0, [attributedString length])];
-            view.attributedText = attributedString;
-        } else {
-            view.text = prop;
         }
     } else if ([name isEqualToString:@"textSize"]) {
         UIFont *font = view.font;
@@ -113,18 +112,46 @@ - (void)blendView:(UILabel *)view forPropName:(NSString *)name propValue:(id)pro
         UIFont *font = [UIFont fontWithName:iconfont size:view.font.pointSize];
         view.font = font;
     } else if ([name isEqualToString:@"lineSpacing"]) {
-        self.paragraphStyle = [NSMutableParagraphStyle new];
+        [[self ensureParagraphStyle] also:^(NSMutableParagraphStyle *it) {
-        [self.paragraphStyle setLineSpacing:[prop floatValue]];
+            [it setLineSpacing:[prop floatValue]];
-        [self.paragraphStyle setAlignment:view.textAlignment];
+            [self reloadParagraphStyle];
-        NSString *labelText = view.text ?: @"";
+        }];
-        NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:labelText];
+    } else if ([name isEqualToString:@"underline"]) {
-        [attributedString addAttribute:NSParagraphStyleAttributeName value:self.paragraphStyle range:NSMakeRange(0, [labelText length])];
+        [[self ensureParagraphStyle] also:^(NSMutableParagraphStyle *it) {
-        view.attributedText = attributedString;
+            self.underline = prop;
+            [self reloadParagraphStyle];
+        }];
+    } else if ([name isEqualToString:@"strikethrough"]) {
+        [[self ensureParagraphStyle] also:^(NSMutableParagraphStyle *it) {
+            self.strikethrough = prop;
+            [self reloadParagraphStyle];
+        }];
     } else {
         [super blendView:view forPropName:name propValue:prop];
     }
 }
 
+- (NSMutableParagraphStyle *)ensureParagraphStyle {
+    if (self.paragraphStyle == nil) {
+        self.paragraphStyle = [NSMutableParagraphStyle new];
+        self.paragraphStyle.alignment = self.view.textAlignment;
+    }
+    return self.paragraphStyle;
+}
+
+- (void)reloadParagraphStyle {
+    NSString *labelText = self.view.text ?: @"";
+    NSMutableAttributedString *attributedString = [[NSMutableAttributedString alloc] initWithString:labelText];
+    [attributedString addAttribute:NSParagraphStyleAttributeName value:self.paragraphStyle range:NSMakeRange(0, [labelText length])];
+    if (self.underline) {
+        [attributedString addAttribute:NSUnderlineStyleAttributeName value:self.underline range:NSMakeRange(0, [labelText length])];
+    }
+    if (self.strikethrough) {
+        [attributedString addAttribute:NSStrikethroughStyleAttributeName value:self.strikethrough range:NSMakeRange(0, [labelText length])];
+    }
+    self.view.attributedText = attributedString;
+}
+
 - (void)blend:(NSDictionary *)props {
     [super blend:props];
     [self.view.superview setNeedsLayout];

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

@@ -1682,6 +1682,14 @@ var Text = /** @class */ (function (_super) {
         Property,
         __metadata$3("design:type", Number)
     ], Text.prototype, "lineSpacing", void 0);
+    __decorate$3([
+        Property,
+        __metadata$3("design:type", Boolean)
+    ], Text.prototype, "strikethrough", void 0);
+    __decorate$3([
+        Property,
+        __metadata$3("design:type", Boolean)
+    ], Text.prototype, "underline", void 0);
     return Text;
 }(View));
 function text(config) {

doric-js/bundle/doric-lib.js

@@ -1250,6 +1250,14 @@ __decorate$3([
     Property,
     __metadata$3("design:type", Number)
 ], Text.prototype, "lineSpacing", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "strikethrough", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "underline", void 0);
 function text(config) {
     const ret = new Text;
     ret.layoutConfig = layoutConfig().fit();

doric-js/bundle/doric-vm.js

@@ -2709,6 +2709,14 @@ __decorate$3([
     Property,
     __metadata$3("design:type", Number)
 ], Text.prototype, "lineSpacing", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "strikethrough", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "underline", void 0);
 function text(config) {
     const ret = new Text;
     ret.layoutConfig = layoutConfig().fit();

doric-js/index.d.ts

@@ -484,6 +484,8 @@ declare module 'doric/lib/src/widget/text' {
         maxWidth?: number;
         maxHeight?: number;
         lineSpacing?: number;
+        strikethrough?: boolean;
+        underline?: boolean;
     }
     export class Text extends View implements IText {
         text?: string;
@@ -496,6 +498,8 @@ declare module 'doric/lib/src/widget/text' {
         maxWidth?: number;
         maxHeight?: number;
         lineSpacing?: number;
+        strikethrough?: boolean;
+        underline?: boolean;
     }
     export function text(config: IText): Text;
 }

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

@@ -12,6 +12,8 @@ export interface IText extends IView {
     maxWidth?: number;
     maxHeight?: number;
     lineSpacing?: number;
+    strikethrough?: boolean;
+    underline?: boolean;
 }
 export declare class Text extends View implements IText {
     text?: string;
@@ -24,5 +26,7 @@ export declare class Text extends View implements IText {
     maxWidth?: number;
     maxHeight?: number;
     lineSpacing?: number;
+    strikethrough?: boolean;
+    underline?: boolean;
 }
 export declare function text(config: IText): Text;

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

@@ -68,6 +68,14 @@ __decorate([
     Property,
     __metadata("design:type", Number)
 ], Text.prototype, "lineSpacing", void 0);
+__decorate([
+    Property,
+    __metadata("design:type", Boolean)
+], Text.prototype, "strikethrough", void 0);
+__decorate([
+    Property,
+    __metadata("design:type", Boolean)
+], Text.prototype, "underline", void 0);
 export function text(config) {
     const ret = new Text;
     ret.layoutConfig = layoutConfig().fit();

doric-js/src/widget/text.ts

@@ -29,6 +29,8 @@ export interface IText extends IView {
     maxWidth?: number
     maxHeight?: number
     lineSpacing?: number
+    strikethrough?: boolean
+    underline?: boolean
 }
 
 export class Text extends View implements IText {
@@ -61,6 +63,12 @@ export class Text extends View implements IText {
 
     @Property
     lineSpacing?: number
+
+    @Property
+    strikethrough?: boolean
+
+    @Property
+    underline?: boolean
 }
 
 export function text(config: IText) {

doric-web/dist/index.js

@@ -2767,6 +2767,14 @@ __decorate$3([
     Property,
     __metadata$3("design:type", Number)
 ], Text.prototype, "lineSpacing", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "strikethrough", void 0);
+__decorate$3([
+    Property,
+    __metadata$3("design:type", Boolean)
+], Text.prototype, "underline", void 0);
 function text(config) {
     const ret = new Text;
     ret.layoutConfig = layoutConfig().fit();