A custom tab bar controller for iOS written in Swift 4.2

Overview

AZTabBarController

A custom tab bar controller for iOS written in Swift 4.0

Screenshots

Installation

Cocoa Pods:

pod 'AZTabBar'

Swift Package Manager:

You can use The Swift Package Manager to install AZTabBarController by adding the proper description to your Package.swift file:

// swift-tools-version:4.0
import PackageDescription
let package = Package(
    name: "YOUR_PROJECT_NAME",
    dependencies: [
        .package(url: "https://github.com/Minitour/AZTabBarController.git", from: "1.4.2"),
    ]
)

Then run swift build whenever you're ready.

Manual:

Simply drag and drop the Sources folder to your project.

Usage:

Create an array of String/UIImage:

//The icons that will be displayed on the tabs that are not currently selected
var icons = [String]()
icons.append("ic_star_outline")
icons.append("ic_history_outline")
icons.append("ic_phone_outline")
icons.append("ic_chat_outline")
icons.append("ic_settings_outline")

//The icons that will be displayed for each tab once they are selected.
var selectedIcons = [String]()
selectedIcons.append("ic_star_filled")
selectedIcons.append("ic_history_filled")
selectedIcons.append("ic_phone_filled")
selectedIcons.append("ic_chat_filled")
selectedIcons.append("ic_settings_filled")

Now initialize the controller object through the following method:

tabController = .insert(into: self, withTabIconNames: icons, andSelectedIconNames: selectedIcons)

Add controllers:

//if you are using storyboard:
let myChildViewController = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "ChildViewController")!

//if you are loading programmatically:
let myChildViewController = ChildViewController()

tabController.setViewController(myChildViewController, atIndex: 0)

Add actions:

tabController.setAction(atIndex: 3) { 
    //Your statments
    print("Hello World")
}

Note that you can add both actions and view controllers at a certain index.

Customizations:

//default color of the icons on the buttons
tabController.defaultColor = .white 

//the color of the icon when a menu is selected
tabController.selectedColor = .orange 

//The color of the icon of a highlighted tab
tabController.highlightColor = .white

//The background color of the button of the highlighted tabs.
tabController.highlightedBackgroundColor = .green

//The background color of the tab bar
tabController.buttonsBackgroundColor = .black 

//The color of the selection indicator.
tabController.selectionIndicatorColor = .green

// default is 3.0
tabController.selectionIndicatorHeight = 0 

// change the seperator line color
tabController.separatorLineColor = .black 

//hide or show the seperator line
tabController.separatorLineVisible = false 

//Enable tab change animation that looks like facebook
tabController.animateTabChange = true

Extras:

Make tab look highlighted:

tabController.highlightButton(atIndex: 2) 

Hide/Show the tab bar:

tabController.setBar(hidden: true, animated: true)

Add badge to menu (use nil value to remove existing badges):

tabController.setBadgeText("5", atIndex: 3)

Switch programmatically to a certain tab:

tabController.setIndex(2) //animated = true by default
//or
tabController.setIndex(2, animated: false)

Grant access to change the status bar style per tab:

override var childViewControllerForStatusBarStyle: UIViewController?{
    return tabController
}
//Then implement the delegate method:
func tabBar(_ tabBar: AZTabBarController, statusBarStyleForIndex index: Int) -> UIStatusBarStyle {
    return (index % 2) == 0 ? .default : .lightContent
}

Manage Titles

Adding Titles:

tabController.setTitle("Home", atIndex: 0)
tabController.setTitle("Search", atIndex: 1)
tabController.setTitle("Camera", atIndex: 2)
tabController.setTitle("Feed", atIndex: 3)
tabController.setTitle("Profile", atIndex: 4)

Show Title Only For Selected Index:

tabController.onlyShowTextForSelectedButtons = true

Access AZTabBarController from child view controllers:

I created an extension for UIViewController which adds a var called currentTabBar:

public var currentTabBar: AZTabBarController? { get }

You can call it like this:

currentTabBar?.setBadgeText("New Badge Value",atIndex: 2)

Delegate Methods:

These are the functions of the AZTabBarDelegate:

