Swift 中简单且可自定义的按钮

斯威夫特按钮

维护者: @nickm01 @pmacro @aryamansharda

Swift 中简单且可自定义的按钮。

迦太基兼容

安装

椰子足类

pod 'SwiftyButton'

迦太基

github 'TakeScoop/SwiftyButton'

用法

平面按钮

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

可按下按钮

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 or to set defaults for those properties.FlatButton.DefaultsPressableButton.Defaults

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 as usual, then:UIButton

  • Modify the underlying class to , and that the module is set to FlatButton/PressableButtonSwiftyButton
  • 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 or structure:FlatButton.DefaultsPressableButton.Defaults

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

Custom Content

Use to add custom content in a Swifty Button.CustomPressableButton

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

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 ( and ). See #5titleEdgeInsetsimageEdgeInsets
    • User-specified inset values for and will be overridden.topbottom
    • You may specify inset values for and .leftright

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 with the version you’re about to publish.NEW_VERSION

  • Checkout the branch and ensure it’s up-to-date.master
  • Open and edit settings for the target. Change the target version to .SwiftyButton.xcworkspaceSwiftyButtonNEW_VERSION
  • Open and add a new section . 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 section on top.CHANGELOG.md[NEW_VERSION][master]
  • Open and edit to .SwiftyButton.podspecs.versionNEW_VERSION
  • Commit your changes as .Bump to NEW_VERSION
  • Create a new git tag named and push your commit + tag to Github.NEW_VERSION
  • 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

GitHub

点击跳转