Custom TabBar in SwiftUI

Now, programming languages are easier to learn because there are always have innovations from the maker. SwiftUI is an innovative, exceptionally simple way to build user interface across all Apple platforms with the power of swift.

Even in iOS 13, AppDelegate is still the main point of entry for an application. AppDelegate methods are called for application level lifecycle events

- func application(_:didFinishLauchingWithOptions:) -> Bool

- func application(_:configurationForConnecting:options:) -> UISceneConfiguration

- func application(_:didDiscardSceneSessions:)

But in iOS 13 and later, SceneDelegate takes up some responsibilities from AppDelegate. In particular related to UIWindow from AppDelegate is now UIScene in SceneDelegate. An app can have more than one scene which mostly handles application interface and app content

- scene(_:willConnectTo:options:)

- sceneDidDisconnect(_:)

- sceneDidBecomeActive(_:)

- sceneWillResignActive(_:)

- sceneWillEnterForeground(_:)

- sceneDidEnterBackground(_:)

Step Custom TabBar in SwiftUI :

- create new file and choose :

- New interface when we use swiftUI View

• struct view is place you design your UI
• PreviewProvider is protocol used for generating previews that you can see on the right-hand side in Xcode 

- Now we create custom TabBar with new component in swift :

import SwiftUI

struct CustomTabs: View {

    @Binding var index : Int

    var body: some View {

        HStack {

            Button(action: {

                self.index = 0

            }) {

                Image("icon_home")

            }

            .foregroundColor(Color.black.opacity(self.index == 0 ? 1 : 0.2))

            Spacer(minLength: 0)

            Button(action: {

                self.index = 1

            }) {

                Image("icon_search")

            }

            .foregroundColor(Color.black.opacity(self.index == 1 ? 1 : 0.2))

            Spacer(minLength: 0)

            Button(action: {

                

            }) {

                Image("icon_add").renderingMode(.original)

            }

            .offset(y: -16)

            Spacer(minLength: 0)

            Button(action: {

                self.index = 2

            }) {

                Image("icon_heart")

            }

            .foregroundColor(Color.black.opacity(self.index == 2 ? 1 : 0.2))

            Spacer(minLength: 0)

            Button(action: {

                self.index = 3

            }) {

                Image("icon_person")

            }

            .foregroundColor(Color.black.opacity(self.index == 3 ? 1 : 0.2))

        }

        .padding(.horizontal, 35)

        .padding(.top, 35)

        .background(Color.white)

        .clipShape(CShape())

    }

}

// custom shape on tab item

struct CShape : Shape {

    func path(in rect: CGRect) -> Path {

        return Path { path in

            path.move(to: CGPoint(x: 0, y: 35))

            path.addLine(to: CGPoint(x: 0, y: rect.height))

            path.addLine(to: CGPoint(x: rect.width, y: rect.height))

            path.addLine(to: CGPoint(x: rect.width, y: 35))

            path.addArc(center: CGPoint(x: rect.width/2, y: 35),

                        radius: 24,

                        startAngle: .zero,

                        endAngle: .init(degrees: 180),

                        clockwise: true)

        }

    }

}

- output :

link : https://github.com/sdiik/FirstInSwiftUI 😊