feat:fix alignmnet typo

doric-demo/src/Counter.ts

@@ -1,4 +1,4 @@
-import { text, vlayout, Image, ViewHolder, VMPanel, ViewModel, Gravity, NativeCall, Text, Color, log, logw, loge, Group, LayoutSpec, } from "doric"
+import { text, vlayout, ViewHolder, VMPanel, ViewModel, Gravity, NativeCall, Text, Color, log, logw, loge, Group, LayoutSpec, layoutConfig, IVLayout, } from "doric"
 
 interface CountModel {
     count: number
@@ -7,72 +7,20 @@ class CounterView extends ViewHolder {
     number!: Text
     counter!: Text
     build(root: Group) {
-        root.addChild(vlayout([
+        vlayout([
-            text({
+            this.number = text({
                 textSize: 40,
-                layoutConfig: {
+            }),
-                    alignment: Gravity.Center,
-                    widthSpec: LayoutSpec.FIT,
-                    heightSpec: LayoutSpec.FIT,
-                },
-            }).also(it => { this.number = it }),
-            text({
-                text: "点击计数",
-                textSize: 20,
-                border: {
-                    width: 1,
-                    color: Color.parse('#000000'),
-                },
-                corners: 5,
-                layoutConfig: {
-                    alignment: Gravity.Center,
-                    widthSpec: LayoutSpec.FIT,
-                    heightSpec: LayoutSpec.FIT,
-                },
-                padding: {
-                    left: 10,
-                    right: 10,
-                    top: 10,
-                    bottom: 10,
-                },
-                shadow: {
-                    color: Color.parse("#00ff00"),
-                    opacity: 0.5,
-                    radius: 20,
-                    offsetX: 10,
-                    offsetY: 10,
-                }
-            }).also(it => { this.counter = it }),
-        ]).also(it => {
-            it.width = 200
-            it.height = 200
-            it.space = 20
-            it.gravity = Gravity.Center
-            it.layoutConfig = {
-                alignment: Gravity.Center
-            }
-            it.border = {
-                width: 1,
-                color: Color.parse("#000000"),
-            }
-            it.shadow = {
-                color: Color.parse("#ffff00"),
-                opacity: 0.5,
-                radius: 20,
-                offsetX: 10,
-                offsetY: 10,
-            }
-            it.corners = 20
-            it.backgroundColor = Color.parse('#ff00ff')
-        }))
 
-        root.addChild((new Image).also(iv => {
+            this.counter = text({
-            iv.imageUrl = "https://misc.aotu.io/ONE-SUNDAY/SteamEngine.png"
+                text: "Click To Count",
-            iv.layoutConfig = {
+                textSize: 20,
-                widthSpec: LayoutSpec.FIT,
+            }),
-                heightSpec: LayoutSpec.FIT,
+        ]).apply({
-            }
+            layoutConfig: layoutConfig().most(),
-        }))
+            gravity: Gravity.Center,
+            space: 20,
+        } as IVLayout).in(root)
     }
 }
 
@@ -106,15 +54,4 @@ class MyPage extends VMPanel<CountModel, CounterView>{
             count: 0
         }
     }
-
-
-    @NativeCall
-    log() {
-        log("Hello.HEGO")
-        logw("Hello.HEGO")
-        loge("Hello.HEGO")
-        context.modal.toast('This is a toast.').then((r) => {
-            loge(r)
-        })
-    }
 }

doric-demo/src/FlowLayoutDemo.ts

@@ -1,4 +1,4 @@
-import { Group, Panel, flowlayout, layoutConfig, FlowLayoutItem, text, Color, IFlowLayout, LayoutSpec, Gravity } from "doric";
+import { Group, Panel, flowlayout, layoutConfig, FlowLayoutItem, text, Color, IFlowLayout, LayoutSpec, Gravity, flowItem } from "doric";
 import { colors, label } from "./utils";
 
 const imageUrls = [
@@ -22,17 +22,15 @@ class FlowDemo extends Panel {
             columnSpace: 10,
             rowSpace: 10,
             renderItem: (idx) => {
-                return new FlowLayoutItem().apply({
+                return flowItem(text({
-                    backgroundColor: colors[idx % colors.length],
-                    height: 50 + (idx % 3) * 20,
-                    layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
-                }).also(it => {
-                    it.addChild(text({
                     text: `${idx}`,
                     textColor: Color.WHITE,
                     textSize: 20,
-                        layoutConfig: layoutConfig().fit().configAlignmnet(Gravity.Center)
+                    layoutConfig: layoutConfig().fit().configAlignment(Gravity.Center)
-                    }))
+                })).apply({
+                    backgroundColor: colors[idx % colors.length],
+                    height: 50 + (idx % 3) * 20,
+                    layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
                 })
             },
         }).also(it => {
@@ -51,7 +49,7 @@ class FlowDemo extends Panel {
                     text: 'load more',
                     textColor: Color.WHITE,
                     textSize: 20,
-                    layoutConfig: layoutConfig().fit().configAlignmnet(Gravity.Center)
+                    layoutConfig: layoutConfig().fit().configAlignment(Gravity.Center)
                 }))
             })
         })

