gpt4 book ai didi

android - Compose 布局垂直对齐 : SpaceBetween having no impact

转载 作者:行者123 更新时间:2023-12-04 23:57:28 27 4
gpt4 key购买 nike

我想将 Upcoming 文本推到底部,而 7 pax 文本保留在顶部。我对该列使用了 verticalArrangement = Arrangement.SpaceBetween,但它没有任何效果,因为该列没有占据全高。如果我对列使用 fillMaxHeight 以强制它采用全高,则整行采用全屏高度,这不是预期的。我该如何解决这个问题?

@Composable
fun SoFixClientTourCard() {
Column {
Row(
verticalAlignment = Alignment.Top,
modifier = Modifier
.background(Color.White)
.fillMaxWidth()
.padding(16.dp)
) {

// calendar
Column(
horizontalAlignment = Alignment.CenterHorizontally,
modifier = Modifier
.padding(top = 4.dp)
.background(MaterialTheme.colors.error)
.shadow(1.dp)
.padding(horizontal = 8.dp, vertical = 4.dp)
) {
Text("02", fontSize = 14.sp, fontWeight = FontWeight.Bold, color = Color.White)
Text("OCT", fontSize = 12.sp, fontWeight = FontWeight.Bold, color = Color.White)
}

// tour & package name
Column(
modifier = Modifier
.padding(horizontal = 16.dp)
.weight(1f)
) {
Text("Tanguar Haor Tour", style = MaterialTheme.typography.subtitle1, fontWeight = FontWeight.Bold)
Text(
"Couple Non-AC + Single Non-AC + Family Non-AC + Couple AC",
style = MaterialTheme.typography.body2,
lineHeight = 20.sp,
modifier = Modifier.padding(top = 4.dp)
)
}

// FIXME: Align status to the bottom, pax to the top
// pax & status
Column(
horizontalAlignment = Alignment.End,
verticalArrangement = Arrangement.SpaceBetween,
) {
Text("7 pax", fontSize = XS)
val status = "Upcoming"
Text(
status,
fontSize = XXXS,
color = Color.White,
modifier = Modifier
.padding(top = 4.dp) // top margin
.background(
when (status.lowercase()) {
"upcoming" -> MaterialTheme.colors.primary
"cancelled" -> MaterialTheme.colors.error
else -> Color.DarkGray
}
)
.padding(horizontal = 8.dp, vertical = 4.dp)
)
}
}
}
}

enter image description here

感谢您的帮助!

最佳答案

您可以申请 intrinsic measurements到它的父容器,在你的例子中是 Row
添加height(IntrinsicSize.Min) Row 的修饰符和第 3 个 ColumnfillMaxHeight() 修饰符。像这样的东西:

Column {
Row(
verticalAlignment = Alignment.Top,
modifier = Modifier
.background(Color.White)
.fillMaxWidth()
.padding(16.dp)
.height(IntrinsicSize.Min)
) {

//....

// pax & status
Column(
modifier= Modifier.fillMaxHeight(),
horizontalAlignment = Alignment.End,
verticalArrangement = Arrangement.SpaceBetween,
) {
//...
}
}
}

enter image description here

关于android - Compose 布局垂直对齐 : SpaceBetween having no impact,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69127581/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com