如何添加类似“子标题"的内容?进入 SwiftUI 中的导航栏? [英] How can I add something like a "subheader" into the navigation bar in SwiftUI?

问题描述

我的"解决方案:

感谢

我原来的问题:

我想在我的导航栏中插入这样的内容.所以如果有人能帮助我那就太好了.

我现在的代码

NavigationView {列表 {文本(你好").listStyle(GroupedListStyle()).navigationBarTitle(Text(""), displayMode: .inline).navigationBarBackButtonHidden(true).navigationBarItems(领导:按钮(取消"){self.presentationMode.wrappedValue.dismiss()},尾随:按钮(完成"){}.禁用(真))}

以及我的代码如何编译的照片

解决方案

您可以在导航视图之前添加文本.

struct ContentView: 查看 {var主体:一些视图{虚拟堆栈{文本(子标题")导航视图{列表 {文本(你好").listStyle(GroupedListStyle()).navigationBarTitle(Text("Hello There"), displayMode: .inline).navigationBarBackButtonHidden(true).navigationBarItems(领导:按钮(取消"){//self.presentationMode.wrappedValue.dismiss()},尾随:按钮(完成"){}.禁用(真))}}}}

注意:如果你去详情页，上面的子标签仍然可见.如果您不希望那样，您可以使用普通视图创建自定义标题.

"My" solution:

Thanks to the help of Midhun MP and Mojtaba Hosseini I found this solution. It works ok, but the translucent effect of the navigation bar does not work anymore. So, if anyone knows how to fix it, please let me know.

// UITableView.appearance().backgroundColor = UIColor(named: "CustomTableViewBackgroundColor") // These are all custom color sets
// UITableViewCell.appearance().backgroundColor = UIColor(named: "CustomTableViewCellBackgroundColor")

// For the navigation bar color
UINavigationBar.appearance().backgroundColor = UIColor(named: "CustomNavigationBarBackgroundColor")
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .default)

return VStack(spacing: 0) {
    // This is the "subheader"
    Text("Test")
        .padding(.top, 9.5)
        .padding(.bottom, 8)
        .frame(minWidth: 0, maxWidth: .infinity)
        .background(Color("CustomNavigationBarBackgroundColor")) // This is also a custom color set
        .font(.footnote)
    // And here is my normal NavigationView
    NavigationView {
        List {
            Text("Hello")
        } .listStyle(GroupedListStyle())

        .navigationBarTitle(Text(""), displayMode: .inline)
        .navigationBarBackButtonHidden(true)
        .navigationBarItems(
            leading:
            Button("Cancel") {
                // self.presentationMode.wrappedValue.dismiss()
            }.padding(.vertical, 5),
            trailing:
            Button("Done") {

            }.padding(.vertical, 5).disabled(true)
        )
    }
}

My original question:

I want to insert something like this in my navigation bar. So if someone can help me that would be nice.

My code now

NavigationView {
    List {
        Text("Hello")
    } .listStyle(GroupedListStyle())

    .navigationBarTitle(Text(""), displayMode: .inline)
    .navigationBarBackButtonHidden(true)
    .navigationBarItems(
        leading:
        Button("Cancel") {
            self.presentationMode.wrappedValue.dismiss()
        },
        trailing:
        Button("Done") {

        }.disabled(true)
    )
}

And a photo of how my code looks compiled

解决方案

You can just add a text just before the navigation view.

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Sub Header")
            NavigationView {
                List {
                    Text("Hello")
                } .listStyle(GroupedListStyle())

                .navigationBarTitle(Text("Hello There"), displayMode: .inline)

                .navigationBarBackButtonHidden(true)
                .navigationBarItems(
                    leading:
                    Button("Cancel") {
                        //self.presentationMode.wrappedValue.dismiss()
                    },
                    trailing:
                    Button("Done") {

                    }.disabled(true)
                )
            }
        }
    }
}

Note: If you go to detail pages, the above sub-label will be still visible. If you don't want that, You can create a custom header using normal view.

这篇关于如何添加类似“子标题"的内容?进入 SwiftUI 中的导航栏?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！