首页 > 解决方案 > 带有列表的 SwiftUI 自定义导航栏

问题描述

我做了一个类似于下面看到的苹果的列表,但我真的不喜欢 UInavigation 栏的样子。理想情况下,我希望它更小或隐藏起来,这样我就可以在那里放置我自己的视图。

苹果列表视图

我试图通过使用苹果外观 api 中的以下内容来隐藏它

init() { 
    UINavigationBar.appearance().backgroundColor = .green
    UINavigationBar.appearance().isHidden = true
   }

与拥有巨大的标题相比,即使拥有这样的导航栏也会更理想

导航栏标题

但这没有影响,有没有人有任何建议或想法,我可以如何自定义它以使其更符合我的要求?

标签: uinavigationbarswiftui

解决方案


这是我使用 swiftUI 和一些 UINavigationView 实现的,我相信这些修饰符将在 beta 后实现到 swiftUI。

在此处输入图像描述

我通过调整 max 关于 UINavigationBar 外观的想法来实现这一点。如何更改导航栏中的背景或颜色?

除此之外,我只是切换到 NavigationBar 标题的视图

var body: some View {
    VStack {
        if displayImg {
            Image("dontstarve")
                .resizable()
                .aspectRatio(contentMode: .fill)
                .edgesIgnoringSafeArea(.all)
        } else {
            Image(systemName: "play")
        }
    }
        .navigationBarTitle(Text("Adjustment"), displayMode: .inline)
        .navigationBarItems(trailing:
            HStack {
                Toggle(isOn: $displayImg) {
                    Text("\(self.displayImg ? "on" : "off")")
                        .foregroundColor(Color.white)
                }
    })
}

下面是唯一不是 SwiftUI 的代码。我只是把它们都扔到 init() 中:

init() {
    UINavigationBar.appearance().tintColor = .systemGray6
    UINavigationBar.appearance().barTintColor = .systemTeal
    UINavigationBar.appearance().titleTextAttributes = [NSAttributedString.Key.foregroundColor:UIColor.white, NSAttributedString.Key.font: UIFont.boldSystemFont(ofSize: 25)]
}

是的,记得将导航栏标题模式设置为内联:

    .navigationBarTitle(Text("Home"), displayMode: .inline)

推荐阅读