doric-demo/src/InputDemo.ts

@@ -1,4 +1,4 @@
-import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log } from "doric";
+import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log, input } from "doric";
 import { title, colors } from "./utils";
 @Entry
 class InputDemo extends Panel {

doric-demo/src/ListDemo.ts

@@ -33,7 +33,7 @@ class ListPanel extends Panel {
                             }
                             it.loadMoreView = listItem(text({
                                 text: "Loading",
-                                layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST).configAlignmnet(Gravity.Center),
+                                layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST).configAlignment(Gravity.Center),
                                 height: 50,
                             }))
                             it.renderItem = (idx: number) => {

doric-demo/src/PopoverDemo.ts

@@ -19,7 +19,7 @@ class PopoverDemo extends Panel {
                         height: 50,
                         backgroundColor: colors[0],
                         textColor: Color.WHITE,
-                        layoutConfig: layoutConfig().just().configAlignmnet(Gravity.Center),
+                        layoutConfig: layoutConfig().just().configAlignment(Gravity.Center),
                         text: "This is PopOver Window",
                     }).also(v => {
                         let idx = 0

doric-demo/src/SliderDemo.ts

@@ -34,7 +34,7 @@ class SliderPanel extends Panel {
                     return slideItem(image({
                         imageUrl: imageUrls[idx % imageUrls.length],
                         scaleType: ScaleType.ScaleAspectFit,
-                        layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST).configHeight(LayoutSpec.MOST).configAlignmnet(gravity().center()),
+                        layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST).configHeight(LayoutSpec.MOST).configAlignment(gravity().center()),
                     })).also(it => {
                         let start = idx
                         it.onClick = () => {

doric-demo/src/StickDemo.ts

@@ -83,7 +83,7 @@ class StickDemo extends Panel {
                                         text: `In Page ${idx},${itemIdx}`,
                                         textColor: Color.WHITE,
                                         textSize: 20,
-                                        layoutConfig: layoutConfig().fit().configAlignmnet(Gravity.Center)
+                                        layoutConfig: layoutConfig().fit().configAlignment(Gravity.Center)
                                     }).also(v => {
                                         v.onClick = () => {
                                             v.text = "Clicked"
@@ -120,7 +120,7 @@ class StickDemo extends Panel {
                 e.textColor = Color.BLACK
             }
         })
-        this.indicator.layoutConfig = layoutConfig().just().configAlignmnet(Gravity.Bottom).configMargin({ bottom: 13 })
+        this.indicator.layoutConfig = layoutConfig().just().configAlignment(Gravity.Bottom).configMargin({ bottom: 13 })
         animate(context)({
             animations: () => {
                 this.indicator.centerX = this.getRootView().width / this.tabs.length * (page + 0.5)

doric-js/bundle/doric-lib.js

@@ -556,7 +556,7 @@ class LayoutConfigImpl {
         this.margin = m;
         return this;
     }
-    configAlignmnet(a) {
+    configAlignment(a) {
         this.alignment = a;
         return this;
     }
@@ -1660,6 +1660,14 @@ __decorate$9([
     Property,
     __metadata$9("design:type", Function)
 ], Input.prototype, "onFocusChange", void 0);
+function input(config) {
+    const ret = new Input;
+    ret.layoutConfig = layoutConfig().just();
+    for (let key in config) {
+        Reflect.set(ret, key, Reflect.get(config, key, config), ret);
+    }
+    return ret;
+}
 
 var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -2113,6 +2121,7 @@ exports.flowlayout = flowlayout;
 exports.gravity = gravity;
 exports.hlayout = hlayout;
 exports.image = image;
+exports.input = input;
 exports.layoutConfig = layoutConfig;
 exports.list = list;
 exports.listItem = listItem;

doric-js/bundle/doric-vm.js

@@ -2004,7 +2004,7 @@ class LayoutConfigImpl {
         this.margin = m;
         return this;
     }
-    configAlignmnet(a) {
+    configAlignment(a) {
         this.alignment = a;
         return this;
     }
@@ -3108,6 +3108,14 @@ __decorate$9([
     Property,
     __metadata$9("design:type", Function)
 ], Input.prototype, "onFocusChange", void 0);
+function input(config) {
+    const ret = new Input;
+    ret.layoutConfig = layoutConfig().just();
+    for (let key in config) {
+        Reflect.set(ret, key, Reflect.get(config, key, config), ret);
+    }
+    return ret;
+}
 
 var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -3667,6 +3675,7 @@ exports.flowlayout = flowlayout;
 exports.gravity = gravity;
 exports.hlayout = hlayout;
 exports.image = image;
+exports.input = input;
 exports.layoutConfig = layoutConfig;
 exports.list = list;
 exports.listItem = listItem;

doric-js/src/util/layoutconfig.ts

@@ -96,7 +96,7 @@ export class LayoutConfigImpl implements LayoutConfig, Modeling {
         return this
     }
 
-    configAlignmnet(a: Gravity) {
+    configAlignment(a: Gravity) {
         this.alignment = a
         return this
     }

doric-js/src/widget/refreshable.ts

@@ -45,7 +45,7 @@ export class Refreshable extends Superview implements IRefreshable {
 
     toModel() {
         this.dirtyProps.content = this.content.viewId
-        this.dirtyProps.header = (this.header || {}).viewId
+        this.dirtyProps.header = ((this.header || {}) as any).viewId
         return super.toModel()
     }
 }

doric-web/dist/DoricPlayground.js

@@ -76,7 +76,7 @@ let DoricPlayground = class DoricPlayground extends doric.Panel {
                     text: "Demo列表",
                     textSize: 20,
                 }).apply({
-                    layoutConfig: doric.layoutConfig().fit().configAlignmnet(doric.gravity().centerY()).configMargin({
+                    layoutConfig: doric.layoutConfig().fit().configAlignment(doric.gravity().centerY()).configMargin({
                         left: 15,
                     })
                 })
@@ -101,7 +101,7 @@ let DoricPlayground = class DoricPlayground extends doric.Panel {
                         textSize: 30,
                         textColor: doric.Color.BLACK,
                     }).apply({
-                        layoutConfig: doric.layoutConfig().fit().configAlignmnet(doric.gravity().centerY()).configMargin({
+                        layoutConfig: doric.layoutConfig().fit().configAlignment(doric.gravity().centerY()).configMargin({
                             left: 15,
                         })
                     }),
@@ -130,7 +130,7 @@ let DoricPlayground = class DoricPlayground extends doric.Panel {
                     text: "待上线",
                     textSize: 20,
                 }).apply({
-                    layoutConfig: doric.layoutConfig().fit().configAlignmnet(doric.gravity().centerY()).configMargin({
+                    layoutConfig: doric.layoutConfig().fit().configAlignment(doric.gravity().centerY()).configMargin({
                         left: 15,
                     })
                 })

doric-web/dist/ListDemo.js

@@ -95,7 +95,7 @@ let ListPanel = class ListPanel extends doric.Panel {
                 };
                 it.loadMoreView = doric.listItem(doric.text({
                     text: "Loading",
-                    layoutConfig: doric.layoutConfig().most().configHeight(doric.LayoutSpec.JUST).configAlignmnet(doric.Gravity.Center),
+                    layoutConfig: doric.layoutConfig().most().configHeight(doric.LayoutSpec.JUST).configAlignment(doric.Gravity.Center),
                     height: 50,
                 }));
             }),

doric-web/dist/Snake.js

@@ -186,7 +186,7 @@ class SnakeView extends doric.ViewHolder {
             ]).apply({
                 layoutConfig: doric.layoutConfig().fit()
                     .configWidth(doric.LayoutSpec.MOST)
-                    .configAlignmnet(doric.Gravity.Left),
+                    .configAlignment(doric.Gravity.Left),
                 space: 10,
             }),
         ]).apply({

doric-web/dist/index.js

@@ -2062,7 +2062,7 @@ class LayoutConfigImpl {
         this.margin = m;
         return this;
     }
-    configAlignmnet(a) {
+    configAlignment(a) {
         this.alignment = a;
         return this;
     }
@@ -3166,6 +3166,14 @@ __decorate$9([
     Property,
     __metadata$9("design:type", Function)
 ], Input.prototype, "onFocusChange", void 0);
+function input(config) {
+    const ret = new Input;
+    ret.layoutConfig = layoutConfig().just();
+    for (let key in config) {
+        Reflect.set(ret, key, Reflect.get(config, key, config), ret);
+    }
+    return ret;
+}
 
 var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -3619,6 +3627,7 @@ exports.flowlayout = flowlayout;
 exports.gravity = gravity;
 exports.hlayout = hlayout;
 exports.image = image;
+exports.input = input;
 exports.layoutConfig = layoutConfig;
 exports.list = list;
 exports.listItem = listItem;