SwiftUI (beta 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: [=10=] % 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"))
    }
}

SwiftUI (beta 6) - 动画重新排序视图

SwiftUI (beta 6) - Animate re-ordering of views

ios

swift

swiftui