How to make custom navigation bar for the app in SwiftUI?

user_14241023 0
Viewed 3285

I am developing app in swiftUI in which every screen has same custom navigation bar with diff titles.

Instead of creating custom navigation view in every screen I want to reuse it.

What will be the best approach to do that?

for now i have done as follow but this works only for single screen

var body: some View {
      ZStack {
            VStack {
                Image("Custom_Navigation_Image")
                    .resizable()
                    .frame(height: 135)
                    .edgesIgnoringSafeArea(.all)
                Spacer()
            }
       }

I want to create custom navigation as below enter image description here

Thank You for help

swiftui swift ios
1 Answers

Create a custom view wherein Navigation View embeds the current view:

struct CustomNavBar<Content>: View where Content: View {
    
    let title: String
    let content: Content
    
    var body: some View {
        NavigationView {
            ZStack {
                VStack {
                    Image("12345")
                        .resizable()
                        .frame(height: 135)
                        .edgesIgnoringSafeArea(.all)
                    Spacer()
                }
                content
            }
            .navigationBarTitle(title, displayMode: .inline)
        }
    }
}

Usage:

var body: some View {

    CustomNavBar(title: "Custom Nav", content:
               Text("Testing")
    )
user_65763150
Related