Jetpackcompose-lazycolumn-fillMaxHeight修改器隐藏下面的小部件，但不破坏上面的小部

Question

我正在尝试构建一个简单的聊天屏幕，它有一个页眉、一个页脚(文本字段(和作为lazycolumn的消息部分。我见过很多人使用这样的方法，比如下面的方法：(填充父母的最大身高、尺寸等(

https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/LazyItemScope

我只能在lazycolumn修饰符中输入fillMaxHeight、width或size，如果我使用fillMaxHeight，它会破坏页脚，如果我不使用任何东西，lazycolumm会扩展到屏幕底部，所以它也会执行同样的行为。我做错了什么？为什么它会这样？我不能放图片，因为我没有足够的声誉。。。

这是完整的代码：

class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
Surface() {
Column(Modifier.background(Color.Green)) {
ProfileCard("Kate", "Available")
Conversation(messages = SampleData.conversationSample)
SimpleTextField()
}
}
}
}
}
@Composable
fun Conversation(messages: List<Message>) {
LazyColumn(
modifier = Modifier
.background(color = MainBg).fillMaxHeight(),
reverseLayout = true,
) {
items(messages) { message ->
MessageCard(message)
}
}
}
@Composable
fun MessageCard(message: Message) {
var isExpanded by remember { mutableStateOf(false) }
Column() {
Text(
text = message.message,
color = com.boradincer.hellojetpack.ui.theme.PrimaryText,
modifier = Modifier
.padding(vertical = 4.dp, horizontal = 16.dp)
.clip(RoundedCornerShape(4.dp))
.background(color = LightBg)
.clickable { isExpanded = !isExpanded }
.padding(horizontal = 8.dp, vertical = 5.dp),
maxLines = if (isExpanded) Int.MAX_VALUE else 2
)
}
}

Answer 1

将Modifier.weight(1f)应用于LazyColumn

Column(){
Header()
LazyColumn(Modifier.weight(1f)) {
//....
}
Footer()
}

使用fillMaxHeight()修改器将使LazyColumn填充整个可用高度。

weight修饰符需要一个ColumnScope。在您的情况下，使用修饰符作为参数：

@Composable
fun Conversation(
modifier: Modifier = Modifier,
messages: List<Message>
){
LazyColumn(modifier) {
//...
}
}
Column(){
//
Conversation(
modifier = Modifier.weight(1f),
messsages = list
) {
//....
}  
}