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

Add more Layout test demo

Browse Source
This commit is contained in:
pengfei.zhou 2022-08-05 11:22:37 +08:00 committed by osborn
parent c34f1f82b1
commit e042ce732e
1 changed files with 71 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
doric-demo/src/LayoutTestDemo.tsx
View File

@ -19,12 +19,15 @@ function Grid(props: { title: string; innerElement: JSX.Element }) {
text={props.title} text={props.title}
backgroundColor={Color.parse("#3498db")} backgroundColor={Color.parse("#3498db")}
textColor={Color.WHITE} textColor={Color.WHITE}
textAlignment={Gravity.CenterX} textAlignment={Gravity.CenterY.left()}
layoutConfig={layoutConfig().mostWidth().justHeight()} layoutConfig={layoutConfig()
height={30} .mostWidth()
.fitHeight()
.configMinHeight(30)}
maxLines={0}
/> />
<Stack <Stack
layoutConfig={layoutConfig().just()} layoutConfig={layoutConfig().just().fitHeight()}
width={300} width={300}
height={300} height={300}
backgroundColor={Color.parse("#ecf0f1")} backgroundColor={Color.parse("#ecf0f1")}
@ -169,6 +172,70 @@ class LayoutTest extends Panel {
gravity={Gravity.Center} gravity={Gravity.Center}
space={20} space={20}
> >
<Grid
title={`
VLayout(w=fit, h=fit)
> VLayout(w=fit ,h=just&weight)
> > Text(w=fit, h=fit)
> > Stack(w=most, h=just)
> Stack(w=most, h=just)
`}
>
<VLayout>
<VLayout
layoutConfig={layoutConfig()
.fitWidth()
.justHeight()
.configWeight(1)}
>
<Text>Content</Text>
<Stack
layoutConfig={layoutConfig().mostWidth().justHeight()}
height={20}
backgroundColor={Color.RED.alpha(0.1)}
/>
</VLayout>
<Stack
layoutConfig={layoutConfig().mostWidth().justHeight()}
height={20}
backgroundColor={Color.BLUE.alpha(0.1)}
></Stack>
</VLayout>
</Grid>
<Grid
title={`
HLayout(w=fit, h=fit)
> VLayout(w=fit ,h=just&weight)
> > Text(w=fit, h=fit)
> > Stack(w=most, h=just)
> Stack(w=most, h=just)
`}
>
<HLayout>
<VLayout
layoutConfig={layoutConfig()
.justWidth()
.fitHeight()
.configWeight(1)}
>
<Text>Content</Text>
<Stack
layoutConfig={layoutConfig().mostWidth().justHeight()}
height={20}
backgroundColor={Color.RED.alpha(0.1)}
/>
</VLayout>
<Stack
layoutConfig={layoutConfig().mostHeight().justWidth()}
width={20}
backgroundColor={Color.BLUE.alpha(0.1)}
></Stack>
</HLayout>
</Grid>
<Grid title="VLayout fit -> VLayout weight -> fit , most"> <Grid title="VLayout fit -> VLayout weight -> fit , most">
<VLayout> <VLayout>
<VLayout <VLayout