SwiftUI：标签栏中的动画标签项 addition/removal

Question

在我的应用程序中，我 add/remove 一个子视图 to/from 一个 TabView 基于某些条件。我想为标签栏中的标签项 addition/removal 设置动画。我的实验（见下面的代码）表明它不起作用。我在网上看到 TabView 对动画的支持非常有限，有些人推出了自己的实现。但是为了以防万一，有没有可能实现呢？

import SwiftUI

struct ContentView: View {
    @State var showBoth: Bool = false

    var body: some View {
        TabView {
            Button("Test") {
                withAnimation {
                    showBoth.toggle()
                }
            }
                .tabItem {
                    Label("1", systemImage: "1.circle")
                }

            if showBoth {
                Text("2")
                    .tabItem {
                        Label("2", systemImage: "2.circle")
                    }
                    .transition(.slide)
            }
        }
    }
}

注意：将 transition() 调用移动到 Label 传递给 tabItem() 也不起作用。

Answer 1

正如所评论的那样，Apple 希望 TabBar 在整个应用程序中保持不变。
但是您可以完全控制地简单地实现自己的 Tabbar：

struct ContentView: View {
    
    @State private var currentTab = "One"
    @State var showBoth: Bool = false

    var body: some View {
        VStack {
            TabView(selection: $currentTab) {
                // Tab 1.
                VStack {
                    Button("Toggle 2. Tab") {
                        withAnimation {
                            showBoth.toggle()
                        }
                    }
                } .tag("One")
                
                // Tab 2.
                VStack {
                    Text("Two")
                } .tag("Two")
            }
            
            // custom Tabbar buttons
            Divider()
            HStack {
                OwnTabBarButton("One", imageName: "1.circle")
                
                if showBoth {
                OwnTabBarButton("Two", imageName: "2.circle")
                    .transition(.scale)
                }
            }
        }
    }
    
    func OwnTabBarButton(_ label: String, imageName: String) -> some View {
        Button {
            currentTab = label
        } label: {
            VStack {
                Image(systemName: imageName)
                Text(label)
            }
        }
        .padding([.horizontal,.top])
    }
}

SwiftUI：标签栏中的动画标签项 addition/removal

SwiftUI: animating tab item addition/removal in tab bar

animation

tabview

swiftui