如何在 SwiftUI 中制作半透明导航栏? [英] How to make a semi-transparent Navigation Bar in SwiftUI?

问题描述

我看过几篇讨论如何在 SwiftUI 中制作透明导航栏的帖子，但没有关于如何制作半透明导航栏，这让我感到惊讶，因为它是 Apple 默认应用程序中非常常见的模式.例如 Notes 应用程序:

I've seen several posts discussing how to make a transparent Navbar in SwiftUI, but none on how to make a semi-transparent one, which is surprising to me as its a very common patter on Apple's default apps. For example the Notes app:

您可以通过导航栏查看绘图.任何人都知道如何做到这一点，最好是在明/暗模式下工作?

You can see the drawing through the NavBar. Anyone know how to do this, ideally in a way which works in light/dark mode?

推荐答案

也许你只需要在 SwiftUI 视图中添加半透明设置

Maybe you just need to add translucency settings in your SwiftUI view

init() {
  UINavigationBar.appearance().isTranslucent = true
}

替代方法是完全重置外观，例如

alternate is to reset appearance completely, like

init() {
    let appearance = UINavigationBarAppearance()
    appearance.configureWithTransparentBackground()
    appearance.backgroundColor = UIColor.systemBackground.withAlphaComponent(0.5)
    UINavigationBar.appearance().standardAppearance = appearance
}

使用 Xcode 12/iOS 14 准备和测试的演示

Demo prepared and tested with Xcode 12 / iOS 14

这篇关于如何在 SwiftUI 中制作半透明导航栏?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！