Navigation Bar Tutorial in iOS 18 – #30DaysOfSwift

Day 2: Wandering around the multiple paths 🛣️


In the third post of the #30DaysOfSwift series, I am going to teach you how to make a sticky navigation bar.


The output would look something like this:

n

Steps:

Create a new SwiftView file called “HomeView.”

Replace the ContentView() with HomeView() in YourAppNameApp.swift (In this case, my project is called ShipiOS. Thus, file name is ShipiOSApp.swift). n

var body: some Scene {
WindowGroup {
HomeView()
}
}

Lastly, add the following code in your HomeView() file: n

Code:

struct HomeView: View {
@State private var selectedTab = 0 // Track the selected tab
let generator = UIImpactFeedbackGenerator(style: .light) // For Haptics

@EnvironmentObject var userCommonData: CommonData

var body: some View {
TabView(selection: $selectedTab) {
ContentView() // Replace with your view
.tabItem {
Label(“Home”, systemImage: “house”)
}
.tag(0)

SecondView() // Replace with your view
.tabItem {
Label(“Chats”, systemImage: “tray”)
}
.tag(1)

ThirdView() // Replace with your view
.tabItem {
Label(“Profile”, systemImage: “gearshape”)
}
.tag(2)
}
.accentColor(Color(“AppSecondaryColor”))
.onChange(of: selectedTab) {
generator.impactOccurred()
}
}

}


Does it work? Let me know 🙂


Happy coding!

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.