近期在熟悉Compose日常控件使用,
@Composable
inline fun Column(
modifier: Modifier = Modifier,
verticalArrangement: Arrangement.Vertical = Arrangement.Top,
horizontalAlignment: Alignment.Horizontal = Alignment.Start,
content: @Composable ColumnScope.() -> Unit
)
inline fun Row(
modifier: Modifier = Modifier,
horizontalArrangement: Arrangement.Horizontal = Arrangement.Start,
verticalAlignment: Alignment.Vertical = Alignment.Top,
content: @Composable RowScope.() -> Unit
)
这两位兄弟的二个属性,每次看了使用说明感慨原来如此。突然在项目用时一脸懵逼的跑去网上看看怎么用,才能如何实现UI设计稿效果。
关于Column的verticalArrangement 给的一张直观图(网上盗图,不过我在Arragement类里属性值里面并没有找到EqualWeight属性):
至于horizontalAlignment:可理解为组合控件类对齐方式,相关属性值如下:
@Stable
val Start: Horizontal = BiasAlignment.Horizontal(-1f)
@Stable
val CenterHorizontally: Horizontal = BiasAlignment.Horizontal(0f)
@Stable
val End: Horizontal = BiasAlignment.Horizontal(1f)
关于Row组合控件理解可以从Column组件中二个属性类比理解。Column是竖直摆放子控件,它的属性verticalArrangement针对于竖直子控件叠放规律。而Row控件水平叠放控件,故子控件水平摆放规律,其属性名horizontalArrangement,对应于属性值如下。
horizontalArrangement(水平方向设定)
Start,End,Center,SpaceEvenly,SpaceAround,SpaceBetween
可参考Column属性verticalArrangement图
另外水平摆放的控件,是顶部对齐?居中对齐?还是底部对齐?其属性名verticalAlignment对应于属性值如下:
@Stable
val Top: Vertical = BiasAlignment.Vertical(-1f)
@Stable
val CenterVertically: Vertical = BiasAlignment.Vertical(0f)
@Stable
val Bottom: Vertical = BiasAlignment.Vertical(1f)