I use this code the create a custom tabBar
:
class TabBarViewController: UITabBarController {
let tabBarView = UIView()
let blurView = UIVisualEffectView(effect: UIBlurEffect(style: .systemChromeMaterialLight))
override func viewDidLoad() {
super.viewDidLoad()
generateTabBar()
setupTabBarAppearance()
}
func generateTabBar() {
viewControllers = [
generateVC(controller: UINavigationController(rootViewController: TableViewController()),
title: TableViewController().title!,
image: TableViewController().image),
generateVC(controller: UINavigationController(rootViewController: FavoritesController()),
title: FavoritesController().title!,
image: FavoritesController().image),
generateVC(controller: UINavigationController(rootViewController: SearchViewController()),
title: SearchViewController().title!,
image: SearchViewController().image)]
}
func generateVC(controller: UIViewController, title: String, image: UIImage?) -> UIViewController {
controller.tabBarItem.title = title
controller.tabBarItem.image = image
return controller
}
private func setupTabBarAppearance(){
tabBar.backgroundImage = UIImage()
tabBar.backgroundColor = .clear
tabBar.shadowImage = UIImage()
tabBar.itemWidth = (tabBar.bounds.width - 10) / 5
tabBar.itemPositioning = .centered
tabBar.tintColor = .green
tabBar.unselectedItemTintColor = .red
view.addSubview(tabBarView)
tabBarView.backgroundColor = .clear
tabBarView.translatesAutoresizingMaskIntoConstraints = false
let scenes = UIApplication.shared.connectedScenes
let windowScene = scenes.first as? UIWindowScene
let window = windowScene?.windows.first
tabBarView.frame = CGRect(x: 32, y: window!.frame.size.height - tabBar.frame.size.height - SafeArea().bottom() - 5, width: tabBar.frame.size.width - 64, height: tabBar.frame.size.height + 10)
tabBarView.layer.cornerRadius = (tabBar.frame.size.height+5)/2
view.bringSubviewToFront(tabBar)
blurView.translatesAutoresizingMaskIntoConstraints = false
blurView.clipsToBounds = true
blurView.frame = CGRect(x: 0, y:0, width: tabBarView.frame.size.width, height: tabBarView.frame.size.height)
blurView.layer.cornerRadius = (tabBar.frame.size.height+5)/2
tabBarView.addSubview(blurView)
blurView.layer.cornerRadius = (tabBar.frame.size.height+5)/2.25
tabBarView.bringSubviewToFront(blurView)
}
}
And I want to hide my tabBar
when I scrolling the view. I use this code to do it:
func changeTabBar(hidden:Bool, animated: Bool){
guard let tabBar = self.tabBarController?.tabBar else { return }
let offset = (hidden ? UIScreen.main.bounds.size.height : UIScreen.main.bounds.size.height - (tabBar.frame.size.height))
if offset == tabBar.frame.origin.y {return}
let duration:TimeInterval = (animated ? 0.5 : 0.0)
UIView.animate(withDuration: duration, animations: { tabBar.frame.origin.y = offset }, completion:nil)
}
func scrollViewDidScroll(_ scrollView: UIScrollView) {
if scrollView.panGestureRecognizer.translation(in: scrollView).y < 0{
changeTabBar(hidden: true, animated: true)
} else {
changeTabBar(hidden: false, animated: true)
}
}
But in this case only the tab bar items are hidden and my tabBarView
and blurView
are not hidden.
1