how to set image in a tab bar item in swift?

Question

I have taken a view controller & embedded it in a navigation Controller and again this has been embedded in a tab bar controller. when i am trying to set a image via sto

Answer 1

add AppDelegate class :

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool
{
    window=UIWindow(frame: UIScreen.main.bounds)
    self.window?.rootViewController = setTabbar()
    self.window?.makeKeyAndVisible()
    window?.backgroundColor=UIColor.white
    return true
}

func setTabbar() -> UITabBarController
{
    let storyboard = UIStoryboard(name: "Main", bundle: nil)
    let tabbarcntrl = UITabBarController()

    let Home = storyboard.instantiateViewController(withIdentifier: "HomeView") // 1st tab bar viewcontroller
    let Followed = storyboard.instantiateViewController(withIdentifier: "FollowedView") // 2nd tab bar viewcontroller
    let Message = storyboard.instantiateViewController(withIdentifier: "MessageView") // 3rd tab bar viewcontroller

    // all viewcontroller embedded navigationbar
    let nvHome = UINavigationController(rootViewController: Home)
    let nvFollowed = UINavigationController(rootViewController: Followed)
    let nvMessage = UINavigationController(rootViewController: Message)

    // all viewcontroller navigationbar hidden
    nvHome.setNavigationBarHidden(true, animated: false)
    nvFollowed.setNavigationBarHidden(true, animated: false)
    nvMessage.setNavigationBarHidden(true, animated: false)

    tabbarcntrl.viewControllers = [nvHome,nvFollowed,nvMessage]

    let tabbar = tabbarcntrl.tabBar
    tabbar.barTintColor = UIColor.black
    tabbar.backgroundColor = UIColor.black
    tabbar.tintColor = UIColor(red: 43/255, green: 180/255, blue: 0/255, alpha: 1)

    //UITabBar.appearance().tintColor = UIColor.white
    let attributes = [NSFontAttributeName:UIFont(name: "Montserrat-Light", size: 10)!,NSForegroundColorAttributeName:UIColor.white]
    let attributes1 = [NSFontAttributeName:UIFont(name: "Montserrat-Light", size: 10)!,NSForegroundColorAttributeName:UIColor(red: 43/255, green: 180/255, blue: 0/255, alpha: 1)]

    UITabBarItem.appearance().setTitleTextAttributes(attributes, for: .normal)
    UITabBarItem.appearance().setTitleTextAttributes(attributes1, for: .selected)


    let tabHome = tabbar.items![0]
    tabHome.title = "Home" // tabbar titlee
    tabHome.image=UIImage(named: "icon_home.png")?.withRenderingMode(.alwaysOriginal) // deselect image
    tabHome.selectedImage = UIImage(named: "icon_home.png")?.withRenderingMode(.alwaysOriginal) // select image
    tabHome.titlePositionAdjustment.vertical = tabHome.titlePositionAdjustment.vertical-4 // title position change

    let tabFoll = tabbar.items![1]
    tabFoll.title = "Followed"
    tabFoll.image=UIImage(named: "icon_fold.png")?.withRenderingMode(.alwaysOriginal)
    tabFoll.selectedImage=UIImage(named: "icon_fold.png")?.withRenderingMode(.alwaysOriginal)
    tabFoll.titlePositionAdjustment.vertical = tabFoll.titlePositionAdjustment.vertical-4

    let tabMsg = tabbar.items![3]
    tabMsg.title = "Message"
    tabMsg.image=UIImage(named: "icon_mail.png")?.withRenderingMode(.alwaysOriginal)
    tabMsg.selectedImage=UIImage(named: "icon_mail.png")?.withRenderingMode(.alwaysOriginal)
    tabMsg.titlePositionAdjustment.vertical = tabMsg.titlePositionAdjustment.vertical-4

    return tabbarcntrl
}

Answer 2

You are doing all the things in right way But the only problem is your tabbaritem image is not in correct size .Just look this table for actual size of tabbaritem images.

Answer 3

Set both images- for select/selected state

Answer 4

In your MainTabbarViewController

Bind the outlet of your tabbar:

@IBOutlet weak var myTabBar: UITabBar?

 override func viewDidLoad() {
      super.viewDidLoad()

      myTabBar?.tintColor = UIColor.white
      tabBarItem.title = ""

      setTabBarItems()

 }

set the tabbar items here defined method below:

func setTabBarItems(){

      let myTabBarItem1 = (self.tabBar.items?[0])! as UITabBarItem
      myTabBarItem1.image = UIImage(named: "Unselected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem1.selectedImage = UIImage(named: "Selected ")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem1.title = ""
      myTabBarItem1.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)

      let myTabBarItem2 = (self.tabBar.items?[1])! as UITabBarItem
      myTabBarItem2.image = UIImage(named: "Unselected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem2.selectedImage = UIImage(named: "Selected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem2.title = ""
      myTabBarItem2.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)


      let myTabBarItem3 = (self.tabBar.items?[2])! as UITabBarItem
      myTabBarItem3.image = UIImage(named: "Unselected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem3.selectedImage = UIImage(named: "Selected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem3.title = ""
      myTabBarItem3.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)

      let myTabBarItem4 = (self.tabBar.items?[3])! as UITabBarItem
      myTabBarItem4.image = UIImage(named: "Unselected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem4.selectedImage = UIImage(named: "Selected")?.withRenderingMode(UIImageRenderingMode.alwaysOriginal)
      myTabBarItem4.title = ""
      myTabBarItem4.imageInsets = UIEdgeInsets(top: 6, left: 0, bottom: -6, right: 0)

 }

CHEERS!

Answer 5

In swift 4 and 5 you can use the below extension. Remember one thing always pass the same number of images , selected images and title but if you do not want to set title then pass nil in title.

extension UITabBarController{

    func setUpImagaOntabbar(_ selectedImage : [UIImage], _ image : [UIImage], _ title : [String]?){

        for (index,vals) in image.enumerated(){

            if let tab = self.tabBar.items?[index]{

                tab.image = image[index]
                tab.image = selectedImage[index]
                if let tile = title[index]{
                   tab.title = title[index]
                  }

            }
        }
    }
}