布局垂直对齐: SpaceBetween没有影响
布局垂直对齐: SpaceBetween没有影响
提问于 2021-09-10 05:18:40
我希望将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)
)
}
}
}
}
谢谢你的帮忙!
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-09-10 05:42:25
您可以将本征测量应用于其父容器，在您的例子中是Row。
将高度(IntrinsicSize.Min)修饰符添加到Row中，将fillMaxHeight()修饰符添加到第3 Column。类似于：
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,
) {
//...
}
}
}
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69127581
复制相关文章
相似问题
腾讯云开发者
