android - Jetpack Compose - 关于预览 widthDp 和 heightDp

Question

什么是widthDp和heightDp作为@Preview参数？

【我的环境】</p>

• Android Studio 北极狐 | 2020.3.1 Patch3 构建于 2021 年 10 月 1 日
• 摇篮：7.0.2
• AGP：7.0.3
• androidx.compose.ui:ui-tooling-preview:1.0.1

这是我的代码。

@Preview(
    showBackground = true,
    widthDp = 200,
    heightDp = 200,
)
@Composable
fun DefaultPreview() {
    Box(modifier = Modifier.size(100.dp).background(Color.Red))
}

预览如下。

但我预计在下面。

似乎盒子尺寸比我预期的要大。有人解释吗？

Answer 1

这在某种程度上是@Preview 的一个错误，第一个可组合项占用了它们拥有的孔空间，无法解释原因。即使没有这两个参数widthDp = 200, heightDp = 300,，第一个 Box 也会占用所有空间。因此，现在要获得您想要的结果，您必须在其周围放置一个“保护”主要可组合项的框。

Answer 2

从Preview.kt代码库，

@param widthDp 带注释的@[Composable] 将在其中渲染的 DP 中的最大宽度。使用它来限制渲染视口的大小。
@param heightDp 带注释的@[Composable] 将在 DP 中渲染的最大高度。使用它来限制渲染视口的大小。

这些参数用于限制最大渲染视口。
如果给定尺寸大于/小于可组合物的实际尺寸，它们似乎会缩放可组合物。