How to add these capsule shape behind the selected tab bar item image

64 views Asked by At

I want to make a tab bar with the following features:

I am creating the tab bar programmatically. Can you help me with the code?

Screenshots of the what i achieved so far : link to screenshots

Here is the code so far

class TabBarViewController: UITabBarController {

override func viewDidLoad() {
    super.viewDidLoad()

    //MARK: Initializing tab-bar viewControllers
    let prayerVC = initiateViewController.initiatePrayerVC()
    let alarmVC = initiateViewController.initiateAlarmVC()
    let settingsVC = initiateViewController.initiateSettingsVC()
    
    //MARK: tab bar item text attributes
    let attributes: [NSAttributedString.Key: Any] = [
        .font: UIFont(name: "Roboto-Medium", size: UIFont.systemFont(ofSize: 12).pointSize) as Any
]

    //MARK: edit tab bar appearance & attributes
    UITabBarItem.appearance().setTitleTextAttributes(attributes, for: .normal)
    
    //MARK: adding Title and image for each Tab bar item (viewcontroller)
    prayerVC.tabBarItem.title = text_international.prayer_times
    alarmVC.tabBarItem.title = text_international.alarm
    settingsVC.tabBarItem.title = text_international.settings

    prayerVC.tabBarItem.image = UIImage(named: "IconPrayer")
    alarmVC.tabBarItem.image = UIImage(named: "IconAlarm")
    settingsVC.tabBarItem.image = UIImage(named: "IconSettings")
    
    
    //MARK: adding View Controllers to the tab bar
    self.setViewControllers([prayerVC,alarmVC,settingsVC], animated: false)
    
    
}
0

There are 0 answers