From f78f3ed7d840bc5f2e36449d8f22fdc1ccf0d622 Mon Sep 17 00:00:00 2001 From: "pengfei.zhou" Date: Wed, 23 Oct 2019 15:59:55 +0800 Subject: [PATCH] feat:complete defination of LayoutConfig --- Android/doric/build.gradle | 2 +- .../java/pub/doric/engine/DoricJSEngine.java | 4 +- .../main/java/pub/doric/shader/GroupNode.java | 32 ++++++- .../java/pub/doric/shader/LinearNode.java | 2 +- .../main/java/pub/doric/shader/StackNode.java | 2 +- .../main/java/pub/doric/shader/ViewNode.java | 8 +- demo/src/Counter.ts | 6 +- demo/src/Snake.ts | 39 +++++++-- js-framework/src/ui/panel.ts | 2 +- js-framework/src/ui/view.ts | 83 +++++++------------ 10 files changed, 107 insertions(+), 73 deletions(-) diff --git a/Android/doric/build.gradle b/Android/doric/build.gradle index 06e6b084..43aa1284 100644 --- a/Android/doric/build.gradle +++ b/Android/doric/build.gradle @@ -26,7 +26,7 @@ android { afterEvaluate { buildJSBundle.exec() buildDemo.exec() - buildDebugger.exec() + //buildDebugger.exec() } task buildJSBundle(type: Exec) { diff --git a/Android/doric/src/main/java/pub/doric/engine/DoricJSEngine.java b/Android/doric/src/main/java/pub/doric/engine/DoricJSEngine.java index 20acbb84..c7cc65e0 100644 --- a/Android/doric/src/main/java/pub/doric/engine/DoricJSEngine.java +++ b/Android/doric/src/main/java/pub/doric/engine/DoricJSEngine.java @@ -67,8 +67,8 @@ public class DoricJSEngine implements Handler.Callback, DoricTimerExtension.Time private void initJSExecutor() { -// mDoricJSE = new DoricNativeJSExecutor(); - mDoricJSE = new DoricRemoteJSExecutor(); + mDoricJSE = new DoricNativeJSExecutor(); +// mDoricJSE = new DoricRemoteJSExecutor(); mDoricJSE.injectGlobalJSFunction(DoricConstant.INJECT_LOG, new JavaFunction() { @Override public JavaValue exec(JSDecoder[] args) { diff --git a/Android/doric/src/main/java/pub/doric/shader/GroupNode.java b/Android/doric/src/main/java/pub/doric/shader/GroupNode.java index bfe28c75..81cd53b5 100644 --- a/Android/doric/src/main/java/pub/doric/shader/GroupNode.java +++ b/Android/doric/src/main/java/pub/doric/shader/GroupNode.java @@ -116,12 +116,42 @@ public abstract class GroupNode extends ViewNode { } protected ViewGroup.LayoutParams generateDefaultLayoutParams() { - return new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT); + return new ViewGroup.LayoutParams(0, 0); } protected void blendChild(ViewNode viewNode, JSObject jsObject) { + + JSValue jsValue = jsObject.getProperty("margin"); + JSValue widthSpec = jsObject.getProperty("widthSpec"); + JSValue heightSpec = jsObject.getProperty("widthSpec"); + ViewGroup.LayoutParams layoutParams = viewNode.getLayoutParams(); + if (widthSpec.isNumber()) { + switch (widthSpec.asNumber().toInt()) { + case 1: + layoutParams.width = ViewGroup.LayoutParams.WRAP_CONTENT; + break; + case 2: + layoutParams.width = ViewGroup.LayoutParams.MATCH_PARENT; + break; + default: + break; + + } + } + if (heightSpec.isNumber()) { + switch (heightSpec.asNumber().toInt()) { + case 1: + layoutParams.height = ViewGroup.LayoutParams.WRAP_CONTENT; + break; + case 2: + layoutParams.height = ViewGroup.LayoutParams.MATCH_PARENT; + break; + default: + break; + } + } if (jsValue.isObject() && layoutParams instanceof ViewGroup.MarginLayoutParams) { JSValue topVal = jsValue.asObject().getProperty("top"); if (topVal.isNumber()) { diff --git a/Android/doric/src/main/java/pub/doric/shader/LinearNode.java b/Android/doric/src/main/java/pub/doric/shader/LinearNode.java index 2a54cd00..80e7bb24 100644 --- a/Android/doric/src/main/java/pub/doric/shader/LinearNode.java +++ b/Android/doric/src/main/java/pub/doric/shader/LinearNode.java @@ -50,7 +50,7 @@ public class LinearNode extends GroupNode { @Override protected ViewGroup.LayoutParams generateDefaultLayoutParams() { - return new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT); + return new LinearLayout.LayoutParams(0, 0); } @Override diff --git a/Android/doric/src/main/java/pub/doric/shader/StackNode.java b/Android/doric/src/main/java/pub/doric/shader/StackNode.java index ff5417d6..4c781889 100644 --- a/Android/doric/src/main/java/pub/doric/shader/StackNode.java +++ b/Android/doric/src/main/java/pub/doric/shader/StackNode.java @@ -62,6 +62,6 @@ public class StackNode extends GroupNode { @Override protected ViewGroup.LayoutParams generateDefaultLayoutParams() { - return new FrameLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT); + return new FrameLayout.LayoutParams(0, 0); } } diff --git a/Android/doric/src/main/java/pub/doric/shader/ViewNode.java b/Android/doric/src/main/java/pub/doric/shader/ViewNode.java index e03d3ad6..6f3bda4d 100644 --- a/Android/doric/src/main/java/pub/doric/shader/ViewNode.java +++ b/Android/doric/src/main/java/pub/doric/shader/ViewNode.java @@ -86,16 +86,12 @@ public abstract class ViewNode extends DoricContextHolder { protected void blend(T view, ViewGroup.LayoutParams layoutParams, String name, JSValue prop) { switch (name) { case "width": - if (prop.asNumber().toInt() < 0) { - layoutParams.width = prop.asNumber().toInt(); - } else { + if (layoutParams.width >= 0) { layoutParams.width = DoricUtils.dp2px(prop.asNumber().toFloat()); } break; case "height": - if (prop.asNumber().toInt() < 0) { - layoutParams.height = prop.asNumber().toInt(); - } else { + if (layoutParams.height >= 0) { layoutParams.height = DoricUtils.dp2px(prop.asNumber().toFloat()); } break; diff --git a/demo/src/Counter.ts b/demo/src/Counter.ts index 8107b065..5da84dc6 100644 --- a/demo/src/Counter.ts +++ b/demo/src/Counter.ts @@ -1,4 +1,4 @@ -import { Image, ViewHolder, VMPanel, ViewModel, Gravity, NativeCall, Text, Color, VLayout, log, logw, loge, Group, } from "doric" +import { Image, ViewHolder, VMPanel, ViewModel, Gravity, NativeCall, Text, Color, VLayout, log, logw, loge, Group, LayoutSpec, } from "doric" interface CountModel { @@ -57,6 +57,10 @@ class CounterView extends ViewHolder { // iv.width = iv.height = 100 iv.imageUrl = "https://misc.aotu.io/ONE-SUNDAY/SteamEngine.png" //iv.bgColor = Color.parse('#00ff00') + iv.layoutConfig = { + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, + } root.addChild(iv) } diff --git a/demo/src/Snake.ts b/demo/src/Snake.ts index 68e6bde8..617d0306 100644 --- a/demo/src/Snake.ts +++ b/demo/src/Snake.ts @@ -1,4 +1,4 @@ -import { loge, log, ViewHolder, Stack, ViewModel, Gravity, Text, Color, HLayout, VLayout, Group, VMPanel } from "doric"; +import { loge, log, ViewHolder, Stack, ViewModel, Gravity, Text, Color, HLayout, VLayout, Group, VMPanel, LayoutSpec } from "doric"; type SnakeNode = { x: number @@ -154,10 +154,14 @@ class SnakeView extends ViewHolder { margin: { top: 20 }, + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, } vlayout.space = 20 vlayout.layoutConfig = { - alignment: new Gravity().centerX().top() + alignment: new Gravity().centerX().top(), + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, } this.panel.bgColor = Color.parse('#00ff00') vlayout.addChild(title) @@ -165,11 +169,20 @@ class SnakeView extends ViewHolder { root.addChild(vlayout) const hlayout = new HLayout - this.start.text = "Start" - this.start.textSize = 30 - this.start.textColor = Color.parse("#ffffff") - - hlayout.addChild(this.start) + hlayout.layoutConfig = { + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, + } + hlayout.addChild(this.start.also( + it => { + it.text = "Start" + it.textSize = 30 + it.textColor = Color.parse("#ffffff") + it.layoutConfig = { + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, + } + })) vlayout.addChild(hlayout) @@ -182,7 +195,9 @@ class SnakeView extends ViewHolder { controlArea.gravity = new Gravity().centerX() controlArea.space = 10 controlArea.layoutConfig = { - alignment: new Gravity().centerX() + alignment: new Gravity().centerX(), + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, } const line1 = new HLayout const line2 = new HLayout @@ -191,6 +206,14 @@ class SnakeView extends ViewHolder { line2.addChild(this.left) line2.addChild(this.down) line2.addChild(this.right) + line1.layoutConfig = { + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, + } + line2.layoutConfig = { + widthSpec: LayoutSpec.WRAP_CONTENT, + heightSpec: LayoutSpec.WRAP_CONTENT, + } controlArea.addChild(line1) controlArea.addChild(line2) vlayout.addChild(controlArea) diff --git a/js-framework/src/ui/panel.ts b/js-framework/src/ui/panel.ts index 5c3708de..e2abef1e 100644 --- a/js-framework/src/ui/panel.ts +++ b/js-framework/src/ui/panel.ts @@ -99,7 +99,7 @@ export abstract class Panel { private retrospectView(ids: string[]): View { return ids.reduce((acc: View, cur) => { if (Reflect.has(acc, "subViewById")) { - return Reflect.get(acc, "subViewById")(cur) + return Reflect.apply(Reflect.get(acc, "subViewById"), acc, [cur]) } return acc }, this.__root__) diff --git a/js-framework/src/ui/view.ts b/js-framework/src/ui/view.ts index 9a8d5959..b222309e 100644 --- a/js-framework/src/ui/view.ts +++ b/js-framework/src/ui/view.ts @@ -19,9 +19,25 @@ import { uniqueId } from "../util/uniqueId"; import { Gravity } from "../util/gravity"; import { loge } from "../util/log"; -export const MATCH_PARENT = -1 +export enum LayoutSpec { + EXACTLY = 0, + WRAP_CONTENT = 1, + AT_MOST = 2, +} + +export interface LayoutConfig { + widthSpec?: LayoutSpec + heightSpec?: LayoutSpec + margin?: { + left?: number, + right?: number, + top?: number, + bottom?: number, + } + alignment?: Gravity +} + -export const WRAP_CONTENT = -2 export function Property(target: Object, propKey: string) { Reflect.defineMetadata(propKey, true, target) @@ -29,10 +45,10 @@ export function Property(target: Object, propKey: string) { export abstract class View implements Modeling { @Property - width: number = WRAP_CONTENT + width: number = 0 @Property - height: number = WRAP_CONTENT + height: number = 0 @Property x: number = 0 @@ -70,7 +86,7 @@ export abstract class View implements Modeling { } @Property - layoutConfig?: Config + layoutConfig?: LayoutConfig @Property onClick?: Function @@ -216,21 +232,11 @@ export abstract class View implements Modeling { } } -export interface Config { - margin?: { - left?: number, - right?: number, - top?: number, - bottom?: number, - } - alignment?: Gravity -} - -export interface StackConfig extends Config { +export interface StackConfig extends LayoutConfig { } -export interface LinearConfig extends Config { +export interface LinearConfig extends LayoutConfig { weight?: number } @@ -239,16 +245,6 @@ export interface SuperView { } export abstract class Group extends View implements SuperView { - - subViewById(id: string): View | undefined { - for (let view of this.children) { - if (view.viewId === id) { - return view - } - } - return undefined - } - @Property readonly children: View[] = new Proxy([], { set: (target, index, value) => { @@ -269,6 +265,14 @@ export abstract class Group extends View implements SuperView { } }) + subViewById(id: string): View | undefined { + for (let view of this.children) { + if (view.viewId === id) { + return view + } + } + return undefined + } addChild(view: View) { this.children.push(view) } @@ -461,27 +465,4 @@ export class Slide extends View implements SuperView { private renderBunchedPages(pages: number[]): View[] { return pages.map(e => this.getPage(e)) } -} - - - -export function stack() { - -} - -export function vlayout(providers: Array<() => View>, config: { - width: number - height: number - space?: number -}) { - const vlayout = new VLayout - vlayout.width = config.width - vlayout.height = config.height - if (config.space !== undefined) { - vlayout.space = config.space - } - providers.forEach(e => { - vlayout.addChild(e()) - }) - return vlayout -} +} \ No newline at end of file