Custom UIButton effect inspired by Google Material Design

Overview

ZFRippleButton

iOS Custom UIButton effect inspired by Google Material Design written in Swift

Usage

Set the UIButton class in Nib to ZFRippleButton or create it programmatically.

Options

rippleOverBounds indicate that ripple should draw outsise the bounds or not

trackTouchLocation indicate that ripple should show from the touch location or not

shadowRippleEnable indicate that it will show additional shadow when you click or not

touchUpAnimationTime is time interval of touch up animation

and you can set the color of ripple using rippleColor and rippleBackgroundColor

Requirements

  • iOS >= 8.0

Author

Amornchai Kanokpullwad, [email protected]

License

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

Comments
  • UIViewReportBrokenSuperviewChain iOS 10 crash

    UIViewReportBrokenSuperviewChain iOS 10 crash

    I'm getting the following error on iOS 10. This is a new error so not seen a lot on Stackoverflow about this: http://stackoverflow.com/questions/39565424/swift-uiviewreportbrokensuperviewchain-cause-by-layer-manipulation

    Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'View has lost track of its superview, most likely through unsupported use of CALayer API on the view's layer. If this isn't a crash yet, it will be in the near future. Problem view: <UIView: 0x7e70e630; frame = (0 0; 72 205); alpha = 0; layer = <CALayer: 0x7a6521b0>> Expected parent: <ZFRippleButton.ZFRippleButton: 0x7a906fb0; baseClass = UIButton; frame = (528 12; 72 205); opaque = NO; autoresize = RM+BM; layer = <CALayer: 0x7e7144e0>> Break on UIViewReportBrokenSuperviewChain to debug.'

    opened by elprl 9
  • UIViewReportBrokenSuperviewChain on iOS 10

    UIViewReportBrokenSuperviewChain on iOS 10

    I'm addressing a UIViewReportBrokenSuperviewChain issue which makes my app to crash. My buttons are added on the view using Interface Builder, no code. They were working fine on Xcode 7 / iOS 9. No changes are made with Xcode 8 / iOS 10, I just opened the project, run it on a real device and get this crash.

    I'm using ZFRippleButton 0.5.1.

    2016-10-21 10:02:48.620067 Cinemappy[9732:2494425] *** Assertion failure in void UIViewReportBrokenSuperviewChain(UIView *__strong, UIView *__strong, BOOL)(), /BuildRoot/Library/Caches/com.apple.xbs/Sources/UIKit/UIKit-3599.6.1/UIView.m:190
    2016-10-21 10:03:05.951306 Cinemappy[9732:2494425] *** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'View has lost track of its superview, most likely through unsupported use of CALayer API on the view's layer. If this isn't a crash yet, it will be in the near future. 
        Problem view: <UIView: 0x15fc91740; frame = (0 0; 1000 1000); alpha = 0; layer = <CALayer: 0x1746298c0>>
        Expected parent: <ZFRippleButton.ZFRippleButton: 0x15fc90b40; baseClass = UIButton; frame = (0 0; 1000 1000); opaque = NO; autoresize = RM+BM; tintColor = UIExtendedSRGBColorSpace 1 1 1 1; layer = <CALayer: 0x174821f20>>
    Break on UIViewReportBrokenSuperviewChain to debug.'
    *** First throw call stack:
    (0x1894dc1c0 0x187f1455c 0x1894dc094 0x189f66898 0x18f604f9c 0x18f605658 0x18fc7b390 0x189f122bc 0x189f07ab8 0x189f0765c 0x189f07444 0x18f42a76c 0x18f42a4d0 0x18f371be0 0x19553fd04 0x19553fad4 0x195553d5c 0x18f6195e8 0x18f33beac 0x1893c91a4 0x1893c90a0 0x18f32ac30 0x18f427330 0x18f61f2c4 0x18f32254c 0x18c7ea40c 0x18c7df0e8 0x18c7defa8 0x18c75bc64 0x18c
    libc++abi.dylib: terminating with uncaught exception of type NSException
    
    opened by vitobellini 2
  • Add attribute to shorten touch up animation time.

    Add attribute to shorten touch up animation time.

    Too long touch up animation interval causes slow response to fast consecutive button press! However I know that the original one is more beautiful. So I add an user-defined runtime attribute "fastTouchUpResponse" for developer to make the choice.

    opened by ronaldmak 2
  • Cocoa pods error: libel: unknown option character `X' in: -Xlinker

    Cocoa pods error: libel: unknown option character `X' in: -Xlinker

    I'm getting this error when installing via cocoa pods: libtool: unknown option character `X' in: -Xlinker.

    Manually adding the ZFRippleButton.swift file to the project works fine.

    Thanks.

    opened by neowinston 2
  • Can't set rippleColor and rippleBackgroundColor Programmatically

    Can't set rippleColor and rippleBackgroundColor Programmatically

    Dear team,

    When we upgrade the library to support Swift3, when we do such as : rippleButton.rippleColor = UIColor.green, produce error : Failed to set (rippleColor) user defined inspected property on (UIButton): [<UIButton 0x113d20f00> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key rippleColor.

    While for the Swift 2 version, we can set it programmatically.

    Best Regards,

    opened by tonifirnandes 1
  • Xcode 7.1 errors (not public methods)

    Xcode 7.1 errors (not public methods)

    Hello!

    Thank you for fix previews issue. But the code still have errors. You have some methods as private, this methods should be public.

    http://joxi.ru/8ZrJodMieDlvmj

                cell.controlButton.rippleBackgroundColor = .grayColor()
                cell.controlButton.rippleColor = .lightGrayColor()
                cell.controlButton.ripplePercent = 1
    

    Can you fix it?

    opened by melnikovpa 1
  • Fix bug: Autolayout causes the wrong center position of ripple view.

    Fix bug: Autolayout causes the wrong center position of ripple view.

    This bug occurs under the following conditions:

    1. Autolayout is used. (I use Stack View.)
    2. Track touch location is off or default.

    In event "layoutSubviews()", the old rippleView.center is kept in order to get touch location from event "beginTrackingWithTouch" when track touch location is enabled. However the center position is always changed when auto layout is used. When track touch location is off, the wrong center position is kept.

    opened by ronaldmak 1
  • handle cancel event

    handle cancel event

    I've been using this class for cells in a uitableview, and there are certain cases when the touch ends up cancelled instead of ended. This causes the button to get stuck a state as if it were permanently pressed down.

    Consequently I took the code that handled an ended touch and overrode the cancel handler to perform the same action.

    opened by MichaelDanielTom 1
  • Fix #4: Update bounds on change layout

    Fix #4: Update bounds on change layout

    Hello first, I really like your button. I was having the same issue as #4 so I've overriden layoutSubviews to update the rippleView and the backgroundView frames. I've also added a corner radius property so as to have rounded buttons. What do you think?

    PS I updated the storyboard layout to reflect this change when you rotate the view and made the class @IBDesignable to see the changes immediately. PPS sorry for my bad english

    ios simulator screen shot 18 09 2014 10 29 01

    ios simulator screen shot 18 09 2014 10 29 06

    opened by vanyas 1
  • Ripple doesn't update if frame changes

    Ripple doesn't update if frame changes

    I usually set my frames to CGRectZero on initialize and update the frame later based on the size of the text in the button.

    If I work that way, the ripple doesn't show.

    bug 
    opened by mxcl 1
  • Ripple views access

    Ripple views access

    Allow public access to ripple views in case user implementations need to add even more subviews, which should be inserted beneath those added by ZFRippleButton.

    opened by noordawod 0
  • Support Swift 4.2

    Support Swift 4.2

    Hi, your code is clean and awesome and I really appreciate you making it open source. I think supporting Swift 4.2 would make this code more readable and valuable. Thus, this PR.

    opened by e-sung 0
  • Image disappeared on click

    Image disappeared on click

    I really like this library. Now i am facing issue which when i tapped on button then image that i set has been disappeared but when my finger has released then image appears as usual. Can you solve this problem?

    button.rippleColor = UIColor.red button.backgroundColor = UIColor.red button.setTitle("File Server", for: .normal) button.setImage(UIImage(named: "filesharing"), for: .normal) button.titleLabel?.font = UIFont(name: "SFCompactText-Regular", size: 16) button.titleEdgeInsets = UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 0)

    opened by SamboVisal 0
  • Failed to render and updater auto layout status

    Failed to render and updater auto layout status

    Hi there,

    I've gotten two errors below after updating to Xcode 8.2.1:

    Main.storyboard: error: IB Designables: Failed to render and update auto layout status for ViewController (BYZ-38-t0r): dlopen(ZFRippleButton.framework, 1): no suitable image found. Did find: ZFRippleButton.framework: required code signature missing for 'ZFRippleButton.framework'

    Main.storyboard: error: IB Designables: Failed to update auto layout status: dlopen(ZFRippleButton.framework, 1): no suitable image found. Did find: ZFRippleButton.framework: required code signature missing for 'ZFRippleButton.framework'

    Not sure but maybe it's not related to new update of Xcode.

    Thank you, Serhiy

    opened by sotrosh 0
  • Fixed issue of blinking, when you use image and text both

    Fixed issue of blinking, when you use image and text both

    I am using this repository in more then one project and i found this little unexpected behavior which is fixed by writing those lines in the class file. I want this to be on the main repo. Please review and merge if found appropriate. Thank you.

    opened by mahesh-agrawal-616 0
Releases(0.5)
Owner
Amornchai Kanokpullwad
Amornchai Kanokpullwad
Material Design Floating Action Button in liquid state

LiquidFloatingActionButton [] (https://github.com/Carthage/Carthage) LiquidFloatingActionButton is floating action button component of material design

Takuma Yoshida 3.8k Dec 29, 2022
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

Yu Wang 76 Oct 7, 2022
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

Yonat Sharon 83 Oct 11, 2022
🔥 PMSuperButton is a powerful UIButton coming from the countryside, but with super powers! 😎

PMSuperButton is a powerful UIButton coming from the countryside, but with super powers! ?? An easy way to create custom and complex buttons with cust

Paolo Musolino 720 Nov 17, 2022
UIButton sublass for loading and transition animation.

TransitionButton Concept Source: Dribbble Preview Expand animation: Shake animation: Example To run the example project, clone the repo, then open the

null 1.4k Dec 25, 2022
UIButton-based view with fade in/out animation features

JTFadingInfoView Overview JTFadingInfoView is google's material design like notification view with smooth fade in/out animation features, based on UIB

Junichi Tsurukawa 129 Mar 19, 2022
A fully customisable swift subclass on UIButton which allows you to create beautiful buttons without writing any line of code.

JSButton Demo $ pod try JSButton ...or clone this repo and build and run/test the JSButton project in Xcode to see JSButton in action. If you don't ha

Jogendra 12 May 9, 2022
A small and flexible (well documented) UIButton subclass with animated loading progress, and completion animation.

ButtonProgressBar-iOS Example For LIVE PREVIEW on Appetize in your browser itself, click here. To run the example project, clone the repo, and run pod

Pushkar Sharma 566 Dec 9, 2022
Full-featured IBDesignable UIButton class

SpicyButton Full-featured IBDesignable UIButton class Installation Add the following to your project's Podfile: pod 'SpicyButton' Usage You can easily

Luke Crum 2 Sep 6, 2022
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:/

An Trinh 188 Dec 28, 2022
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

Famolus 859 Dec 12, 2022
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

mutation 34 Nov 8, 2022
Inspired by Apple’s download progress buttons in the app store

GBKUIButtonProgressView Inspired by Apple’s download progress buttons in the app store Created by @pklada and @miketsprague Checkout the blog post. In

Guidebook 541 Sep 1, 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

Tariqul 1 Dec 14, 2022
ProgressButton - Custom button class that displays a progress bar around it to gauge

ProgressButton Check it out To run the example project, clone the repo, and open the 'Example/Example.xcodeproj' file. Requirements This component is

Guilherme Moura 116 May 29, 2022
A Customizable Switch UI for iOS, Inspired from Google's Material Design in Swift

MJMaterialSwitch Overview MJMaterialSwitch is google's material design like switch UI with animation features. This library has cool and sophisticated

Jaleel Nazir 64 Jul 29, 2022
A Customizable Switch UI for iOS, Inspired from Google's Material Design

Overview JTMaterialSwitch is google's material design like switch UI with animation features. This library has cool and sophisticated animations, ripp

Junichi Tsurukawa 319 Nov 28, 2022
Google Material Design Icons for Swift and ObjC project

GoogleMaterialIconFont Google Material Design Icons for Swift and ObjC project This library is inspired by FontAwesome.swift Both Swift and Objctive-C

Yusuke Kita 146 Nov 8, 2022
Google Material Design Icons Font for iOS

GoogleMaterialDesignIcons #Google Material Design Icons Font for iOS It is based on https://github.com/google/material-design-icons. it converts the m

Yuji Hato 365 Oct 19, 2022
A Slide Menu, written in Swift, inspired by Slide Menu Material Design

Swift-Slide-Menu (Material Design Inspired) A Slide Menu, written in Swift 2, inspired by Navigation Drawer on Material Design (inspired by Google Mat

Boisney Philippe 90 Oct 17, 2020