CODEWITHSUNDEEP
iosswiftstoryboardtabbar
ga-yo
ga-yo

Reputation: 133

How to make Custom TabBar?

enter image description here

I have to customize the tab bar like the picture above. However, I don't know how to customize this point because the name of the item should appear only when the tab bar is selected, and the name of the item should not appear if it is not selected. Please help me.

Upvotes: 0

Views: 1794

Answers (2)

kyeahen
kyeahen

Reputation: 201

As an example, it was written with two items.
You can branch to the tag depending on the selected item in didSelect() method.
In viewWillAppear(), I wrote the title of first item because the first item is selected when the app is first launched. (initialization)

I hope my answer is helpful to you.

TabBarController.swift

import UIKit

class TabBarController: UITabBarController, UITabBarControllerDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.delegate = self
    }
    
    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(true)
    
        //Setting the UITabBarItem
        
        let tab1 = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(identifier: "ViewController")
        let tab1BarItem = UITabBarItem(title: "home", image: UIImage(systemName: "seal"), selectedImage: UIImage(systemName: "seal.fill"))
        tab1.tabBarItem = tab1BarItem
        tab1.tabBarItem.tag = 0
        
        let tab2 = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(identifier: "SearchViewController")
        let tab2BarItem = UITabBarItem(title: "", image: UIImage(systemName: "checkmark.seal"), selectedImage: UIImage(systemName: "checkmark.seal.fill"))
        tab2.tabBarItem = tab2BarItem
        tab2.tabBarItem.tag = 1
        
        self.viewControllers = [tab1, tab2]
    }
    

    override func tabBar(_ tabBar: UITabBar, didSelect item: UITabBarItem) {
        
        if item.tag == 0 { // tab1(home)
            item.title = "home"
            tabBar.items?[1].title = ""
        }
        
        if item.tag == 1 { // tab2(search)
            item.title = "search"
            tabBar.items?[0].title = ""
        }
    }
    
}

Preview

enter image description here

Upvotes: 3

Shehata Gamal
Shehata Gamal

Reputation: 100541

You need to do 2 things

1- To make the the selected tab color green

tabController.tabBar.tintColor = UIColor.green

2- When item is selected listen for UITabBarControllerDelegate and assign items with text set to "" for every unselected item

tabController.tabBar.items = [] // set all items

Upvotes: 0

Related Questions