Animated Tab Bar – A tabbar in pure SwiftUI

AnimatedTabBar is a tabbar with number of preset animations written in pure SwiftUI.

Animated Tab Bar Usage

1. Add an Int to store current selection
2. Pass your buttons to AnimatedTabBar using one of 2 constructors. For the first one you can pass any view types:

import AnimatedTabBar

AnimatedTabBar(selectedIndex: $selectedIndex) {
    TabButton1()
    TabButton2()
    TabButton3()
}

For the second one views must have the same type, or be manually converted to AnyView

AnimatedTabBar(selectedIndex: $selectedIndex, views: [TabButton1(), TabButton2(), TabButton3()])

Required parameters

selectedIndex – binding to current index
views – buttons to display in a tabbar

Available customizations – modifiers

use customize closure in popup modifier:

barColor – Color of the tabbar itself selectedColor – Selected tab color (use template rendering for this color to be applied properly)
unselectedColor – Unselected tab color
ballColor – Ball indicator color
verticalPadding – Space from buttons to bar’s top and bottom edges
cornerRadius – Applied to tabbar background color
ballAnimation – Default is .easeOut(duration: 0.6): Animation curve to apply to ball motion
indentAnimation – Animation curve for growing/shrinking of the indent in the tabbar
buttonsAnimation – Animation curve for applying color to tab buttons

ballTrajectory – Options for ball indicator animation paths:

• parabolic – Jump to selected button following a parabolic arc
• teleport – Disappear and quickly re-appear above selected tab
• straight – Slide to selected tab

Built-in animatable tab buttons

By default tabs only have a simple animation of color, but you can customize that. This library has two built-in button types you can use out-of-the-box: DropletButton and WiggleButton, and a super custom ColorButton type in Example project. Please feel free to use them in your projects or build your own buttons on top of them.

Examples

To try AnimatedTabBar examples:

• Clone the repo https://github.com/exyte/AnimatedTabBar.git
• Open terminal and run cd <AnimatedTabBarRepo>/Example/
• Run pod install to install all dependencies
• Run open AnimatedTabBarExample.xcworkspace/ to open project in the Xcode
• Try it!

Installation

Swift Package Manager

dependencies: [
    .package(url: "https://github.com/exyte/AnimatedTabBar.git")
]

CocoaPods

To install AnimatedTabBar, simply add the following line to your Podfile:

pod 'ExyteAnimatedTabBar'

Carthage

To integrate AnimatedTabBar into your Xcode project using Carthage, specify it in your Cartfile

github "Exyte/AnimatedTabBar"

Requirements

• iOS 14+
• Xcode 12+

Animated Tab Bar on GitHub: https://github.com/exyte/AnimatedTabBar
Platform: iOS
⭐️: 24