IOS) Custom TabBar 만들기 in Code

안녕하세요 후르륵짭짭 입니다.

이번에는 Custom TabBar를 꾸며 보도록 하겠습니다.

그리고 기타적인 내용도 담아 보도록 하겠습니다.

 

** CustomTabBoar **

TabBar를 지금 까지 StoryBoard로 꾸몄는데, 이제 Code로 꾸며 보도록 하겠습니다.

간단하게 꾸밀 수 있습니다.

일단 아래 처럼 CustomTabBar 클래스를 하나 생성 해주시기 바랍니다.

( 코드에 대한 자세한 설명은 나중에 하겠습니다. )

class CustomTabBarController: UITabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.tabBar.tintColor = .red
        self.tabBar.unselectedItemTintColor = .blue
        
        let firstVC = UINavigationController(rootViewController: MainViewController())
        firstVC.tabBarItem.selectedImage = UIImage(systemName: "message")
        firstVC.tabBarItem.title = "Recent"
        firstVC.tabBarItem.image = UIImage(systemName: "message.fill")
        
        let dummyView = UIViewController()
        dummyView.view.backgroundColor = .yellow
        dummyView.tabBarItem.title = "Yellow Dummy"
        dummyView.tabBarItem.image = UIImage(systemName: "trash.fill")
        
        viewControllers = [firstVC, dummyView]
        
    }


}

그리고 IOS13 버전 이상일 경우에는 View를 담당하는 SceneDelegate에 rootView를 CustomTabBarController를 호출해줍니다.

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {

        if let windowScene = scene as? UIWindowScene {
            let window = UIWindow(windowScene: windowScene)

            window.rootViewController = CustomTabBarController()

            self.window = window
            window.makeKeyAndVisible()
        }
    }

이렇게 하면 처음 시작하는 View를 CustomTabBar로 지정할 수 있습니다.

 

** 코드에 대한 설명 **

// 기본적인 tabBar의 글자색을 지정해준다.
self.tabBar.tintColor = .red

//tabBar가 선택되지 않았을때의 색을 지정해준다.
self.tabBar.unselectedItemTintColor = .blue

//ViewController를 생성
let firstVC = UINavigationController(rootViewController: MainViewController())
//first View의 TabBar가 선택 되어 졌을 때 이미지
firstVC.tabBarItem.selectedImage = UIImage(systemName: "message")
//first View의 TabBar의 제목 이름
firstVC.tabBarItem.title = "Recent"
//first View의 TabBar의 선택되지 않았을 때의 이미지
firstVC.tabBarItem.image = UIImage(systemName: "message.fill")

이렇게 기본적으로 필요한 TabBar를 설정할 수 있습니다.

  let dummyView = UIViewController()
  dummyView.view.backgroundColor = .yellow
  dummyView.tabBarItem.title = "Yellow Dummy"
  dummyView.tabBarItem.image = UIImage(systemName: "trash.fill")

그리고 위에 처럼 기본적인 View를 하나 만들어주고 난 후

  viewControllers = [firstVC, dummyView]

위에 코드 처럼 viewControllers에 위에서 생성한 ViewController들을 넣어주시기 바랍니다.

( 그런데 이때, viewController.append는 초기 설정화면에 작동 되지 않는 것 같으니 이렇게 배열을 초기화 해주셔야 합니다. )

 

참고 사이트 : 

stackoverflow.com/a/42031165/13065642

Change tab bar item selected color in a storyboard