/// This function is called after `didMoveToTabAtIndex` is called. In order for this function to work you must override the var `childViewControllerForStatusBarStyle` in the root controller to return this instance of AZTabBarController.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the child view controller which you wish to set a status bar style for.
/// - Returns: The status bar style.
func tabBar(_ tabBar: AZTabBarController, statusBarStyleForIndex index: Int)-> UIStatusBarStyle
/// This function is called whenever user clicks the menu a long click. If returned false, the action will be ignored.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the child view controller which you wish to disable the long menu click for.
/// - Returns: true if you wish to allow long-click interaction for a specific tab, false otherwise.
func tabBar(_ tabBar: AZTabBarController, shouldLongClickForIndex index: Int)-> Bool
/// This function is used to enable/disable animation for a certian tab.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the tab.
/// - Returns: true if you wish to enable the animation, false otherwise.
func tabBar(_ tabBar: AZTabBarController, shouldAnimateButtonInteractionAtIndex index:Int)->Bool
/// This function is called whenever user taps one of the menu buttons.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the menu the user tapped.
func tabBar(_ tabBar: AZTabBarController, didSelectTabAtIndex index: Int)
/// This function is called whenever user taps and hold one of the menu buttons. Note that this function will not be called for a certain index if `shouldLongClickForIndex` is implemented and returns false for that very same index.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the menu the user long clicked.
func tabBar(_ tabBar: AZTabBarController, didLongClickTabAtIndex index:Int)
/// This function is called before the child view controllers are switched.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the controller which the tab bar will be switching to.
func tabBar(_ tabBar: AZTabBarController, willMoveToTabAtIndex index:Int)
/// This function is called after the child view controllers are switched.
///
/// - Parameters:
///   - tabBar: The current instance of AZTabBarController.
///   - index: The index of the controller which the tab bar had switched to.
func tabBar(_ tabBar: AZTabBarController, didMoveToTabAtIndex index: Int)

Credits

AZTabBarController was originally inspired by ESTabBarController that is written in Objective-C by ezescaruli.

Thanks to Tobaloidee for creating the logo.

