takescoop/swiftybutton

Simple and customizable button in Swift

SwiftyButton

Maintainer(s): @nickm01 @pmacro @aryamansharda

Simple and customizable button in Swift.

Installation

Cocoapods

pod 'SwiftyButton'

Carthage

github 'TakeScoop/SwiftyButton'

Usage

Flat Button

let button = FlatButton()
button.color = .cyan
button.highlightedColor = .blue
button.cornerRadius  = 5

Pressable Button

let button = PressableButton()
button.colors = .init(button: .cyan, shadow: .blue)
button.shadowHeight = 5
button.cornerRadius = 5

All Properties

Here is a list of all the properties that you can modify. Those are all editable directly from Interface Builder. See FlatButton.Defaults or PressableButton.Defaults to set defaults for those properties.

FlatButton

button.color = .cyan
button.highlightedColor = .cyan
button.selectedColor = .blue
button.disabledButtonColor = .gray
button.cornerRadius = 8

PressableButton

button.colors = .init(button: .cyan, shadow: .blue)
button.disabledColors = .init(button: .gray, shadow: .darkGray)
button.shadowHeight = 10
button.cornerRadius = 8
button.depth = 0.5 // In percentage of shadowHeight

Interface Builder (Storyboard/XIB)

Add a UIButton as usual, then:

• Modify the underlying class to FlatButton/PressableButton, and that the module is set to SwiftyButton
• Make sure that the button type is set to Custom

Defaults

You can set defaults that will be applied for any new instance of SwiftyButton by modifying the FlatButton.Defaults or PressableButton.Defaults structure:

FlatButton.Defaults.color = .cyan
PressableButton.Defaults.cornerRadius = 8
...

Custom Content

Use CustomPressableButton to add custom content in a Swifty Button.

This is a subclass of SwiftyButton that exposes a content view that moves when the button state changes. All you have to do is add your views inside button.contentView and setup layout constraints relative to this view.

Install

pod `SwiftyButton/CustomContent`

Usage

Here is how you would create a button similar to the one above (here we used PureLayout for constraints):

let button = CustomPressableButton()

let indicator = UIActivityIndicatorView(activityIndicatorStyle: .white)
button.contentView.addSubview(indicator)
indicator.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets(top: 10, left: 15, bottom: 10, right: 0), excludingEdge: .right)
indicator.startAnimating()

let label = UILabel()
button.contentView.addSubview(label)
label.autoPinEdgesToSuperviewEdges(with: UIEdgeInsets(top: 10, left: 0, bottom: 10, right: 10), excludingEdge: .left)
label.autoPinEdge(.left, to: .right, of: indicator, withOffset: 10)
label.text = "Loading..."
label.textColor = .white

Known limitations

• PressableButton only works with plain colors (no alpha / transparency) because of the way its background image is rendered. See #2
• PressableButton manages title and image insets automatically (titleEdgeInsets and imageEdgeInsets). See #5
  • User-specified inset values for top and bottom will be overridden.
  • You may specify inset values for left and right.

More examples

Look at the Examples folder to see more button examples.

Contribute

Publishing a new version

Here's an example of a version bump: bump to 0.8.0.

Replace NEW_VERSION with the version you're about to publish.

• Checkout the master branch and ensure it's up-to-date.
• Open SwiftyButton.xcworkspace and edit settings for the SwiftyButton target. Change the target version to NEW_VERSION.
• Open CHANGELOG.md and add a new section [NEW_VERSION]. At the bottom of the document, copy a version anchor and link to the new version tag (which we'll create later). Insert a new empty [master] section on top.
• Open SwiftyButton.podspec and edit s.version to NEW_VERSION.
• Commit your changes as Bump to NEW_VERSION.
• Create a new git tag named NEW_VERSION and push your commit + tag to Github.
• Push the new pod version with $ pod trunk push ./

License

This project is copyrighted under the MIT license. Complete license can be found here: https://github.com/TakeScoop/SwiftyButton/blob/master/LICENSE

Credits

• Inspired by HTPressableButton: https://github.com/herinkc/HTPressableButton
• Colors used in examples come from https://flatuicolors.com/

swiftybutton's Issues

Define Pressable Button colors via XIB/Storyboards

I'm able to change the colours on a FlatButton but not a PressableButton via Storyboards.

Is there a way to do this without dropping into the code?

Great library, thanks :)

Optimize buttonImageWithColor when shadowHeight = 0 (no need for backImage)

https://github.com/TakeScoop/SwiftyButton/blob/master/SwiftyButton/SwiftyButton%2BResizableImage.swift#L32

The image does not move with the button when I press a PressableButton

