feat:complete defination of LayoutConfig

This commit is contained in:
pengfei.zhou 2019-10-23 15:59:55 +08:00
parent eeed67b57a
commit f78f3ed7d8
10 changed files with 107 additions and 73 deletions

View File

@ -26,7 +26,7 @@ android {
afterEvaluate {
buildJSBundle.exec()
buildDemo.exec()
buildDebugger.exec()
//buildDebugger.exec()
}
task buildJSBundle(type: Exec) {

View File

@ -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) {

View File

@ -116,12 +116,42 @@ public abstract class GroupNode<F extends ViewGroup> extends ViewNode<F> {
}
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()) {

View File

@ -50,7 +50,7 @@ public class LinearNode extends GroupNode<LinearLayout> {
@Override
protected ViewGroup.LayoutParams generateDefaultLayoutParams() {
return new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
return new LinearLayout.LayoutParams(0, 0);
}
@Override

View File

@ -62,6 +62,6 @@ public class StackNode extends GroupNode<FrameLayout> {
@Override
protected ViewGroup.LayoutParams generateDefaultLayoutParams() {
return new FrameLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
return new FrameLayout.LayoutParams(0, 0);
}
}

View File

@ -86,16 +86,12 @@ public abstract class ViewNode<T extends View> 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;

View File

@ -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)
}

View File

@ -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)

View File

@ -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__)

View File

@ -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
}
}