touyou / NeumorphismTab

NeumorphismTab is custom TabBarController with Neumorphism design.

Features

• Implement custom tab with neumorphism.
• UIView extension which add neumorphism shadow to any views.

Requirements

• Xcode 11.0 or greater
• iOS 11 or greater
• Swift 5.1

Installation

Carthage

If you're using Carthage, simply add NeumorphismTab to your Cartfile:

github "touyou/NeumorphismTab"

CocoaPods

NeumorphismTab is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'NeumorphismTab'

Swift Package Manager

NeumorphismTab is available through SwiftPM, create Package.swift and add dependencies value

dependencies: [
    .package(url: "https://github.com/touyou/NeumorphismTab.git", from: "0.9.6")
]

See also: GitHub - j-channings/swift-package-manager-ios: Example of how to use SPM v4 to manage iOS dependencies

or you can use GUI based SPM with Xcode 11.

Usage

Basic Neumorphism Tab

Like this.

Code is this.

import UIKit
import NeumorphismTab

class DemoTabBarController: NeumorphismTabBarController {

    override func setupView() {
        
        let color = UIColor(hex: "C1D2EB")
        let home = NeumorphismTabBarItem(icon: UIImage(systemName: "house.fill")!, title: "Home")
        let favorite = NeumorphismTabBarItem(icon: UIImage(systemName: "heart.fill")!, title: "")

        view.backgroundColor = color

        let homeViewController: ViewController = {
            let viewController = ViewController.instantiate()
            viewController.view.backgroundColor = color
            return viewController
        }()

        let favoriteViewController: UIViewController = {
            let viewController = UIViewController()
            viewController.view.backgroundColor = color
            return viewController
        }()

        setTabBar(items: [home, favorite])
        viewControllers = [homeViewController, favoriteViewController]
    }
}

NeumorphismTabBarController needs same background color throughout all view and ViewControllers. In particular, a luminance of the color should be within 0.18 to 0.88.

Add Neumorphism to any view

addNeumorphismShadow(with:) can add neumorphism to any view. with is parent of the view.

let color = UIColor(hex: "C1D2EB")
view.backgroundColor = color
childView.backgroundColor = color
childView.layer.cornerRadius = childView.bounds.width / 2
childView.layer.maskedCorners = [.layerMaxXMaxYCorner, .layerMaxXMinYCorner, .layerMinXMaxYCorner]
childView.addNeumorphismShadow(with: view)

Overridable method and properties

var tabHorizontalMargin: CGFloat

Override it if you want to adjust tab margin of horizontal.

var tabVerticalMargin: CGFloat

Override it if you want to adjust tab margin of bottom.

func setupView()

You must override it and setup ViewControllers and tab by calling setTabBar method here.

func switchedTab(to toIndex: Int)

Override it if you want to implement some feature when switching tab.

Other convenience properties, method and extensions

backgroundColor (in NeumorphismTabBarController)

If you set some color here, it can reset neumorphism shadow color with set color.

StoryboardInstantiable protocol and instantiate() method

When you use NeumorphismTabBarController, you should instantiate ViewControllers by code because you can setup it only in setupView method. StoryboardInstantiate protocol enable you to use Storyboard and instantiate by code easily.

You should write like this:

extension ViewController: StoryboardInstantiable {}

Then you should create new storyboard named ViewController's name (e.g. ViewController.storyboard), and make layout and set is initial view controller true. Now you can instantiate ViewController like this:

let viewController = ViewController.instantiate()

Hex color initializer

You can use UIColor initializer by hex string. You must not include # if you use it.

License

NeumorphismTab is available under the MIT license. See the LICENSE file for more info.