0

标题有点难用，但这是我的情况。我有一个 VStack，我需要为在堆栈中被点击的项目下方形成的间隙设置动画。

例如，我尝试将 .padding(.bottom, isTapped ? 50 : 0) 添加到项目中，但它不会产生所需的结果。例如，如果项目 X 是我点击的项目，这就是我使用此方法得到的行为

empty space -->  X-1
X-1         -->  X
X           -->  space created
X+1         -->  X+1
empty space -->  empty space

基本上，正如我试图说明的那样，它向上推动 X 上方的项目以及向下推动其下方的项目。

有什么办法可以去做我想做的事吗？一种方法来修复 X ​​和它上面的项目，以便只有下面的项目会移动？

编辑：这是一个更真实的示例，当点击中间项目时，会导致在其下方添加填充，但不幸的是，这不仅仅将前 2 个保留在原处并将第三个向下推。但是它将前两个向上移动，第三个向下移动。（此外，填充也不会像下面的示例所示那样放置，而是在项目视图本身中，如果这会有所不同的话）

VStack{
  Item().padding(.bottom, isTapped ? 50: 0)
  Item().padding(.bottom, isTapped ? 50: 0)
  Item().padding(.bottom, isTapped ? 50: 0)
}
4

1 回答 1

0

VStack 根据其内容选择其大小。听起来包含 VStack 的视图有很多额外的垂直空间。由于 VStack 小于其父视图，因此它在其父视图内居中（上方和下方留出空白空间。）当 VStack 垂直增长时（添加填充时），它保持居中并将在两个方向上增长，向上和下。

您可以通过在其下方添加一个 Spacer 并将两者包装在一个新的 VStack 中来将您的 VStack 固定在其超级视图的顶部。然后，当填充添加到项目时，VStack 将保持固定在顶部，任何额外的空间都将添加到下方。

    VStack {
        VStack {
            // Items:  X-1, X, X + 1                
         }
        Spacer()
    }

如果这不能解决您的问题，请显示您的代码。视图的对齐和放置取决于您的特定代码。

于 2019-09-20T00:51:36.117 回答