SwiftUI：删除列表中的动画？

Posted 2023-02-24

【中文标题】SwiftUI：删除列表中的动画？

【英文标题】：SwiftUI: delete animation in List?

【发布时间】：2021-09-29 16:44:31

【问题描述】：

我有一个显示项目列表的 SwiftUI 视图。视图非常大，所以我不会在这里粘贴整个内容。但是，List 使用 ForEach：

ForEach(model.items, id: \.id)  item in
    myCell(item: item)

一切正常。我想要做的是在模型中删除项目时有一个简单的幻灯片动画。

我在堆栈上查看了这个答案：

Insert, update and delete animations with ForEach in SwiftUI

但是，我的设置不同，我不确定如何尝试将其应用于我的案例。在该链接中，项目存储为视图中的 @State 属性。

我的设置是视图用作@StateObject：

@StateObject var model = MyViewModel()

模型有这个：

@Published var items = [MyStruct]()

列表的单元格允许滑动操作，用户点击删除，视图告诉模型删除该特定项目。

然后该模型具有启动并最终（几乎立即）从其items 中删除相关项目的异步逻辑。当发生这种情况时，列表会更新，单元格会消失并且一切正常。

我想添加一个单元格删除动画。鉴于我的设置，我该怎么做？

编辑

尝试添加更多代码来帮助处理上下文。

删除是从这样的警报触发的：

return Alert(
    title: Text(title),
    message: Text("You cannot undo this action"),
    primaryButton: .destructive(Text("Delete")) 
    withAnimation 
        model.deleteItem(id)
    
    ,
    secondaryButton: .cancel()
)

我添加了withAnimation，但没有任何改变。

【问题讨论】：

您可能只需要在删除逻辑中添加withAnimation。但是，如果没有看到minimal reproducible example，就不可能确定。

如果删除发生在模型类中，我将如何添加withAnimation？

您将删除内容包含在withAnimation 中

【参考方案1】：

好的，

所以我发现是什么导致即使withAnimation 也无法正常工作。

我的模型有一个电话：

model.deleteItem(id)

在内部，作为删除该项目所需工作的一部分，deleteItem(id) 使用Task.init ... 任务。然后我跳回到 main 然后更新模型中的项目@Published var items = [MyStruct]()。

它的异步特性破坏了withAnimation。

我从items 中删除了该项目并将其留在sync 中withAnimation 调用中，现在默认删除动画有效。

因此，只要在 withAnimation 调用中同步删除，动画就会开始。