ExpandedTabBar is a very creative designed solution for "more" items in UITabBarController

Overview

ExpandedTabBar v3.0.1

Platform Badge w/ Version Platform

ExpandedTabBar is a very creative designed solution for "more" items in UITabBarController. It's greate experience to have more comfortable and intuitive UI.

Requirements

  • iOS 11.0 +
  • Swift 5.﹡
  • XCode 10 +

Installation

ExpandedTabBar doesn't contain any external dependencies.

These are currently the supported intllation options:

CocoaPods

To integrate ExpandedTabBar into your Xcode project using CocoaPods, specify it in your Podfile:

use_frameworks!

target '
   
    '
    do
    pod 'ExpandedTabBar'
end

Swift Package Manager

The Swift Package Manager is a tool for automating the distribution of Swift code and is integrated into the swift compiler. It is in early development, but appstore-card-transition does support its use on supported platforms.

Once you have your Swift package set up, adding ExpandedTabBar as a dependency is as easy as adding it to the dependencies value of your Package.swift.

dependencies: [
    .package(url: "https://github.com/yervandsar/ExpandedTabBar", from: "3.0.1")
]

Or you can checkout Adding Package Dependencies to Your App by Apple

Flow Setup

  • With Storyboard

  1. Create UITabBarController
  2. Extend from ExpandedTabBarController
  3. Set to UITabBarController in storyboard
  • Programmatically

let viewControllers: [UIViewController] = [...] // Array of view controllers for UITabBarController
let expandedTabBar = ExpandedTabBarController()
expandedTabBar.setup(viewControllers: viewControllers)

NOTE: any UIViewController in viewControllers array must have tabBarItem.

Delegation

For tab selection action implement ExpandedTabBarControllerDelegate:

func expandedTabBarController(
    _ tabBarController: UITabBarController,
    didSelect viewController: UIViewController,
    withItem tabBarItem: UITabBarItem?
)

Customization

  • More Tab

You can customize more tab in storyboard, or set programmatically.

moreTitle        : String   // Default "More"
moreIcon         : UIImage? // Default Image from SystemItem.More
moreSelectedIcon : UIImage? // Default nil
  • Dark Mode Support

ExpandedTabBar is fully Light/Dark mode supported and for setting any UIColor or CGColor you can use.

let color: UIColor/CGColor = .pattern(light: UIColor, dark: UIColor)

NOTE: If device OS version does not support dark mode, it will take light as default.

  • Options Customization

ExpandedTabBar options conforms to Options protocol.

public  protocol  Options {
    var  background   : BackgroundOptions
    var  container    : ContainerOptions
    var  animationType: AnimationType
    var  indicatorType: IndicatorTypes
}

Background Options

public protocol  BackgroundOptions {
    var color     : UIColor // Default .clear
    var alpha     : CGFloat // Default 0.3
    var closeOnTap: Bool    // Default true
}

Container Options

public protocol  ContainerOptions {
    var color         : UIColor             // Default .pattern(light: .white, dark: .black)
    var alpha         : CGFloat             // Default 1.0
    var cornerRadius  : CGFloat             // Default 10
    var roundedCorners: UIRectCorner        // Default .allCorners
    var bottomMargin  : CGFloat             // Default 15
    var tabSpace      : CGFloat             // Default 8
    var tab           : ContainerTabOptions
    var shadow        : ShadowOptions?      // Default nil
}

NOTE: For shadow you can see and use ShadowDefaultOptions class

Container's Tab Options

public protocol  ContainerTabOptions {  
    var itemHeight     : CGFloat.           // Default 35
    var titleFont      : UIFont             // Default .systemFont(ofSize: 16)
    var titleColor     : UIColor            // Default .pattern(light: .black, dark: .white)
    var iconColor      : UIColor            // Default .pattern(light: .black, dark: .white)
    var iconContentMode: UIView.ContentMode // Default .scaleAspectFit
    var iconTitleSpace : CGFloat            // Default 8
}

Animation Types

NoneAnimations Translate Zoom Rotate
.none .top Default .zoomIn .rotatePositive
.crossDissolve .bottom .zoomOut .rotateNegative
.left .zoomX .rotate(angle: .pi/6)
.right .zoomY

NOTE: You can create your own animation .custom(AnimationProtocol). You can use TransformAnimation for creating custom animations

Indicator Types

.none .connectedLine .triangle Default

Examples

final class CustomViewController: ExpandedTabBarController {