Comments
  • AZTabBar with shadow from top

    AZTabBar with shadow from top

    Hello - the tabBar is working well. Just curious if there was a way to add a black shadow extending from the top border into the view. This code has no effect...

    tabController.view.layer.shadowColor = UIColor.black.cgColor tabController.view.layer.masksToBounds = false tabController.view.layer.shadowOffset = CGSize.zero tabController.view.layer.shadowRadius = 50 tabController.view.layer.shadowOpacity = 1.0

    Thanks!

    opened by escully27 15
  • ViewController not loading

    ViewController not loading

    hi i am using AZTabBarController as a pod in my project, in myviewDidLoad of Main VC i have : tabController.set(viewController: instanceControllerAccount, atIndex: 1)

    but it show nothing except the selector indicator shifting to that tab

    opened by chitvan832 10
  • how to push a new view controller after change selectedIndex

    how to push a new view controller after change selectedIndex

    I have six tabItem view controller, each child view controller has own a navigation controller itself. I have a problem to push a new view controller after change the selectedIndex.

    //the viewcontroller I want to push let vc = self.storyboard?.instantiateViewController(withIdentifier: "CreateArticleViewController") as! CreateArticleViewController self.currentTabBar?.setIndex(3, animated: true) // Below code doesn't work self.navigationController?.pushViewController(vc, animated: true) self.currentnavigationController?.pushViewController(vc, animated: true)

    tabcontroller -> Navigation 1 -> A1 -> A2
    -> Navigation 2 -> B1 -> B2 -> B3 -> B4 -> Navigation 3 -> C1 -> C2 -> C3 -> C4 -> Navigation 4 -> D1 -> D2 -> D3 -> D4 -> Navigation 5 -> E1 -> E2 -> E3 -> Navigation 6 -> F1 -> F2 -> F3

    For example, when I in A1, how do I change the index and push the view controller to D3? I also want my tabbar be more transparent. I can change background color perfectly but alpha doesn't work. How to set the AZTabBarController alpha?

    opened by frank61003 9
  • Logo design proposal

    Logo design proposal

    Good day Sir @Minitour I am a graphics designer and i want to contribute to your project by designing a logo for it as i have noticed it doesn't have one yet. I will be gladly doing it as a gift for free if you will permit me. Thanks and best regards! - Tobaloidee

    opened by Tobaloidee 9
  • Implementation Problem

    Implementation Problem

    Hello, I love your library but i couldn't implement it on my project. Can you create a better version of USAGE part ? :) I'm new at iOS and i cannot find how to create AZTabBarController. I really want to use your library.

    Thank you :)

    opened by WrathChaos 9
  • Failed to create navigation barButtonItem

    Failed to create navigation barButtonItem

    I tried to create a UIBarButtonItem by using

    controller.navigationItem.rightBarButtonItem = UIBarButtonItem(title: "xxx", style: .plain, target: self, action:xxx)
    

    But the item failed to be created, and I tried with both the AZTabBarController and one of the tab controllers.

    A little help would be much appreciated~

    opened by Sophie1214 8
  • Setting

    Setting "badgeText" from other view controllers

    Hi, awesome library - love it!! I'm a bit new to Swift and I need a bit of help. I need to be able to set the badge text from the other view controllers. Each view controller is responsible for updating separate pieces of info from the server, so they need to be able to set their badges. I tried making the tabController public, then saying self.parent.tabController from the child view controller - which WOULD work, except that I have no idea how to declare the tabController correctly as a public. It seems to require icons, etc, which I can't give outside viewDidLoad. Can you offer any guidance on this?

    Thanks!

    opened by daerimin 7
  • Tab icon images

    Tab icon images

    How can I set tab bar icon images without any default or selected color? I just want their images to be displayed for both default and selected status.

    opened by stelarelas 6
  • Weird Issue: Just one image does not set

    Weird Issue: Just one image does not set

    I am trying to set different images in TabBar but just one image from them doesn't work.

        var icons = [UIImage]()
        icons.append(UIImage(named: "ic_tab_wallpaper")!)
        icons.append(UIImage(named: "ic_tab_maps")!)
        icons.append(UIImage(named: "ic_tab_wallpaper")!)
        icons.append(UIImage(named: "ic_tab_shop")!)
        icons.append(UIImage(named: "ic_tab_profile")!)
        
        var sIcons = [UIImage]()
        sIcons.append(UIImage(named: "ic_tab_wallpaper_selected")!)
        sIcons.append(UIImage(named: "ic_tab_maps")!)
        sIcons.append(UIImage(named: "ic_tab_wallpaper_selected")!)
        sIcons.append(UIImage(named: "ic_tab_shop_selected")!)
        sIcons.append(UIImage(named: "ic_tab_profile_selected")!)
    

    Every other image except ic_tab_maps works and shows in TabBar. I have tried to check in your example as well but it doesn't work.

    Screenshot 2020-04-30 at 1 40 59 PM

    opened by StackHelp 5
  • Multiple issues

    Multiple issues

    Initially, I thought the problem is within my app, but then I tried the example, which has the same issue. Basically, when a user clicks multiple times on the buttons it seems that sometimes the toggle fails. Sometimes the app switches to a completely different view (usually the home).

    A way to replicate the behavior would be to click on the "feed" tab, from the example project, in multiple succession (almost like rage clicking it).

    I assume this is due to the views being stacked on top of each other. I don't really know what's going on.

    Another issue that I'm facing is that the AZTabController seems to be on top of everything in my view and screws up element interaction. There is another issue related to this bug but the suggestion didn't solve my problem. Seems like the TabController is messing up the NavigationController.

    Better documentation will be really helpful...

    opened by and0m 4
  • Crash with normal use

    Crash with normal use

    Hi there,

    I followed the usage tutorial on the ReadMe exactly and my app seems to crash, here is the exception: screenshot 2018-12-10 at 15 50 11

    And here is how I use the AZTbarBar:

        var icons = [String]()
        icons.append("document")
        icons.append("group")
        icons.append("compass")
        icons.append("cogwheel")
    
        var selectedIcons = [String]()
        selectedIcons.append("document_selected")
        selectedIcons.append("group_selected")
        selectedIcons.append("compass_selected")
        selectedIcons.append("cogwheel_selected")
        
        tabController = AZTabBarController.insert(into: self, withTabIconNames: icons, andSelectedIconNames: selectedIcons)
        
        let documentsPage = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "documentsViewController")
        let groupPage = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "groupViewController")
        let findPage = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "findViewController")
        let settingsPage = UIStoryboard(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "settingsViewController")
        
        tabController.setViewController(documentsPage, atIndex: 0)
        tabController.setViewController(groupPage, atIndex: 1)
        tabController.setViewController(findPage, atIndex: 2)
        tabController.setViewController(settingsPage, atIndex: 3)
    

    It seems crash when the AZTabBarController.insert() line is hit

    bug 
    opened by SteynMarnus 4
  • Notification Tap Navigation

    Notification Tap Navigation

    How can I move to specific tab controllers detail page on click of notification. Like If I had Chat thread on first index tap and I need to navigate in chat screen on notification click.

    opened by pramod7 0
  • how to reset navigation controller to first page after tapping another tab bar item

    how to reset navigation controller to first page after tapping another tab bar item

    I have 5 tab bar item, each tab bar button have navigation controller. If I tap in second tab item and push maybe three or four view controller, then I tap another tab item and return two second tab item. Can I reset this navigation controller( second tab item ) to first view controller, or I need to pop view controller manually? Thank you.

    opened by frank61003 0
  • tabBar reset my segment buttonbar when hide

    tabBar reset my segment buttonbar when hide

    Hi, I use the tab bar and hide it in my main view(first tab), and use self.currentTabBar?.setBar(hidden: false, animated: false) in main view's viewDidDissapear(). I also set some segment with button bar in other tab view. The issue is that my button bar reset to the first segment position. My button bar works fine when I change tab with tapping tab bar. I try many times and found that issue supposedly happen when tabBar hidden is changing. Is some way to correct this issue? Demo video: https://youtu.be/V6lD-40gNpw

    extension UISegmentedControl {
        func setButtonBar(buttonBar: UIView){
            buttonBar.translatesAutoresizingMaskIntoConstraints = false
            buttonBar.backgroundColor = UIColor.orange
            self.superview!.addSubview(buttonBar)
            buttonBar.topAnchor.constraint(equalTo: self.bottomAnchor).isActive = true
            buttonBar.heightAnchor.constraint(equalToConstant: 1).isActive = true
            buttonBar.leftAnchor.constraint(equalTo: self.leftAnchor, constant: (self.frame.width /         CGFloat(self.numberOfSegments)) * CGFloat(self.selectedSegmentIndex)).isActive = true
            buttonBar.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 1 / CGFloat(self.numberOfSegments)).isActive = true
        }
    
    
        func moveButtonBar(buttonBar: UIView){
            print("movebuttonBar")
            UIView.animate(withDuration: 0.4) {
                buttonBar.frame.origin.x = (self.frame.width / CGFloat(self.numberOfSegments)) * CGFloat(self.selectedSegmentIndex) + self.frame.origin.x
            }
        }
    }
    
     class ProductViewController: UIViewController {
     let buttonBar = UIView()
    @IBOutlet weak var productSegment: UISegmentedControl!
    @IBOutlet weak var productCollectionView: UICollectionView!
    @IBOutlet weak var searchProductView: UIView!
    @IBOutlet weak var caculateProductView: UIView!
    @IBOutlet weak var companyListView: UIView!
    
    @IBAction func changeContainerView(_ sender: UISegmentedControl) {
        self.view.endEditing(true)
        sender.moveButtonBar(buttonBar: buttonBar)
        switch sender.selectedSegmentIndex{
            case 0:
                searchProductView.isHidden = false
                caculateProductView.isHidden = true
                companyListView.isHidden = true
                break
            case 1:
                searchProductView.isHidden = true
                caculateProductView.isHidden = false
                companyListView.isHidden = true
                break
            case 2:
                searchProductView.isHidden = true
                caculateProductView.isHidden = true
                companyListView.isHidden = false
                break
            default:
                return
        }
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.backgroundView.setBackgroundCornerRadius()
        self.productSegment.setStyle()
        self.productSegment.setButtonBar(buttonBar: buttonBar)        
    }
    
    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        setBackgroundImage()
        productSegment.moveButtonBar(buttonBar: buttonBar)
    }
    }
    

    `

    opened by frank61003 2
  • Tab bar width

    Tab bar width

    I would like a tab bar that is less than the width of the screen. How can I adjust the width? Interesting for example to imitate the Apple Music application on iPad ... Thanks.

    opened by iDevelopper 2
  • Issue regarding corner radius tabbar

    Issue regarding corner radius tabbar

    Hi. I have successfully make a corner radius to containerView of aTabbar. But the issue is when we set up the controller for tab, due to navigation controller it just didn't work when we don't have any table view there.

    With TableView, you can check radius at top left and top right

    Screenshot 2020-05-01 at 11 26 58 AM

    With ImageView, Screenshot 2020-05-01 at 11 27 06 AM

    opened by StackHelp 0
Releases(1.4.4)
Owner
Antonio Zaitoun
24, Mobile Dev & System architect. Software Engineer at GE Healthcare. Information Systems B.Sc. Graduate and M.Sc. student at University of Haifa.
Antonio Zaitoun
A custom tab bar controller for iOS.

ESTabBarController ESTabBarController is a custom tab bar controller for iOS. It has a tab indicator that moves animated along the bar when switching

null 122 Oct 6, 2022
A fun, easy-to-use tab bar navigation controller for iOS.

CircleBar Don’t you, sometimes, miss fun user interfaces? Truth is, we do. Sure, you can't use them in enterprise apps for obvious reasons, but if you

softhaus 786 Dec 25, 2022
Different Styles of Custom Tab Bar

LightCardTabBar An expiremental project exploring different types of custom-tabbar styles, screenshots as below. Screenshots Implementation The implem

Hussein Ryalat 31 Dec 23, 2022
A prototype of custom tab bar using SwiftUI with techniques of mask + matchedGeometryEffect

SliderTabBar A prototype of custom tab bar using SwiftUI with techniques of mask

Ka Kui 1 Dec 24, 2021
Paging view controller and scroll tab view

TabPageViewController Description TabPageViewController is paging view controller and scroll tab view. Screenshot Infinity Mode Limited Mode Customiza

M 1.3k Jan 7, 2023
Another UITabBar & UITabBarController (iOS Tab Bar) replacement, but uses Auto Layout for arranging it's views hierarchy.

GGTabBar GGTabBar is a simple UITabBar & UITabBarController replacement that uses Auto Layout for constructing the GUI. I created it for curiosity, bu

Nicolas Goles 157 Sep 26, 2022
Aesthetic floating tab bar ––– SwiftUI & Combine ⛓️ Importable via Swift Package Manager 📦

FloatingTabBar An aesthetic floating tab bar made with SwiftUI & Combine importabable via Swift Package Manager ?? Based off BottomBar-SwiftUI Preview

10011.co 135 Jan 8, 2023
Aesthetic floating tab bar ––– SwiftUI & Combine ⛓️ Importable via Swift Package Manager 📦

FloatingTabBar An aesthetic floating tab bar made with SwiftUI & Combine importabable via Swift Package Manager ?? Based off BottomBar-SwiftUI Preview

10011.co 134 Jan 5, 2023
Simplistic & unfinished recreation of MobileSafari's tab bar

SafariTabBar This is a simplistic recreation of the MobileSafari tab bar on iPad (prior to iPadOS 15). It is also very unfinished, and not intended in

Steven Troughton-Smith 51 Oct 26, 2022
📱 TabBar – highly customizable tab bar for your SwiftUI application.

TabBar SwiftUI standard TabView component is not so flexible and to customize it you have to modify appearance proxy of UITabBar or implement your own

Tamerlan Satualdypov 162 Jan 5, 2023
Emoji Tab Bar button badges ✨

SuperBadges Add emojis and colored dots as badges for your Tab Bar buttons ✨ Usage Add an emoji badge: YourTabBarController.addDotAtTabBarItemIndex(

Oded Harth 55 Dec 13, 2021
📱 A minimal tab bar alternative

MiniTabBar A clean simple alternative to the UITabBar. Only shows the title when being tapped on. Gives the app a way cleaner look :) Requirements iOS

Dylan Marriott 155 Dec 20, 2022
iOS Top Tab Navigation

iOS-Top-Tab-Navigation Good news for all our users out there! Now there are no boundaries to your convenience, you can pass as much words as you want

MindInventory 14 Aug 3, 2022
A flexible TabBarController with search tab like SNKRS.

PolioPager PolioPager is the easiest way to use PagerTabStrip including search tab in iOS. Written in pure swift. (日本語はこちら) Comparison SNKRS ↓↓↓↓ Poil

Yuiga Wada 176 Jan 7, 2023
:octocat: AdaptiveController is a 'Progressive Reduction' Swift UI module for adding custom states to Native or Custom iOS UI elements. Swift UI component by @Ramotion

ADAPTIVE TAB BAR 'Progressive Reduction' module for adding custom states to Native or Custom UI elements. We specialize in the designing and coding of

Ramotion 2k Nov 9, 2022
A fully customizable container view controller to display a set of ViewControllers in a horizontal scroll view. Written in Swift.

DTPagerController This is a control for iOS written in Swift. DTPagerController is simple to use and easy to customize. Screenshots Default segmented

Tung Vo 290 Nov 13, 2022
™️ A powerful paging view controller with interactive indicator bars

⭐️ Features Easy to implement page view controller with interactive indicator bars. Highly adaptable and powerful customization. Fully extensible with

UI At Six 2.5k Jan 2, 2023
CustomTabBar - A Custom TabBar Built Using Swift

CustomTabBar Thanks to Riccardo Cipolleschi for his awesome tutorial. The TabBar

SM Arif Ahmed 1 Feb 14, 2022
Custom segmented picker for SwiftUI

Custom segmented picker for SwiftUI

Sergey Kazakov 34 Dec 27, 2022