add border for h & v layout, stack, scroller & text
fix background color transparent
This commit is contained in:
王劲鹏
2021-04-19 14:05:21 +08:00
committed by osborn
parent e42b5c8400
commit bb03b8b5a3
7 changed files with 102 additions and 81 deletions

View File

@@ -1,86 +1,47 @@
import { Group, Panel, text, gravity, Color, LayoutSpec, vlayout, hlayout, scroller, layoutConfig, stack, Gravity } from "doric";
import { Group, Panel, text, gravity, Color, LayoutSpec, vlayout, hlayout, scroller, layoutConfig } from "doric";
import { colors } from "./utils";
@Entry
class LayoutDemo extends Panel {
build(rootView: Group) {
hlayout([
vlayout([
stack([], {
width: 100,
height: 100,
backgroundColor: Color.RED,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.GREEN,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.BLUE,
layoutConfig: layoutConfig().just()
})
scroller(
vlayout(
[
text({
text: "五子棋",
layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
textSize: 30,
textColor: Color.WHITE,
backgroundColor: colors[0],
textAlignment: gravity().center(),
height: 50,
}),
hlayout(
[
text({
text: "当前:",
textSize: 20,
textColor: Color.WHITE,
layoutConfig: layoutConfig().just().configWeight(1),
height: 50,
backgroundColor: colors[1],
}),
text({
text: "获胜方:",
textSize: 20,
textColor: Color.WHITE,
layoutConfig: layoutConfig().just().configWeight(1),
height: 50,
backgroundColor: colors[2],
}),
],
{
layoutConfig: layoutConfig().fit().configWidth(LayoutSpec.MOST),
}),
], {
width: 100,
height: 300,
layoutConfig: layoutConfig().just()
}),
vlayout([
stack([], {
width: 100,
height: 100,
backgroundColor: Color.GREEN,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.BLUE,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.RED,
layoutConfig: layoutConfig().just()
})
], {
width: 100,
height: 300,
layoutConfig: layoutConfig().just()
}),
vlayout([
stack([], {
width: 100,
height: 100,
backgroundColor: Color.BLUE,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.RED,
layoutConfig: layoutConfig().just()
}),
stack([], {
width: 100,
height: 100,
backgroundColor: Color.GREEN,
layoutConfig: layoutConfig().just()
})
], {
width: 100,
height: 300,
layoutConfig: layoutConfig().just()
layoutConfig: layoutConfig().most(),
backgroundColor: Color.parse('#ecf0f1'),
})
], {
width: 400,
height: 300,
layoutConfig: layoutConfig().just(),
backgroundColor: Color.BLACK
}).in(rootView)
).in(rootView)
}
}