    override func viewDidLoad() {
        super.viewDidLoad()
        expandedDelegate = self
        expandedTabBarOptions = customOptions
        
    }
    
    private var customOptions: Options {
        var options = ExpandedTabBarOptions()
        
        options.indicatorType = .connectedLine
        options.animationType = .custom(customAnimation)
        
        options.container.roundedCorners = [.topLeft, .topRight, .bottomLeft]
        options.container.cornerRadius = 20
        
        options.container.shadow = ShadowDefaultOptions()
        options.container.tabSpace = 15
        options.container.tab.iconTitleSpace = 15
        
        return options
    }
    
    private var customAnimation: AnimationProtocol {
        let transform = CGAffineTransform(scaleX: 0.1, y: 0.1).rotated(by: .pi)
        return TransformAnimation(transform: transform)
    }
    
}

extension  CustomViewController: ExpandedTabBarControllerDelegate {

    func expandedTabBarController(_ tabBarController: UITabBarController,
                                    didSelect viewController: UIViewController,
                                    withItem tabBarItem: UITabBarItem?) {
        // Do some logic here
    }
}

Support

Feel free to open issuses with any suggestions, bug reports, feature requests, questions.

Let us know!

We’d be really happy if you sent us links to your projects where you use our component. Just send an email to [email protected] And do let us know if you have any questions or suggestion regarding the animation.

License

The MIT License (MIT)

Copyright (c) 2018 Yervand Saribekyan

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Comments
  • didSelect delegate function seems broken !?

    didSelect delegate function seems broken !?

    didSelect only gets called for items inside the more container? the other tabBarItems outside get ignored :S

    this cant even be circumvented by conforming to UITabBarControllerDelegate ( redundant conformance to UITabBarControllerDelegate )

    ( tested on latest version & iphone 11 ) really like v3.0.0 otherwise ^^ great job

    bug question 
    opened by undeaDD 4
  • ExpandedTabBarOptions not working

    ExpandedTabBarOptions not working

    Hi I am trying to set these following options in my controller and they don't do nothing.

    var options = ExpandedTabBarOptions() options.containerItemsSpace = 5 options.spaceBetweenImageTitle = 5 options.containerBottomMargin = 5 options.backgroundColor = UIColor.black options.containerBackgroundColor = UIColor.black options.titleColor = UIColor.hexColor("#dab070") let fontDesc = UIFontDescriptor(name: "Snell Roundhand", size: 18) options.titleFont = UIFont(descriptor: fontDesc, size: fontDesc.pointSize) options.imageContentMode = .scaleAspectFit self.options = options

    How can I make them work please suggest, or am I setting them incorrectly ?

    Waiting response 
    opened by iamdeadman 3
  • add TapToCloseMenu Option/Gesture

    add TapToCloseMenu Option/Gesture

    • adds an UITapGestureRecognizer to the backgroundView ( if specific option is enabled )
    • can be disabled via ExpandedTabBarOptions
    • defaultOption: enabled
    opened by undeaDD 3
  • v 3.0.0 Development

    v 3.0.0 Development

    1. Swift Package manager support
    2. Performance improvements
    3. New Structured file system and more clean code
    4. Dark/Light mode dynamic support
    5. New Protocol Oriented Options
    6. Wild size support in expanded container
    7. New Animations for expanded container and ability add own animation
    8. New Indicator types
    opened by yervandsar 0
  • The

    The "more" popover is not displayed during multi-tasking on iPad

    When the app is changed to multi-tasking (Eg, with other app opened side-by-side), the more popup is not displayed or placed incorrectly and not visible to users.

    bug 
    opened by chienplee 0
  • Feature Request: Dynamic Number of Tabbar items

    Feature Request: Dynamic Number of Tabbar items

    Hi,

    It will be great if the number of tabbar items (currently set to 4) can be adjusted according to trait collection. Eg, Limit to 4 when horizontalSizeClass is compact and no limit when it is regular. This is also the behavior for native UITabbarController.

    enhancement 
    opened by chienplee 0
  • Container not showing

    Container not showing

    I just updated to version 3.0.1 and now the container is not appearing. I can see the arrow, the background alpha changes, but the container with my 3 items does not show. The last working version for me appears to be 2.0.2.

    bug 
    opened by goalguy10 0
Releases(3.0.1)
Owner
Yervand Saribekyan, iOS Dev
Yervand Saribekyan, iOS Dev
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
KYWheelTabController is a subclass of UITabBarController.It displays the circular menu instead of UITabBar.

