SwiftUI（测试版6）-对视图进行动画重排序

Question

我正在寻找一种使视图重新排序动画的方法。 最初，我在VStack中实现了如下视图：

@State var someState: State

var body: some View {
    VStack {
        createView(forType: someState.orderedTypes[0])
        createView(forType: someState.orderedTypes[1])
        createView(forType: someState.orderedTypes[2])
    }
}

func createView(forType type: SomeExampleType) -> some View {
    return ...
}

随着@State变量的更改，创建视图的顺序也可能更改。 我最初尝试解决

.animate(.easeOut)

在VStack的末尾，但它仅对子视图中的某些更改进行动画处理，而不对它们的顺序进行动画处理。 我也尝试过使用List而不是VStack，但是那里也没有运气。 有人对我如何实现这一目标有任何提示，而不必求助于笨拙的ZStack / padding废话吗？

Answer 1

只要您将它放在ForEach ，并使您的视图取决于状态，这对我来说基本上是有效的。

@State var items: [Int] = [1, 2, 3, 4, 5]

var body: some View {
    VStack {
        ForEach(items, id: \.self) {
            self.view(with: $0 % 2 == 0 ? .text : .image)
        }
        .animation(.default)

        Button("Randomize") {
            self.items.shuffle()
        }
    }
}

private func view(with type: ViewType) -> some View {
    switch type {
    case .text:
        return AnyView(Text("text"))
    case .image:
        return AnyView(Image(systemName: "house"))
    }
}