如果这样的代码:
Text(
"Text with background",
Modifier.drawBackground(Color.Magenta, RectangleShape).padding(10.dp)
)
Text(
"Text with background",
Modifier.padding(10.dp).drawBackground(Color.Magenta, RectangleShape)
)
喷气背包组合配置
composeOptions {
kotlinCompilerVersion "1.3.70-dev-withExperimentalGoogleExtensions-20200424"
kotlinCompilerExtensionVersion = "0.1.0-dev10"
}
implementation 'androidx.ui:ui-framework:0.1.0-dev10'
implementation 'androidx.ui:ui-layout:0.1.0-dev10'
implementation 'androidx.ui:ui-material:0.1.0-dev10'
implementation 'androidx.ui:ui-tooling:0.1.0-dev10'
最佳答案
Jetpack compose 中修饰符的顺序很重要
为了让它可见,我将它包裹在一个灰色背景的父级中:
Column {
// It just draws a background with out any padding
Stack(modifier = Modifier.drawBackground(Color.Gray)) {
Text(
"Order of modifiers are important",
Modifier.drawBackground(Color.Magenta, RectangleShape)
)
}
Spacer(modifier = Modifier.height(20.dp))
// In this one we put the padding modifier before the drawBackground
// It first adds a padding, what should be the color of that padding?
// so far we didn't tell any thing about it to Jetpack compose so it's transparent
// and shows the color of parent layout that's gray color
// then draws the background behind the content of Text(but doesn't change the color of padding)
Stack(modifier = Modifier.drawBackground(Color.Gray)) {
Text(
"Order of modifiers are important",
Modifier.padding(10.dp).drawBackground(Color.Magenta, RectangleShape)
)
}
Spacer(modifier = Modifier.height(20.dp))
// In this one we put the padding modifier after the drawBackground
// It first draws a background behind the text
// then padding applies but this time it's not transparent, it inherits the color of
// backgroundColor
Stack(modifier = Modifier.drawBackground(Color.Gray)) {
Text(
"Order of modifiers are important",
Modifier.drawBackground(Color.Magenta, RectangleShape).padding(10.dp)
)
}
}
关于android - Jetpack Compose 文本显示混淆,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62017566/