KYWheelTabController KYWheelTabController is a subclass of UITabBarController.It displays the circular menu instead of UITabBar. Installation CocoaPod

kyo__hei 121 Oct 10, 2022
UITabBarController with swipe interaction between its tabs.

?? Features Zero setup Different animations Enable/Disable interactions easily Fluid gestures ?? Installation Using CocoaPods Edit your Podfile and sp

Marcos Griselli 1.4k Jan 7, 2023
A subclass of UITabBarController that translates UITabBarItems 1:1 into a Sidebar on iPadOS.

FredKitTabBarSplitView A subclass of UITabBarController that translates UITabBarItems 1:1 into a Sidebar on iPadOS. Simply use FredKitTabBarSplitView

Frederik Riedel 9 Jan 12, 2022
RAMAnimatedTabBarController is a Swift UI module library for adding animation to iOS tabbar items and icons. iOS library made by @Ramotion

ANIMATED TAB BAR Swift UI module library for adding animation to iOS tabbar items and icons.

Ramotion 11k Jan 8, 2023
This library is for adding animation to iOS tabbar items, which is inherited from UITabBarController.

This library is for adding animation to iOS tabbar items, which is inherited from UITabBarController. Installation Just add the Sources folder to your

Yuşa Doğru 162 Jan 6, 2023
Red Torch is a very very (very) simple iOS app that allows you to have a red torch using your screen.

RED Torch Red Torch is a very very (very) simple iOS app that allows you to have a red torch using your screen. The App is based on storyboard, so the

Jakub 0 Jan 1, 2022
A UICollectionViewLayout subclass displays its items as rows of items similar to the App Store Feature tab without a nested UITableView/UICollectionView hack.

CollectionViewShelfLayout A UICollectionViewLayout subclass displays its items as rows of items similar to the App Store Feature tab without a nested

Pitiphong Phongpattranont 374 Oct 22, 2022
List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.

CAROUSEL List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center. We speci

Ramotion 557 Dec 31, 2022
Use the iPhone X notch in creative ways 👩‍🎨👨‍🎨.

NotchToolkit NotchToolkit is a framework for iOS that allow developers use the iPhone X notch space in creative ways. Inspired by I was working on thi

Ahmed Bekhit 56 Nov 22, 2022
A CMIO Camera Extension of the creative camera type, with configuration app

ArtFilm A CMIO Camera Extension of the creative camera type, with configuration app ArtFilm is the sample code for the blog post Getting To Grips With

Halle 7 Jan 1, 2023
Deal with query items, HTTP headers, request body and more in an easy, declarative way

Reusable system for complex URL requests with Swift. Deal with query items, HTTP headers, request body and more in an easy, declarative way. Check out our engineering blog to learn more!

Parable Health 19 Sep 5, 2022
Letters animation allows you to click on different letters and accordingly it will animate letters in a cool way. It has a very attractive UI and is very easy to use.

Letters Animation Cool Letters Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

MindInventory 31 Oct 4, 2022
Numbers animation allows you to click on different numbers and accordingly it will animate numbers in a cool way. It has a very attractive UI and is very easy to use.

Numbers Animation Cool Numbers Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

MindInventory 31 Oct 4, 2022
Reading animation allows you to click on the different page numbers and accordingly it will animate page changes in a cool way. It has a very attractive UI and is very easy to use.

Reading Animation Cool Reading Animation in iOS written in Swift. Preview Table of content :- Description How to add in your project Requirement Licen

MindInventory 42 Oct 4, 2022
BWMCoverView is a very easy to use advertising the carousel view, supports circular scrolling functions such as switching, asynchronous loading of images, animation, custom is very high.

BWMCoverView BWMCoverView is a very easy to use advertising the carousel view, supports circular scrolling functions such as switching, asynchronous l

Bi Weiming 31 Mar 10, 2021
Swift APIs for SQLite: Type-safe down to the schema. Very, very, fast. Dependency free.

Lighter Lighter is a set of technologies applying code generation to access SQLite3 databases from Swift, e.g. in iOS applications or on the server. L

Lighter.swift 330 Dec 26, 2022
ESTabBarController is a highly customizable TabBarController component, which is inherited from UITabBarController.

ESTabBarController is a highly customizable TabBarController component, which is inherited from UITabBarController. Why? In real-world developmen

Vincent Li 4.9k Jan 5, 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