SwiftUI TabView 动画

Question

我目前在我的应用程序上遇到了问题。我想要对由 SwiftUI TabView 控制的项目的插入和删除进行动画处理。

以下是一个简单的视图，用于重现此问题。

struct ContentView: View {
    @State private var selection: Int = 1
    var body: some View {
        TabView(selection: $selection.animation(),
                content:  {
                    Text("Tab Content 1")
                        .transition(.slide) //could be anything this is for example
                        .tabItem { Text("tab1") }.tag(1)
                        .onAppear() {print("testApp")}
                        .onDisappear(){print("testDis")}
                    Text("Tab Content 2")
                        .transition(.slide)
                        .tabItem { Text("tab2") }.tag(2)
                })
       
    }
}

当点击选项卡时，它会立即从“选项卡内容1”切换到“选项卡内容2”，我想对其进行动画处理（不是选项卡按钮而是实际的选项卡内容）。由于按预期调用了onAppear和onDisapear，因此应该触发所有的过渡效果。

如果有人有想法开始处理，我会非常高兴。

谢谢。

- FitzChill

---

抱歉，最近工作量很大，这个问题在我的优先事项中排名很低。我进行了快速测试，它可以正常工作。 - FitzChill

Answer 1

1. 使用 .transition() 时，我们只需指定应使用哪个过渡。

2. 只有在显式动画发生时，才会发生过渡（如预期）。

3. 在发生更改（状态、绑定）时才会发生动画。

这是其中一种可能的方法。

    struct ContentView: View {
        @State private var selection: Int = 1
        var body: some View {
            TabView(selection: $selection,
                    content:  {
                        ItemView(text:"1")
                            .tabItem { Text("tab1") }.tag(1)
                        ItemView(text: "2")
                            .tabItem { Text("tab2") }.tag(2)
                    })
            
        }
    }
    
    struct ContentView_Previews: PreviewProvider {
        static var previews: some View {
            ContentView()
        }
    }
    
    
    struct ItemView: View {
        let text: String
        @State var hidden = true
        
        var body: some View {
            VStack {
                if !hidden {
                    Text("Tab Content " + text)
                        .transition(.slide) 
                }
            }
            .onAppear() { withAnimation {
                hidden = false
            }}
            .onDisappear(){hidden = true}
            
        }
    }

- YodagamaHeshan