How to create tabbar with custom UI in swift 3.0

Question

i want to create one tab bar from storyboard and i create it but when click on tab bar at that time image is not showing and some images i want tab bar like

and i got this

When i click on any tab bar item its display like

Here is my code that i use in profile view controller

class ProfileViewController: UIViewController {
 override func viewDidLoad() {
        super.viewDidLoad()
        UIApplication.shared.statusBarStyle = .default

        self.tabBarController?.tabBar.isHidden = false
        UITabBar.appearance().tintColor = UIColor.init(patternImage: UIImage.init(named: "ic_home_tab_profile_sel.png")!)
        // Do any additional setup after loading the view.
    }
}

Any help can be appreciate . Thank You in advance.

Answer 1

I suggest to use ESTabBarControllerExample https://github.com/eggswift/ESTabBarController to making that kind of custom TabbarController.First Download the ESTabbarControllerExample from github. We need to use some class letter on. Let me explain how to use step by step:

• First Install CocoaPods

  1 Open terminal and cd ~ to your project directory

  2 Run the command - pod init

  3 Your podfile should be use with - pod "ESTabBarController-swift" and save it

  4 And install it with command pod install

• Open project file of .xcworkspace extension

  1 In project we need to add Content all swift class and pop.framework

  2 Don't add pop.framework using add File to. you must be add from Framework and add Others.

  3 In Content folder's all file import ESTabBarController_swift

• StoryBord Stuff

  1 Add navigation Controller ane also add ExampleNavigationController from the example code of EST demo. (You can add your own too) but make sure you set its Class of navigation custom swift class.

• Code Stuff at AppDelegate.swift

You need to do following code in side didFinishLaunchingWithOptions

            let tabBarController = ESTabBarController()
            tabBarController.delegate = self
            tabBarController.title = "Irregularity"
            tabBarController.tabBar.shadowImage = UIImage(named: "transparent")
            tabBarController.tabBar.backgroundImage = UIImage(named: "background_dark")
            tabBarController.shouldHijackHandler = {
                tabbarController, viewController, index in
                if index == 2 {
                    return true
                }
                return false
            }
            tabBarController.didHijackHandler = {
                [weak tabBarController] tabbarController, viewController, index in

                DispatchQueue.main.asyncAfter(deadline: .now() + 0.2) {
                    let alertController = UIAlertController.init(title: nil, message: nil, preferredStyle: .actionSheet)
                    let takePhotoAction = UIAlertAction(title: "Take a photo", style: .default, handler: nil)
                    alertController.addAction(takePhotoAction)
                    let selectFromAlbumAction = UIAlertAction(title: "Select from album", style: .default, handler: nil)
                    alertController.addAction(selectFromAlbumAction)
                    let cancelAction = UIAlertAction(title: "Cancel", style: .cancel, handler: nil)
                    alertController.addAction(cancelAction)
                    tabBarController?.present(alertController, animated: true, completion: nil)
                }
            }

            let v1 = ExampleViewController()
            let v2 = ExampleViewController()
            let v3 = ExampleViewController()
            let v4 = ExampleViewController()
            let v5 = ExampleViewController()

            v1.tabBarItem = ESTabBarItem.init(ExampleIrregularityBasicContentView(), title: "Home", image: UIImage(named: "home"), selectedImage: UIImage(named: "home_1"))
            v2.tabBarItem = ESTabBarItem.init(ExampleIrregularityBasicContentView(), title: "Find", image: UIImage(named: "find"), selectedImage: UIImage(named: "find_1"))
            v3.tabBarItem = ESTabBarItem.init(ExampleIrregularityContentView(), title: nil, image: UIImage(named: "photo_verybig"), selectedImage: UIImage(named: "photo_verybig"))
            v4.tabBarItem = ESTabBarItem.init(ExampleIrregularityBasicContentView(), title: "Favor", image: UIImage(named: "favor"), selectedImage: UIImage(named: "favor_1"))
            v5.tabBarItem = ESTabBarItem.init(ExampleIrregularityBasicContentView(), title: "Me", image: UIImage(named: "me"), selectedImage: UIImage(named: "me_1"))

            tabBarController.viewControllers = [v1, v2, v3, v4, v5]

            let navigationController = ExampleNavigationController.init(rootViewController: tabBarController)
            tabBarController.title = "Example"


        self.window?.rootViewController = navigationController

        return true

Add Images for Tabbar items and other that you want to use for in Assets. Hope that helps for you.

Sample Project: https://github.com/nitingohel/CustomTabCenterBig