SwiftUI、导航视图和目标中的动画转换。 VStack 有效但 List 无效

Question

如果我使用 List，RoundedRectangle 会“动画化”但会“卡入”。是 SwiftUI 错误还是我？

此外，如果第三个导航 link 被注释掉，则矩形视图中的按钮会将应用弹出回导航视图。下次我去矩形它已经改变了颜色。这只发生在 VStack 上，List 不受影响。这根本没有意义。

import SwiftUI

struct ContentView: View {
    @State var fff: Bool = false
    var body: some View {
        NavigationView {
            VStack { // <---- This works if I have three navigation links, but not if I have only two.
//          List { // <------ This does not work.
                NavigationLink(
                    destination:
                        ZStack {
                            if fff {
                                RoundedRectangle(cornerRadius: 100) .foregroundColor(.blue)
                                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                                    .animation(.easeIn)
                            }
                            else {
                                RoundedRectangle(cornerRadius: 100) .foregroundColor(.purple)
                                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                                    .animation(.easeIn)
                            }
                            Button(action: {
                                fff.toggle()
                            }, label: {
                                Text("Button")
                            })
                        }
                    ,
                    label: {
                        Text("To rectangles")
                    }
                )
                NavigationLink(
                    destination: Text("Settings"),
                    label: {
                        HStack {
                            Image(systemName: "wrench")
                            Text("Settings")
                        }
                    }
                )
//              NavigationLink( <--- If this link is commented out then the button in the rectangles view pops the app back to the Navigation view (only when using VStack).
//                  destination: Text("Store"),
//                  label: {
//                      HStack {
//                          Image(systemName: "cart")
//                          Text("Store")
//                      }
//                  }
//              )
            }
        }
    }
}

Answer 1

将目标移动到不同的结构可以解决问题。

struct RectView: View {
    @State var fff: Bool = false
    var body: some View {
        ZStack {
            if fff {
                RoundedRectangle(cornerRadius: 100) .foregroundColor(.blue)
                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                    .animation(.easeIn)
            } else {
                RoundedRectangle(cornerRadius: 100) .foregroundColor(.purple)
                    .transition(.asymmetric(insertion: .move(edge: .bottom), removal: .move(edge: .top)))
                    .animation(.easeIn)
            }
            Button(action: {
                fff.toggle()
            }, label: {
                Text("Button")
            })
        }
    }
}

SwiftUI、导航视图和目标中的动画转换。 VStack 有效但 List 无效

SwiftUI, Navigation view and animated transitions in destination. VStack works but List does not

transition

swiftui