To reproduce this, put a PressableButton on the storyboard, set its image to some image and text to "". Now try to press the button. The button will look like as if it's been pressed, but the image stays at the same position. This looks very unnatural.

Shadow image is completely revealed when buttonColor is transparent

Xib / Storyboard visualization is broken (reproducible)

Hi,

First of all, this is an awesome library, thank you so much for your work.

I'm having an issue which I've confirmed on a clean project.

When adding a SwiftyButton to a xib/storyboard, all auto-layout behavior becomes broken for the screen on the xib editor. Additionally, the SwiftyButton is not rendered as it will appear on the screen (it continues to look like a standard UIButton).

During runtime, everything still works fine; only the xib/storyboard editor is broken.

I'm also getting these 2 errors:

file:///Users/ataibarkai/Local-Git-Repos/Experiments/SwiftyButtonExperiment/SwiftyButtonExperiment/Base.lproj/Main.storyboard: error: IB Designables: Failed to update auto layout status: dlopen(SwiftyButton.framework, 1): Library not loaded: @rpath/PureLayout.framework/PureLayout
  Referenced from: SwiftyButton.framework
  Reason: image not found

file:///Users/ataibarkai/Local-Git-Repos/Experiments/SwiftyButtonExperiment/SwiftyButtonExperiment/Base.lproj/Main.storyboard: error: IB Designables: Failed to render instance of SwiftyButton: dlopen(SwiftyButton.framework, 1): Library not loaded: @rpath/PureLayout.framework/PureLayout
  Referenced from: SwiftyButton.framework
  Reason: image not found

When selecting the module for the custom class on storyboard, I've tried both SwiftyButton (autocompleted by Xcode when selecting SwiftyButton as the class), and a module with a name identical to my project/target name.

This is reproducible on a clean project, installing SwiftyButton using cocoapods (v1.0.1).

Build Errors

When I build my project I got these errors:

What should I do to fix it?

Swift 4

Will we see an update for swift 4 anytime in the future?

Gradient color

hi
I need set gradient color to SwiftyButton

plz help me
ink

Can't create button in IB

When trying to create a button in IB following the instructions on the README I get the following error:

file:///Users/$USER/Path/To/My/Project/Base.lproj/Main.storyboard: warning: IB Designables: Using class UIButton for object with custom class because the class PressableButton does not exist

I installed via Coccoapods pod 'SwiftyButton' and when typing the buttons class in IB it does autocomplete it and offers it as an option in the list of choices.

Any help is appreciated, thanks!

EDIT: To be clear, I did set the button type to custom.

Setting customContentButton.cornerRadius doesn't set cornerRadius on the custom content view

Bottom of button text cut off when using Font Awesome

I'm new to iOS programming. I've noticed that if I have a prefix containing the letters "g", "p", etc, the bottom part of the text is cut off when I use font awesome icons by Vaberer's Font-Awesome-Swift library.

Do you have any hints to what might be causing this problem?

Title / image insets are overridden by PressableButton

Thoughts: only change the content insets and document heavily this unexpected behavior.

Swift 5.0

Is there any plan to support Swift 5.0? or has this repo gone stale??

SwiftyButton does not work with Carthage

$ carthage update --platform iOS
*** Fetching SwiftyButton
*** Fetching SwiftyJSON
*** Fetching Alamofire
*** Checking out Alamofire at "4.3.0"
*** Checking out SwiftyButton at "0.6.0"
*** Downloading SwiftyJSON.framework binary at "3.1.4"
*** xcodebuild output can be found in /var/folders/xl/gxvzy0ws6q3bs_p2q2k69mg00000gn/T/carthage-xcodebuild.CKTxod.log
*** Building scheme "Alamofire iOS" in Alamofire.xcworkspace
*** Skipped building SwiftyButton due to the error:
Dependency "SwiftyButton" has no shared framework schemes for any of the platforms: iOS

If you believe this to be an error, please file an issue with the maintainers at Optional("https://github.com/TakeScoop/SwiftyButton/issues/new")

Put Purelayout out of this library.

Such an awesome library, but wasted for fancy inclusion of another library that adds no value and can be coded with NSLayoutContrstaints. Please keep the code clean. The point of libraries are to keep third party dependency as less as possible.

The obvious answer would be, no you don't have to use my library, find another one or write it yourself. Well thats what I am doing. But just to make my point clear, just coz it your preference to use autolayout with PureLayout forces the users of this library to have that dependency. It is NOT required.

Flat button not visible on iPhone 5

Awesome Library! Thanks. It looks like the Button disappears when launched on an iPhone 5/5s. Is this a bug of some kind? Or am I doing something wrong. Works well on iPhone 6 and greater.