Jetpack Compose_Alignment对其+Arrangement排列

1.Alignment 对齐

1.1Alignment 对齐方式

Alignment

类型对齐方式说明
AlignmentTopStart顶部左对齐
TopCenter顶部居中对齐
TopEnd顶部右对齐
CenterStart居中左对齐
Center居中
CenterEnd居中右对齐
BottomStart底部左对齐
BottomCenter底部居中
BottomEnd底部右对齐
Alignment.VerticalTop竖直的置顶
CenterVertically竖直的居中
Bottom竖直的置底
Alignment.HorizontalStart水平的置左
CenterHorizontally水平的居中
End水平的置右

疑问:为什么有 Alignment 了,还需要有 Alignment.VerticalAlignment.Horizontal 呢?
因为有些控件,如 Row 只能调整竖直方向上的对齐方式,水平方向上调的是 Arrangement 排列,因此对齐枚举需要限制为特定方向上的


1.2AbsoluteAlignment 绝对对齐

AbsoluteAlignment
不知道布局方向的常见对齐方式的集合。

类型对齐方式说明
AlignmentTopLeft左上角
TopRight右上角
CenterLeft居中左侧
CenterRight居中右侧
BottomLeft底部左侧
BottomRight底部右侧
Alignment.HorizontalLeft水平方向左侧
Right水平方向右侧

当不知道是横向还是纵向布局方式时使用,暂时还没想到应用场景。(欢迎评论补充)


1.3BiasAlignment 偏差对齐

BiasAlignment
-1: 表示 start/top
0: 表示 center
1: 表示 end/bottom

data class BiasAlignment(
    val horizontalBias: Float, // 水平方向对齐方式
    val verticalBias: Float // 竖直方向对齐方式
)

1.4BiasAbsoluteAlignment偏差绝对对齐

BiasAbsoluteAlignment
-1: 表示对齐到左上角
0: 表示居中
1: 表示右下角
就是在 左上角右下角 这条斜线上对齐

data class BiasAbsoluteAlignment(
    private val horizontalBias: Float,
    private val verticalBias: Float
)

2.Arrangement 排列

2.1Arrangement 排列方式

Arrangement

对齐方式说明
Equal Weight等宽/高
Space Between等间距
Space Around每个item等padding
Space Evenly每个item等margin
End尾部对其
Center居中
Start头部对其

2.2Arrangement.Horizontal

如:RowhorizontalArrangement

2.3Arrangement.Vertical

如:ColumnverticalArrangement


参考:
androidx.compose.foundation.layout
Componse教程 | 关于 Alignment与Arrangement

  • 19
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

莫探科技

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值