Eug*_*ene 63 android android-jetpack-compose
我正在创建一个 Jetpack Compose 对话框,其中包含一个列,其中所有元素都应始终可见,但第三个元素除外,第三个元素是一个文本,如果文本不适合屏幕空间,则该文本应该是可滚动的。我几乎通过仅用于该文本元素的辅助可滚动列实现了这一点。但是,如果有大量文本,此实现会将底部子项(按钮)推到视图之外。这是我的代码:
@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 = {}
)
}
Run Code Online (Sandbox Code Playgroud)
当只有一段文本时,它(正确地)看起来是这样的:
但这就是当有三个段落时的样子。文本正确滚动,但请注意缺少“继续”按钮:
Fra*_*esc 137
将其用于您的中间(可滚动)可组合项
Column(
modifier = Modifier
.verticalScroll(rememberScrollState())
.weight(weight = 1f, fill = false)
) {
Text("Your text here")
}
Run Code Online (Sandbox Code Playgroud)
关键是要用fill = false。
Gab*_*tti 43
只需应用于可滚动Column修饰符即可weight。
就像是:
Column (verticalArrangement= Arrangement.SpaceBetween) {
Text(
"viewModel.title",
)
Column(
modifier = Modifier
.verticalScroll(rememberScrollState())
.weight(1f, false)
) {
Text("...")
}
Button()
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
73550 次 |
| 最近记录: |