Jetpack Compose - 关于预览 widthDp 和 heightDp
Jetpack Compose - About Preview widthDp and heightDp
什么是 widthDp 和 heightDp 作为 @Preview 参数？
【我的环境】
- Android 北极狐工作室 | 2020.3.1 补丁 3 build 2021 年 10 月 1 日
- Gradle: 7.0.2
- AGP: 7.0.3
- androidx.compose.ui:ui-工具预览:1.0.1
这是我的代码。
@Preview(
showBackground = true,
widthDp = 200,
heightDp = 200,
)
@Composable
fun DefaultPreview() {
Box(modifier = Modifier.size(100.dp).background(Color.Red))
}
预览如下。
但我预期低于。
盒子尺寸好像比我想象的要大。
有人解释一下吗？
来自 Preview.kt 代码库，
@param widthDp Max width in DP the annotated @[Composable] will be
rendered in. Use this to restrict the size of the rendering
viewport.
@param heightDp Max height in DP the annotated
@[Composable] will be rendered in. Use this to restrict the size of
the rendering viewport.
参数是为了限制最大渲染视口。
如果给定尺寸比可组合项的实际尺寸 large/smaller，它们似乎会缩放可组合项。
这在某种程度上是@Preview 的一个错误，第一个可组合项占据了他们拥有的漏洞 space，无法解释原因。即使没有这两个参数widthDp = 200, heightDp = 300, 第一个Box 也拿走了所有的space。因此，现在要获得您想要的结果，您必须在其周围放置一个“保护”主要可组合项的框。
什么是 widthDp 和 heightDp 作为 @Preview 参数？
【我的环境】
- Android 北极狐工作室 | 2020.3.1 补丁 3 build 2021 年 10 月 1 日
- Gradle: 7.0.2
- AGP: 7.0.3
- androidx.compose.ui:ui-工具预览:1.0.1
这是我的代码。
@Preview(
showBackground = true,
widthDp = 200,
heightDp = 200,
)
@Composable
fun DefaultPreview() {
Box(modifier = Modifier.size(100.dp).background(Color.Red))
}
预览如下。
但我预期低于。
盒子尺寸好像比我想象的要大。 有人解释一下吗？
来自 Preview.kt 代码库，
@param widthDp Max width in DP the annotated @[Composable] will be rendered in. Use this to restrict the size of the rendering viewport.
@param heightDp Max height in DP the annotated @[Composable] will be rendered in. Use this to restrict the size of the rendering viewport.
参数是为了限制最大渲染视口。
如果给定尺寸比可组合项的实际尺寸 large/smaller，它们似乎会缩放可组合项。
这在某种程度上是@Preview 的一个错误，第一个可组合项占据了他们拥有的漏洞 space，无法解释原因。即使没有这两个参数widthDp = 200, heightDp = 300, 第一个Box 也拿走了所有的space。因此，现在要获得您想要的结果，您必须在其周围放置一个“保护”主要可组合项的框。