tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

update demo

Browse Source
This commit is contained in:
pengfei.zhou 2019-12-14 16:32:04 +08:00
parent 74ee52ed09
commit 02615bc17e
22 changed files with 223 additions and 223 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/AnimatorDemo.ts
View File

@ -9,7 +9,7 @@ function thisLabel(str: string) {
backgroundColor: colors[0],
textSize: 15,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
})
}
@ -173,11 +173,11 @@ class AnimatorDemo extends Panel {
stack([
view,
]).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
backgroundColor: colors[1].alpha(0.3 * 255),
}),
]).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
gravity: gravity().center(),
space: 10,
} as IVLayout).in(rootView)

6
src/ComplicatedAnimations.ts
View File

@ -9,7 +9,7 @@ function thisLabel(str: string) {
backgroundColor: colors[0],
textSize: 10,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
})
}
@ -190,11 +190,11 @@ class AnimationDemo extends Panel {
v.scaleX = 1.5
})
]).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
backgroundColor: colors[1].alpha(0.3 * 255),
}),
]).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
gravity: gravity().center(),
space: 10,
} as IVLayout).in(rootView)

8
src/ComplicatedDemo.ts
View File

@ -14,7 +14,7 @@ class MyDemo extends Panel {
header: pullable(
stack([]).apply({
backgroundColor: Color.RED,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: 100,
height: 30,
}),
@ -32,7 +32,7 @@ class MyDemo extends Panel {
renderItem: (idx) => {
return listItem(text({
text: `Item :${idx}`,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: root.width,
height: 50,
textColor: Color.WHITE,
@ -42,14 +42,14 @@ class MyDemo extends Panel {
}).apply({
}),
}).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).also(v => {
v.top = 200
}),
headerImage = image({
imageUrl: "https://img.zcool.cn/community/01e75b5da933daa801209e1ffa4649.jpg@1280w_1l_2o_100sh.jpg",
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: root.width,
height: 200,
scaleType: ScaleType.ScaleAspectFill,

12
src/Counter.ts
View File

@ -12,8 +12,8 @@ class CounterView extends ViewHolder {
textSize: 40,
layoutConfig: {
alignment: Gravity.Center,
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
}).also(it => { this.number = it }),
text({
@ -26,8 +26,8 @@ class CounterView extends ViewHolder {
corners: 5,
layoutConfig: {
alignment: Gravity.Center,
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
padding: {
left: 10,
@ -69,8 +69,8 @@ class CounterView extends ViewHolder {
root.addChild((new Image).also(iv => {
iv.imageUrl = "https://misc.aotu.io/ONE-SUNDAY/SteamEngine.png"
iv.layoutConfig = {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
}
}))
}

34
src/EffectsDemo.ts
View File

@ -50,7 +50,7 @@ class EffectsDemo extends Panel {
width: 5,
color: colors[3]
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -65,7 +65,7 @@ class EffectsDemo extends Panel {
width: 100,
height: 100,
corners: 10,
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
bottom: 10
})
}),]).apply({
@ -84,7 +84,7 @@ class EffectsDemo extends Panel {
offsetY: 3,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
bottom: 10
})
}),]).apply({
@ -103,7 +103,7 @@ class EffectsDemo extends Panel {
color: colors[3]
},
corners: 10,
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -128,7 +128,7 @@ class EffectsDemo extends Panel {
offsetY: 3,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
bottom: 10
})
}),]).apply({
@ -148,7 +148,7 @@ class EffectsDemo extends Panel {
offsetY: 3,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
bottom: 10
})
}),]).apply({
@ -172,7 +172,7 @@ class EffectsDemo extends Panel {
offsetY: 3,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -196,7 +196,7 @@ class EffectsDemo extends Panel {
offsetY: 0,
radius: 10,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 10,
right: 10,
bottom: 10,
@ -218,7 +218,7 @@ class EffectsDemo extends Panel {
offsetY: 5,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 10,
right: 10,
bottom: 10,
@ -240,7 +240,7 @@ class EffectsDemo extends Panel {
offsetY: 5,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 10,
right: 10,
bottom: 10,
@ -262,7 +262,7 @@ class EffectsDemo extends Panel {
offsetY: 5,
radius: 5,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 10,
right: 10,
bottom: 10,
@ -279,7 +279,7 @@ class EffectsDemo extends Panel {
width: 100,
height: 100,
corners: 50,
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -296,7 +296,7 @@ class EffectsDemo extends Panel {
corners: {
leftTop: 50,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -313,7 +313,7 @@ class EffectsDemo extends Panel {
corners: {
rightTop: 50,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -330,7 +330,7 @@ class EffectsDemo extends Panel {
corners: {
leftBottom: 50,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -347,7 +347,7 @@ class EffectsDemo extends Panel {
corners: {
rightBottom: 50,
},
layoutConfig: layoutConfig().exactly().m({
layoutConfig: layoutConfig().just().configMargin({
left: 5,
right: 5,
bottom: 5,
@ -361,7 +361,7 @@ class EffectsDemo extends Panel {
it.space = 20
}),
).also(it => {
it.layoutConfig = layoutConfig().atmost()
it.layoutConfig = layoutConfig().most()
}).in(rootView)
}
}

10
src/FlowLayoutDemo.ts
View File

@ -16,7 +16,7 @@ const imageUrls = [
class FlowDemo extends Panel {
build(rootView: Group): void {
flowlayout({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
itemCount: 100,
columnCount: 3,
columnSpace: 10,
@ -25,13 +25,13 @@ class FlowDemo extends Panel {
return new FlowLayoutItem().apply({
backgroundColor: colors[idx % colors.length],
height: 50 + (idx % 3) * 20,
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
}).also(it => {
it.addChild(text({
text: `${idx}`,
textColor: Color.WHITE,
textSize: 20,
layoutConfig: layoutConfig().wrap().a(Gravity.Center)
layoutConfig: layoutConfig().fit().configAligmnet(Gravity.Center)
}))
})
},
@ -45,13 +45,13 @@ class FlowDemo extends Panel {
it.loadMoreView = new FlowLayoutItem().apply({
backgroundColor: colors[500 % colors.length],
height: 50,
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
}).also(it => {
it.addChild(text({
text: 'load more',
textColor: Color.WHITE,
textSize: 20,
layoutConfig: layoutConfig().wrap().a(Gravity.Center)
layoutConfig: layoutConfig().fit().configAligmnet(Gravity.Center)
}))
})
})

14
src/ImageDemo.ts
View File

@ -10,7 +10,7 @@ class ImageDemo extends Panel {
scroller(vlayout([
text({
text: "Image Demo",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[5],
@ -59,7 +59,7 @@ class ImageDemo extends Panel {
color: Color.GRAY,
},
scaleType: ScaleType.ScaleToFill,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
loadCallback: (ret) => {
}
}),
@ -73,7 +73,7 @@ class ImageDemo extends Panel {
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFit,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
}),
label('ScaleAspectFill'),
image({
@ -85,7 +85,7 @@ class ImageDemo extends Panel {
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
}),
label('ImageBase64'),
image({
@ -97,14 +97,14 @@ class ImageDemo extends Panel {
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
}),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(rootView)
}
}

8
src/InputDemo.ts
View File

@ -7,7 +7,7 @@ class InputDemo extends Panel {
vlayout([
title("Input Demo"),
(new Input).also(it => {
it.layoutConfig = layoutConfig().exactly().h(LayoutSpec.WRAP_CONTENT)
it.layoutConfig = layoutConfig().just().configHeight(LayoutSpec.FIT)
it.width = 300
it.multiline = false
it.hintText = "HintText"
@ -20,7 +20,7 @@ class InputDemo extends Panel {
}
}),
(new Input).also(it => {
it.layoutConfig = layoutConfig().wrap()
it.layoutConfig = layoutConfig().fit()
it.hintText = "HintText"
it.hintTextColor = colors[2]
it.textAlignment = Gravity.Left
@ -36,10 +36,10 @@ class InputDemo extends Panel {
])
.also(it => {
it.space = 10
it.layoutConfig = layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT)
it.layoutConfig = layoutConfig().most().configHeight(LayoutSpec.FIT)
}))
.apply({
layoutConfig: layoutConfig().atmost()
layoutConfig: layoutConfig().most()
})
.in(root)
}

134
src/LayoutDemo.ts
View File

@ -103,8 +103,8 @@ class LayoutDemo extends Panel {
hlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -114,8 +114,8 @@ class LayoutDemo extends Panel {
width: 200,
height: 30,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -124,8 +124,8 @@ class LayoutDemo extends Panel {
box(3),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -134,8 +134,8 @@ class LayoutDemo extends Panel {
width: 200,
height: 30,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -145,8 +145,8 @@ class LayoutDemo extends Panel {
box(2),
boxStr('weight=1', 4).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -154,8 +154,8 @@ class LayoutDemo extends Panel {
width: 200,
height: 30,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -163,15 +163,15 @@ class LayoutDemo extends Panel {
hlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -180,8 +180,8 @@ class LayoutDemo extends Panel {
width: 200,
height: 30,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -189,22 +189,22 @@ class LayoutDemo extends Panel {
hlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
boxStr('weight=1', 4).apply({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -212,8 +212,8 @@ class LayoutDemo extends Panel {
width: 200,
height: 30,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -291,29 +291,29 @@ class LayoutDemo extends Panel {
vlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
},
}),
box(2).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
}
}),
box(4).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
}
}),
]).apply({
width: 100,
height: 200,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -321,29 +321,29 @@ class LayoutDemo extends Panel {
vlayout([
box(3).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
},
}),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
box(4).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
}
}),
]).apply({
width: 100,
height: 200,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -351,20 +351,20 @@ class LayoutDemo extends Panel {
vlayout([
box(3).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
},
}),
box(2).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
},
}),
boxStr('weight=1', 4).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -372,8 +372,8 @@ class LayoutDemo extends Panel {
width: 100,
height: 200,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -381,30 +381,30 @@ class LayoutDemo extends Panel {
vlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
},
}),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
box(4).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
}
}),
]).apply({
width: 100,
height: 200,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -412,22 +412,22 @@ class LayoutDemo extends Panel {
vlayout([
boxStr('weight=1', 3).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
},
}),
boxStr('weight=1', 2).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
boxStr('weight=1', 4).apply({
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
weight: 1,
}
}),
@ -435,8 +435,8 @@ class LayoutDemo extends Panel {
width: 100,
height: 200,
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
backgroundColor: Color.parse('#eeeeee'),
gravity: gravity().center(),
@ -453,7 +453,7 @@ class LayoutDemo extends Panel {
it.space = 20
}),
).also(it => {
it.layoutConfig = layoutConfig().atmost()
it.layoutConfig = layoutConfig().most()
})
.in(rootView)
}

30
src/ListDemo.ts
View File

@ -9,8 +9,8 @@ class ListPanel extends Panel {
text({
text: "ListDemo",
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
},
textSize: 30,
textColor: Color.parse("#535c68"),
@ -33,7 +33,7 @@ class ListPanel extends Panel {
}
it.loadMoreView = listItem(text({
text: "Loading",
layoutConfig: layoutConfig().atmost().h(LayoutSpec.EXACTLY).a(Gravity.Center),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST).configAligmnet(Gravity.Center),
height: 50,
}))
it.renderItem = (idx: number) => {
@ -42,8 +42,8 @@ class ListPanel extends Panel {
hlayout([
text({
layoutConfig: {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.JUST,
alignment: gravity().center(),
},
text: `Cell At Line ${idx}`,
@ -59,8 +59,8 @@ class ListPanel extends Panel {
}).also(it => {
counter = it
it.layoutConfig = {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
margin: {
left: 10,
}
@ -68,8 +68,8 @@ class ListPanel extends Panel {
})
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.FIT,
margin: {
bottom: 2,
}
@ -83,8 +83,8 @@ class ListPanel extends Panel {
})
).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.FIT,
}
it.onClick = () => {
log(`Click item at ${idx}`)
@ -107,16 +107,16 @@ class ListPanel extends Panel {
itemCount: 0,
renderItem: () => new ListItem,
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.MOST,
},
}),
}),
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.MOST,
}
it.backgroundColor = Color.WHITE
}).in(rootView)

24
src/ModalDemo.ts
View File

@ -7,7 +7,7 @@ class ModalDemo extends Panel {
scroller(vlayout([
text({
text: "Modal",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[1],
@ -21,7 +21,7 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).toast('This is a toast.')
}
@ -33,7 +33,7 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).toast('This is a toast.', Gravity.Top)
}
@ -46,14 +46,14 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).toast('This is a toast.', Gravity.Center)
}
} as IText),
text({
text: "Alert",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[2],
@ -66,7 +66,7 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).alert({
msg: 'This is alert.',
@ -79,7 +79,7 @@ class ModalDemo extends Panel {
} as IText),
text({
text: "Confirm",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[3],
@ -92,7 +92,7 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).confirm({
msg: 'This is Confirm.',
@ -110,7 +110,7 @@ class ModalDemo extends Panel {
} as IText),
text({
text: "Prompt",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[4],
@ -123,7 +123,7 @@ class ModalDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
modal(context).prompt({
msg: 'This is Prompt.',
@ -140,11 +140,11 @@ class ModalDemo extends Panel {
}
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: Gravity.Center,
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(rootView)
}
}

14
src/NavbarDemo.ts
View File

@ -12,7 +12,7 @@ class NavbarDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navbar(context).isHidden().then(e => modal(context).alert(`Navbar isHidden:${e}`)).catch(e => {
modal(context).alert(e)
@ -25,7 +25,7 @@ class NavbarDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navbar(context).isHidden()
.then(e => navbar(context).setHidden(!e))
@ -40,7 +40,7 @@ class NavbarDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navbar(context).setTitle('Setted Title')
.catch(e => {
@ -54,7 +54,7 @@ class NavbarDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navbar(context).setBgColor(Color.YELLOW)
.catch(e => {
@ -68,17 +68,17 @@ class NavbarDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navigator(context).pop()
}
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(rootView)
}
}

10
src/NavigatorDemo.ts
View File

@ -9,7 +9,7 @@ class NaivgatorDemo extends Panel {
scroller(vlayout([
text({
text: "Navigator Demo",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[1],
@ -26,7 +26,7 @@ class NaivgatorDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().just().configWidth(LayoutSpec.MOST),
onClick: () => {
navigator(context).push(`assets://demo/${e}.js`, {
alias: `${e}.js`,
@ -43,17 +43,17 @@ class NaivgatorDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
navigator(context).pop()
},
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(root)
}

6
src/NetworkDemo.ts
View File

@ -12,7 +12,7 @@ class NetworkDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
network(context).get('https://m.baidu.com').then(
e => {
@ -24,11 +24,11 @@ class NetworkDemo extends Panel {
}
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(rootView)
}
}

8
src/PopoverDemo.ts
View File

@ -12,14 +12,14 @@ class PopoverDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
popover(context).show(text({
width: 200,
height: 50,
backgroundColor: colors[0],
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly().a(Gravity.Center),
layoutConfig: layoutConfig().just().configAligmnet(Gravity.Center),
text: "This is PopOver Window",
}).also(v => {
let idx = 0
@ -34,11 +34,11 @@ class PopoverDemo extends Panel {
}
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(rootView)
}
}

14
src/RefreshableDemo.ts
View File

@ -6,7 +6,7 @@ class RefreshableDemo extends Panel {
build(rootView: Group): void {
let refreshImage: Image
let refreshView = refreshable({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
onRefresh: () => {
log('onRefresh')
setTimeout(() => {
@ -16,7 +16,7 @@ class RefreshableDemo extends Panel {
header: pullable(
stack([
image({
layoutConfig: layoutConfig().exactly().m({ top: 50, bottom: 10, }),
layoutConfig: layoutConfig().just().configMargin({ top: 50, bottom: 10, }),
width: 30,
height: 30,
imageBase64: icon_refresh,
@ -43,7 +43,7 @@ class RefreshableDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
refreshView.setRefreshing(context, true)
}
@ -54,7 +54,7 @@ class RefreshableDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
refreshView.setRefreshing(context, false)
}
@ -66,7 +66,7 @@ class RefreshableDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
refreshView.setRefreshable(context, true)
}
@ -78,13 +78,13 @@ class RefreshableDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
refreshView.setRefreshable(context, false)
}
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().centerX(),
space: 10,
} as IVLayout))

6
src/ScrollerDemo.ts
View File

@ -9,7 +9,7 @@ class ScrollerPanel extends Panel {
scroller(
vlayout(new Array(100).fill(1).map(e => label('Scroll Content')))
).apply({
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: 300,
height: 500,
backgroundColor: Color.RED,
@ -17,7 +17,7 @@ class ScrollerPanel extends Panel {
scroller(
vlayout(new Array(100).fill(1).map(e => label('Scroll Content')))
).apply({
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: 300,
height: 500,
backgroundColor: Color.BLUE,
@ -25,7 +25,7 @@ class ScrollerPanel extends Panel {
])
)
.apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.EXACTLY),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST),
height: 500,
backgroundColor: Color.YELLOW,
})

14
src/SliderDemo.ts
View File

@ -19,8 +19,8 @@ class SliderPanel extends Panel {
text({
text: "Gallery",
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.JUST,
},
textSize: 30,
textColor: Color.WHITE,
@ -34,7 +34,7 @@ class SliderPanel extends Panel {
return slideItem(image({
imageUrl: imageUrls[idx % imageUrls.length],
scaleType: ScaleType.ScaleAspectFit,
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST).h(LayoutSpec.AT_MOST).a(gravity().center()),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST).configHeight(LayoutSpec.MOST).configAligmnet(gravity().center()),
})).also(it => {
let start = idx
it.onClick = () => {
@ -43,15 +43,15 @@ class SliderPanel extends Panel {
})
},
layoutConfig: {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.FIT,
weight: 1,
},
}),
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.MOST,
}
}))
}

44
src/Snake.ts
View File

@ -155,8 +155,8 @@ class SnakeView extends ViewHolder {
margin: {
top: 20
},
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
}),
(new Stack).also(panel => {
@ -169,14 +169,14 @@ class SnakeView extends ViewHolder {
textSize: 30,
textColor: Color.parse("#ffffff"),
layoutConfig: {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
}).also(it => this.start = it),
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
}
}),
@ -190,14 +190,14 @@ class SnakeView extends ViewHolder {
textAlignment: new Gravity().center(),
backgroundColor: Color.parse('#ffff00'),
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
}).also(it => this.up = it)
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
}
}),
hlayout([
@ -209,8 +209,8 @@ class SnakeView extends ViewHolder {
textAlignment: new Gravity().center(),
backgroundColor: Color.parse('#ffff00'),
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
}).also(it => this.left = it),
text({
@ -221,8 +221,8 @@ class SnakeView extends ViewHolder {
textAlignment: new Gravity().center(),
backgroundColor: Color.parse('#ffff00'),
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
}).also(it => this.down = it),
text({
@ -233,14 +233,14 @@ class SnakeView extends ViewHolder {
textAlignment: new Gravity().center(),
backgroundColor: Color.parse('#ffff00'),
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
}).also(it => this.right = it),
]).also(it => {
it.layoutConfig = {
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
}
it.space = 10
}),
@ -249,16 +249,16 @@ class SnakeView extends ViewHolder {
controlArea.space = 10
controlArea.layoutConfig = {
alignment: new Gravity().centerX(),
widthSpec: LayoutSpec.WRAP_CONTENT,
heightSpec: LayoutSpec.WRAP_CONTENT,
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
}
}),
]).also(it => {
it.space = 20
it.layoutConfig = {
alignment: new Gravity().centerX().top(),
widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST,
widthSpec: LayoutSpec.MOST,
heightSpec: LayoutSpec.MOST,
}
it.gravity = new Gravity().centerX()
}).in(root)

26
src/StickDemo.ts
View File

@ -4,7 +4,7 @@ import { title, colors } from "./utils";
function tab(idx: number, title: string, sliderView: Slider) {
return text({
text: title,
layoutConfig: layoutConfig().exactly().wg(1),
layoutConfig: layoutConfig().just().configWeight(1),
height: 41,
onClick: () => {
sliderView.slidePage(context, 0, true)
@ -27,13 +27,13 @@ class StickDemo extends Panel {
vlayout([
stack([
image({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
imageUrl: "https://p.upyun.com/demo/webp/webp/jpg-0.webp",
scaleType: ScaleType.ScaleAspectFill,
}),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.EXACTLY),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST),
height: 200,
backgroundColor: colors[0],
}),
@ -42,7 +42,7 @@ class StickDemo extends Panel {
...this.tabs = [0, 1, 2].map(idx => {
return text({
text: `Tab ${idx}`,
layoutConfig: layoutConfig().exactly().wg(1),
layoutConfig: layoutConfig().just().configWeight(1),
height: 41,
onClick: () => {
this.sliderView.slidePage(context, idx, true)
@ -50,12 +50,12 @@ class StickDemo extends Panel {
})
})
]).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
gravity: Gravity.Center,
} as IHLayout),
this.indicator,
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.EXACTLY),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.JUST),
height: 57,
}),
@ -66,7 +66,7 @@ class StickDemo extends Panel {
}
[0, 1, 2].map(idx => {
return flowlayout({
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: root.width,
height: root.height - 57,
itemCount: 100,
@ -77,13 +77,13 @@ class StickDemo extends Panel {
return new FlowLayoutItem().apply({
backgroundColor: colors[itemIdx % colors.length],
height: 50,
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.JUST),
}).also(it => {
it.addChild(text({
text: `In Page ${idx},${itemIdx}`,
textColor: Color.WHITE,
textSize: 20,
layoutConfig: layoutConfig().wrap().a(Gravity.Center)
layoutConfig: layoutConfig().fit().configAligmnet(Gravity.Center)
}).also(v => {
v.onClick = () => {
v.text = "Clicked"
@ -96,16 +96,16 @@ class StickDemo extends Panel {
v.addSlideItem(e)
})
}).apply({
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
width: root.width,
height: root.height - 57,
}),
])
.also(it => {
it.layoutConfig = layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT)
it.layoutConfig = layoutConfig().most().configHeight(LayoutSpec.FIT)
}))
.apply({
layoutConfig: layoutConfig().atmost()
layoutConfig: layoutConfig().most()
})
.in(root)
this.indicator.centerX = this.getRootView().width / this.tabs.length / 2
@ -120,7 +120,7 @@ class StickDemo extends Panel {
e.textColor = Color.BLACK
}
})
this.indicator.layoutConfig = layoutConfig().exactly().a(Gravity.Bottom).m({ bottom: 13 })
this.indicator.layoutConfig = layoutConfig().just().configAligmnet(Gravity.Bottom).configMargin({ bottom: 13 })
animate(context)({
animations: () => {
this.indicator.centerX = this.getRootView().width / this.tabs.length * (page + 0.5)

14
src/StorageDemo.ts
View File

@ -17,7 +17,7 @@ class StorageDemo extends Panel {
scroller(vlayout([
text({
text: "Storage Demo",
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[1],
@ -26,7 +26,7 @@ class StorageDemo extends Panel {
}),
label('Stored'),
text({
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 20,
textColor: Color.WHITE,
backgroundColor: colors[3],
@ -39,7 +39,7 @@ class StorageDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
storage(context).getItem(storedKey, zone).then(e => {
modal(context).prompt({
@ -60,7 +60,7 @@ class StorageDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
storage(context).remove(storedKey, zone).then(e => {
this.update()
@ -73,7 +73,7 @@ class StorageDemo extends Panel {
backgroundColor: colors[0],
textSize: 30,
textColor: Color.WHITE,
layoutConfig: layoutConfig().exactly(),
layoutConfig: layoutConfig().just(),
onClick: () => {
storage(context).clear(zone).then(e => {
this.update()
@ -81,11 +81,11 @@ class StorageDemo extends Panel {
},
} as IText),
]).apply({
layoutConfig: layoutConfig().atmost().h(LayoutSpec.WRAP_CONTENT),
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
gravity: gravity().center(),
space: 10,
} as IVLayout)).apply({
layoutConfig: layoutConfig().atmost(),
layoutConfig: layoutConfig().most(),
}).in(root)
this.update()
}

4
src/utils.ts
View File

@ -39,7 +39,7 @@ export function boxStr(str: string, idx = 0) {
export function title(str: string) {
return text({
text: str,
layoutConfig: layoutConfig().w(LayoutSpec.AT_MOST),
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[1],
@ -53,7 +53,7 @@ export function rotatedArrow() {
return pullable(
stack([
image({
layoutConfig: layoutConfig().exactly().m({ top: 50, bottom: 10, }),
layoutConfig: layoutConfig().just().configMargin({ top: 50, bottom: 10, }),
width: 30,
height: 30,
imageBase64: icon_refresh,