Flexible Tab Bar library for IOS
Flexible Tab Bar is a custom approach to the tab bar that allows you to create different views for different orientations/devices or states. iOS default UITabBar
is limited and it is really hard to customize it for different device states.
by Hosein
- Portrait (with a different type of button in the middle and different presentation when tapped)
- Landscape (same tab layout as for the portrait one)
- Portrait (the middle button is now placed at the end and has the same presentation style as the rest of the tab pages)
- Landscape (same tab layout as for the portrait one but now it displays the tab item title since it has more space to expand)
Add the WKTabBarController
folder to your project.
First extend your view controller from WKTabBarController
:
class ViewController: WKTabBarController {
}
You can set the items in the viewDidLoad
function via the tabBarItems
property:
tabBarItems = [
WKTabBarItem(title : TAB_ITEM_TITLE,
image : NORMAL_IMAGE,
highlighted : HIGHLIGHTED_IMAGE, (OPTIONAL)
selected : SELECTED_IMAGE (OPTIONAL)
)
]
WKTabBarController
already implements the WKTabBarControllerProtocol
, so in your ViewController
you can override
these methods in order to customize the appearance of the items:
func tabBarController(_ controller: WKTabBarController, cellNameAtIndex index: Int) -> WKTabBarCellName
func tabBarController(_ controller: WKTabBarController, customize cell: WKBaseTabBarCell, with item: WKTabBarItem, at index: Int)
The line below allows you to return the view controller that you want to be shown. If you decide you want to do something that doesn't implies showing a controller just do you thing and then return nil
.
func tabBarController(_ controller: WKTabBarController, viewControllerAtIndex index: Int) -> UIViewController?
Create a class that extends the WKBaseTabBarCell
class:
final class CustomTabBarItem: WKBaseTabBarCell {
}
In this class you can override these methods in order to customize the appearance of the item:
open func set(model: WKTabBarItem) // called when setting the tab bar model
open func commonInit() // called when initialized
open func set(highlighted: Bool) // called when the item should change its appearance on highlighted
open func set(selected: Bool) // called when the item should change its appearance on selected
After this don't forget to register the new class with this line:
self.register(cell: CustomTabBarItem.self, withName: "CustomTabBarItem")
And you can now return the custom cell to be displayed:
func tabBarController(_ controller: WKTabBarController, cellNameAtIndex index: Int) -> WKTabBarCellName {
return "CustomTabBarItem"
}