使 TabView 在 SwiftUI 上不透明会在顶部产生一个新视图

Question

大家好。我正在创建一个简单的 SwiftUI 应用程序，我希望我的应用程序的 TabView 具有自定义背景而不是半透明的。

为了实现这一点，我使用UITabBar.appearance().backgroundColor = Colorand UITabBar.appearance().isTranslucent = false，它应该完全做到这一点，是的，它使栏不透明，但不是为栏提供我选择的颜色，而是在选项卡栏顶部生成一个新视图，该视图不是“不应该在那里，显然以前不存在。

不改变标签栏的透明度和颜色

更改标签栏的透明度和颜色

您可以注意到出现的新视图。我想这是一个问题，isTranslucent因为当我删除它时，新视图消失了。

有没有办法可以更改颜色并使条形图不透明并且不显示该视图？

任何帮助表示赞赏。提前致谢。

我的代码

SceneDelegate（仅更改颜色部分）

UITabBar.appearance().isTranslucent = false
UITabBar.appearance().backgroundColor = UIColor(named: "backgroundColor")

标签视图

struct TabController: View {
    @State private var selection = 0

    var body: some View {
        TabView(selection: $selection) {
            HomePageView()
                .tabItem {
                    Image(systemName: "house.fill")
                        .font(.title)
                }
                .tag(0)

            Text("Second View")
                .font(.title)
                .tabItem {
                    Image(systemName: "bell.fill")
                        .font(.title)
                }
                .tag(1)
        }
            .edgesIgnoringSafeArea(.top)
    }
}

Answer 1

您可以使用此代码设置标签栏颜色。把这段代码写在SceneDelegate

UITabBar.appearance().shadowImage = UIImage()
UITabBar.appearance().backgroundImage = UIImage()
UITabBar.appearance().isTranslucent = true
UITabBar.appearance().backgroundColor = .black

在 TabBar 背景中，您可以设置任何其他颜色而不是黑色。它的工作非常好。

内容视图：

TabView(selection: $selection) {
        Text("1st View")
            .tabItem {
                Image(systemName: "house.fill")
                    .font(.title)
            }
            .tag(0)

        Text("Second View")
            .font(.title)
            .tabItem {
                Image(systemName: "bell.fill")
                    .font(.title)
            }
            .tag(1)
    }
        .edgesIgnoringSafeArea(.top)

Answer 2

这是正确的做法。

它也适用于 SwiftUI，因为 TabView 和 NavigationView 实际上是旧版 UITabBarController 和 UINavigationController 的 UIHostedController。

编辑：刚刚观看了 iOS 13 的 UI 现代化，这是这样做的方法：

let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.titleTextAttributes = [.foregroundColor: UIColor.white]
appearance.largeTitleTextAttributes = [.foregroundColor: UIColor  .white]

然后在各种类型的外观上设置外观。

navigationBar.standardAppearance = appearance
navigationBar.compactAppearance = appearance
navigationBar.scrollEdgeAppearance = appearance

参考：https : //developer.apple.com/videos/play/wwdc2019/224/

第二次编辑：需要找出一种从 SwiftUI 视图访问 UINavigationController 的干净方法。

同时，这将有助于：

extension UINavigationController {
    override open func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        let appearance = UINavigationBarAppearance()
        appearance.configureWithOpaqueBackground()
        navigationBar.standardAppearance = appearance
        navigationBar.compactAppearance = appearance
        navigationBar.scrollEdgeAppearance = appearance
    }
}

extension UITabBarController {
    override open func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        let appearance = UITabBarAppearance()
        appearance.configureWithOpaqueBackground()
        tabBar.standardAppearance = appearance
    }
}