PhilStar
PhilStar

Reputation: 54

How to customize navigation bar in swiftui

How to implement this navigation bar in swiftui .it is looks like default .largeTitle but have different height and right button Navigation as needed

Upvotes: 2

Views: 6350

Answers (1)

swifty
swifty

Reputation: 1141

This is the best solution I could come up with. You basically set the title generated by the navigation bar to an empty string, and construct your own title view in the leading view of the navigation bar.

import SwiftUI

struct NavigationBarView: View {
    var body: some View {
        NavigationView {
            Text("NavigationBarView")
                .navigationBarTitle("") //Set title to none so that it won't put the bottom title
                .navigationBarItems(leading:
                    //This is your made up title, put in the leading view so it is up top aligned with the plus button
                    Text("Navigation Bar").font(.largeTitle).bold()
                    //This is the plus button, on the right side, aka trailing view
                    , trailing: Button(action: {

                    }, label: {
                            Image(systemName: "plus.circle")
                    })
            )

        }
    }
}

enter image description here

Upvotes: 4

Related Questions