android - Jetpack Compose，Modifier.size() 使用移动比例锚

Question

注意缩放锚点如何随着图像的增长而变化。

首先，根据父布局，锚点位于左上角（应该是）

@Composable
inline fun Box(
    modifier: Modifier = Modifier,
    contentAlignment: Alignment = Alignment.TopStart,
    content: @Composable BoxScope.() -> Unit
) {

然后当图像宽度等于父宽度时，锚点移动到中心顶部。然后当图像高度大于父高度时，它再次移动到图像的中心。

这是我用来重现此内容的代码：https ://github.com/feresr/ComposeBugMaybe/blob/master/app/src/main/java/com/feresr/composebug/MainActivity.kt

这是预期的行为吗？如果是这样，我该如何禁用它？我希望锚最好保持固定在给定点（左上角）。我觉得这种行为很奇怪，因为我没有Modifier.offset()以任何方式改变。

标签： androidandroid-jetpackandroid-jetpack-compose

Answer 1

解决方案TL;DR

对孩子使用Modifier.wrapContentSize(Alignment, true)基本上是告诉它的父母“我会忽略你的约束并以这种对齐方式定位自己）”。未能对Modifier.wrapContentSize孩子使用只会居中（只要它违反了父约束 - 这是“撰写”默认行为）

无界参数确定这是否适用于最大约束。在这种情况下，它应该是正确的，因为当鸭子违反最大约束时它会居中。

完整解释

（来自谷歌的亚当鲍威尔）：

这与 Compose UI 的布局系统的工作方式有关。当一个 compose UI 元素被测量时，父级为子级提供一组约束 - 最小和最大宽度和高度。如果子级返回的大小与约束不兼容，则父级会看到子级的大小被钳制为与约束兼容。

当父母放置行为不端的孩子时，孩子的实际位置相对于父母看到的夹紧大小矩形居中

这有助于编写和安排有严格要求的 UI 元素，同时确定故障发生的位置；它还有助于在较大的最小尺寸区域内放置绝对尺寸元素的简单情况

Modifier.size- 而不是Modifier.preferredSize- 告诉一个元素忽略它被测量的约束并且无论如何都是给定的大小。

因此，如果您Modifier.size(100.dp)在一个只有 50dp 大的容器内使用，它会按照您的要求进行操作，但是父级会将该元素定位为只有 50dp

这就是您在这里看到的 - 鸭子比容器大，因此它以这种默认行为为中心。首先沿着水平轴，因为它首先变得大于可用宽度，然后沿着垂直轴，一旦它变得对于可用高度来说太大了。当内容变得太大（或太小）而无法满足约束条件时，修饰符可以通过实施解决策略来改变这种行为。Modifier.wrapContentSize 就是一个例子；它放宽了最小尺寸限制，并允许您提供元素应如何定位在最小尺寸内的选项

请注意，它wrapContentSize有一个无界参数，允许元素大于可用大小，这似乎与您的情况特别相关。将此应用于子元素的修饰符Box

引用自 Slack 线程https://kotlinlang.slack.com/archives/CJLTWPH7S/p1609086849306600