android - 如何创建一个 Jetpack Compose Column,其中中间的孩子是可滚动的,但所有其他孩子总是可见的?
问题描述
我正在创建一个 Jetpack 撰写对话框,其中包含一个列,其中所有元素都应该始终可见,除了第三个元素,它是一个文本,如果文本不适合屏幕空间,则应该可以滚动。我几乎通过仅用于该 Text 元素的辅助可滚动列来实现这一点。但是,如果有很多文本,此实现会将底部子项(按钮)推到视野之外。这是我的代码:
@Composable
fun WelcomeView(
viewModel: WelcomeViewModel,
onDismiss: () -> Unit
) {
Dialog(onDismissRequest = onDismiss) {
Box(
modifier = Modifier
.clip(RoundedCornerShape(Spacing.extraLarge))
.background(Colors.backgroundBase)
.padding(all = Spacing.medium)
) {
Column {
IconView(
name = IconViewNames.RUNNING_SHOE,
size = IconViewSizes.LARGE,
color = Colors.primaryBase
)
Text(
viewModel.title,
style = Text.themeBillboard,
modifier = Modifier.padding(bottom = Spacing.medium)
)
Column(
modifier = Modifier
.verticalScroll(rememberScrollState())
) {
Text(
viewModel.message,
style = Text.themeHeadline,
modifier = Modifier.padding(bottom = Spacing.medium)
)
}
Button(
onClick = onDismiss,
modifier = Modifier
.fillMaxWidth()
.clip(RoundedCornerShape(Spacing.medium))
.background(Colors.primaryBase)
) {
Text(
"Continue",
style = Text.themeHeadline.copy(color = textExtraLight),
modifier = Modifier.padding(all = Spacing.extraSmall)
)
}
}
}
}
}
@Preview
@Composable
fun PreviewWelcomeView() {
WelcomeView(
viewModel = WelcomeViewModel(
firstName = "Wendy",
htmlWelcomeMessage = PreviewTextFixtures.threeParagraphs
),
onDismiss = {}
)
}
当只有一段文本时,它(正确地)看起来是这样的:
但这就是当有三个段落时的样子。文本可以正确滚动,但请注意缺少“继续”按钮:
解决方案
只需将修饰符分配给可滚动Column
的weight
修饰符。
就像是:
Column (verticalArrangement= Arrangement.SpaceBetween) {
Text(
"viewModel.title",
)
Column(
modifier = Modifier
.verticalScroll(rememberScrollState())
.weight(1f, false)
) {
Text("...")
}
Button()
}
推荐阅读
- css - 尝试使用 React-JSS 实现动态值
- python - 在自定义场景运行器期间的第一次测试中刷新 pytest 固定装置
- python - 使用时间列将 pandas 数据帧写入 influxdb
- javascript - 如何使用开玩笑酶查找推断类型
- php - 如何使用 cURL 从自身连接到 PHP 容器?
- azure - cosmos3.6 mongoDB API 在复合索引上的问题
- ansible - Ansible 命令行限制参数
- javascript - 如何在特定主题标签中获取 Instagram 用户创建的帖子?
- python-3.x - PySide2 更新图表
- node.js - node.js 为什么在重新启动服务器后,保存在 json 文件中的 post 请求中的数据会重置为初始空数组?