SwiftUI VStack内标题视图移除无过渡动画该如何修复

这个问题是两个常见的SwiftUI动画配置缺失导致的，按以下步骤修改即可实现预期效果：

1. 为标题添加入场/离场过渡 #

给需要显隐的Text视图添加过渡效果，指定淡出的离场动画：

@ViewBuilder
func title() -> some View {
    if let currentPage = modelController.currentPage,
       currentPage < 6 {
        Text("Create Event")
            .transition(.opacity) // 可按需替换为.opacity.combined(with: .move(edge: .top))实现边淡出边上移的效果
    }
    // 不需要显式返回EmptyView，条件不成立时默认不会插入视图
}

2. 绑定动画触发条件 #

二选一即可：

• 方案A：在VStack上添加animation修饰符，绑定到控制显隐的状态变量，状态变化时自动触发全局动画

var body: some View {
    VStack {
        title()
        //..other views here
    }
    .animation(.easeInOut(duration: 0.3), value: modelController.currentPage)
}

• 方案B：在修改currentPage值的代码处用withAnimation包裹，仅在当前修改场景触发动画

// 写在修改currentPage的位置
withAnimation(.easeInOut(duration: 0.3)) {
    modelController.currentPage = 6
}

修改后标题会按配置的时长平滑淡出，下方视图也会同步平滑上移，不会出现跳变。

内容的提问来源于stack exchange，提问作者Tometoyou