iOS Pod for a Soft UI (Neumorphic) Button for UIKit written in Swift

Last update: Jun 6, 2022

SoftButton

Platform Version Xcode License

About

This pod allows you to add neumorphic design to your UIButton in Swift. It supports both dark and light mode, respond to taps, and also offers customization options for the button's corner radius and bevel. Usage details are outlined below and an example project is included in the repo.

Requirements

  • iOS 13.0+
  • Swift 5.0+
  • UIKit framework

Installation

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

pod 'SoftButton'

Usage

import SoftButton at the top of your Swift file.

1. Storyboard Setup (If using storyboards)

  1. Edit outlet to conform to SoftButton
    @IBOutlet weak var btn:SoftButton!
  2. Also ensure to provide SoftButton as the Custom Class in the storyboard file

Otherwise: let btn = SoftButton()

2. Setup the Button

Then, simply call in viewDidAppear():
btn.makeNeuromorphic(superView: self.view)

Passing the view is important since the background cannot be pure black/white for the effect to work. The pod will setup the view's background for you.

Add Dark Mode Support

Add this block to dynamically change the button style based on light/dark mode. The pod will handle the rest.

override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
    super.traitCollectionDidChange(previousTraitCollection)
    btn.makeNeuromorphic(superView: self.view) // Add this line
}

Customization

You can also optionally specify the button's corner radius, setup the view individually, and provide the bevel amount

btn.bevel = 5 // Changes button's 'pop-out' amount
btn.makeNeuromorphic(cornerRadius: 25)

// Option 1:
btn.makeNeuromorphic(superView: self.view)
// Option 2:
btn.makeNeuromorphic()
self.view.backgroundColor = btnText.backgroundColor // Set view background manually
    

Important Notes

  1. makeNeuromorphic() has to be called from viewDidAppear() if any constraints are being used since viewDidLoad() does not have the button's bounds available to it. If the button has a fixed width and height however, then you may setup the button in viewDidLoad().
  2. Kindly ignore the misspelling of 'Neumorphic' in the function name. Thank you :)

Example

To run the example project, clone the repo and test on Xcode, or view the ViewController.swift file.

Author

Pallav Agarwal, [email protected]

License

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

GitHub

https://github.com/PallavAg/SoftButton
You might also like...

Easily customizable floating button menu created with SwiftUI

Easily customizable floating button menu created with SwiftUI

FloatingButton Easily customizable floating button menu created with SwiftUI We are a development agency building phenomenal apps. Usage Create main b

Jun 24, 2022

IGStoryButtonKit provides an easy-to-use button with rich animation and multiple way inspired by instagram story/stories.

IGStoryButtonKit provides an easy-to-use button with rich animation and multiple way inspired by instagram story/stories.

Introduction Have you ever seen UI like instagram story, haven't you? Actually, features like instagram story have been implemented in many applicatio

Jun 14, 2022

LTHRadioButton - A radio button with a pretty animation

LTHRadioButton - A radio button with a pretty animation

LTHRadioButton Slightly inspired by Google's material radio button. The clip below has 3 sections: full speed, 25% and 10%, but after converting it to

Jun 13, 2022

Multiple state tap-to-toggle UIButton (like old camera flash button)

Multiple state tap-to-toggle UIButton (like old camera flash button)

Multiple State Toggle UIButton A UIButton subclass that implements tap-to-toggle button text. (Like the camera flash and timer buttons) Usage Just cre

Mar 19, 2022

Lickable-Button We made the buttons on the screen look so good you'll want to lick them

Lickable-Button We made the buttons on the screen look so good you'll want to lick them. - Steve Jobs A little SwiftUI button project at WWDC 2021 Lic

Dec 29, 2021

Craft that perfect SwiftUI button effect 👌🏼

Craft that perfect SwiftUI button effect 👌🏼

buttoncraft (SwiftUI 3.0 App) Experimenting with SwiftUI 3.0 whilst creating a practical app to craft that perfect button style. ✈️ Testflight https:/

Jun 18, 2022

Custom loading button with progress swiftui

CustomLoadingButton Simple Custom Loading Progress Button for SwiftUI Version 1.0.0 This version requires Xcode 11+ SwiftUI iOS 13+ macOS 10.15+ Insta

Oct 18, 2021

An open-source library to use with SwiftUI, It allows you to create Floating menu action button.

An open-source library to use with SwiftUI, It allows you to create Floating menu action button.

Floating Menu Action Button Example Overview This is an open-source library to use with SwiftUI. It allows you to create Floating menu action button. Ins

Feb 14, 2022

Flat button with 9 different states using POP

Flat button with 9 different states using POP

VBFPopFlatButton Flat button with 21 different states and 2 types animated using pop. These are some examples of both types in different states: And h

Jun 17, 2022
Related tags
Revamped Download Button. It's kinda a reverse engineering of Netflix's app download button.
Revamped Download Button. It's kinda a reverse engineering of Netflix's app download button.

NFDownloadButton Revamped Download Button Requirements Installation Usage License Requirements iOS 8.0+ Swift 4.2+ Xcode 10.0+ Installation CocoaPods

May 25, 2022
Cute Animated Button written in Swift.
Cute Animated Button written in Swift.

DOFavoriteButton Cute Animated Button written in Swift. It could be just right for favorite buttons! Requirements iOS 7.0+ Swift 1.2 Installation Cart

Jun 16, 2022
Animated Play and Pause Button written in Swift, using CALayer, CAKeyframeAnimation.
Animated Play and Pause Button written in Swift, using CALayer, CAKeyframeAnimation.

AnimatablePlayButton Animated Play and Pause Button written in Swift, using CALayer, CAKeyframeAnimation. features Only using CAShapeLayer, CAKeyframe

Jun 10, 2021
Floaty is simple floating action button for iOS.
Floaty is simple floating action button for iOS.

Floaty is simple floating action button for iOS. (formerly KCFloatingActionButton) Why change the name? Follow the swift naming convention. KCF

Jun 19, 2022
iOS 7-style bouncy button.

SSBouncyButton SSBouncyButton is simple button UI component with iOS 7-style bouncy animation. Take A Look Try It! pod 'SSBouncyButton', '~> 1.0' Use

Mar 19, 2022
Flat design pressable button for iOS developers.
Flat design pressable button for iOS developers.

HTPressableButton HTPressableButton is designed for iOS developers to be able to spend time developing ideas, not building basic buttons. These stylis

May 16, 2022
Interactive and fully animated Material Design button for iOS developers.
Interactive and fully animated Material Design button for iOS developers.

WYMaterialButton Inspired by Google Material Design, written purely in Swift 3. WYMaterialButton implemented Material Design on iOS and add more dynam

Jan 23, 2022
A high-performance button control with rounded corners for iOS.
A high-performance button control with rounded corners for iOS.

TORoundedButton TORoundedButton is an open source UI control of a standard user button. Its design consists of displaying text on top of a solid recta

Jun 9, 2022
Customizable and easy to use expandable button in Swift.
Customizable and easy to use expandable button in Swift.

ExpandableButton Requirements iOS 9.0+ Installation CocoaPods: Add the following line to your Podfile: pod 'ExpandableButton' #for swift less than 4.

May 9, 2022
Simple and customizable button in Swift
Simple and customizable button in Swift

SwiftyButton Maintainer(s): @nickm01 @pmacro @aryamansharda Simple and customizable button in Swift. Installation Cocoapods pod 'SwiftyButton' Cartha

May 8, 2022