是否可以在 VStack 中以仅向下推动其下方的项目而不向上推动其上方项目的方式填充项目?

Question

标题有点难以表达，但这是我的情况。 我有一个 VStack，我需要对堆栈中点击的项目下方形成的间隙进行动画处理。

例如，我尝试将.padding(.bottom，istappped ？ 50 ： 0(添加到项目中，但它没有产生预期的结果。例如，如果项目 X 是我点击的项目，这就是我使用此方法获得的行为

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

基本上，正如我试图说明的那样，它将 X 上方的项目向上推，并将 X 下方的项目向下推。

有什么办法可以去做我想做的事情吗？一种将 X 及其上方的项目固定到位的方法，以便只有下面的项目会移动？

编辑： 这是一个更真实的例子，当点击中间项时，它会导致在其下方添加填充，但不幸的是，这不仅仅是将前 2 个留在原地并将第三个向下推。但它将前 2 个向上移动，第三个向下移动。(此外，填充不会如以下示例所示，而是在项目视图本身中，如果这有所不同(

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

Answer 1

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

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

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

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