Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/TimOliver/TORoundedButton
A high-performance button control with rounded corners for iOS.
https://github.com/TimOliver/TORoundedButton
Last synced: 6 days ago
JSON representation
A high-performance button control with rounded corners for iOS.
- Host: GitHub
- URL: https://github.com/TimOliver/TORoundedButton
- Owner: TimOliver
- License: mit
- Created: 2019-04-20T12:12:53.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2023-10-09T06:50:09.000Z (about 1 year ago)
- Last Synced: 2024-05-09T19:58:29.918Z (7 months ago)
- Language: Objective-C
- Size: 1.46 MB
- Stars: 480
- Watchers: 12
- Forks: 18
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-ios - TORoundedButton - A high-performance button control with rounded corners. (UI / Button)
- awesome-ios-star - TORoundedButton - A high-performance button control with rounded corners. (UI / Button)
- Awesome-iOS - TORoundedButton - A high-performance button control with rounded corners for iOS. (UI Components)
README
# TORoundedButton
[](https://github.com/TimOliver/TORoundedButton/actions?query=workflow%3ACI)
[](http://cocoadocs.org/docsets/TORoundedButton)
[](https://swift.org/package-manager/)
[](https://github.com/Carthage/Carthage)
[](https://raw.githubusercontent.com/TimOliver/TORoundedButton/master/LICENSE)
[](http://cocoadocs.org/docsets/TORoundedButton)
`TORoundedButton` is an open source UI control of a standard user button. Its design consists of displaying text on top of a solid rectangle with rounded corners. This UI style has started becoming more and more common in iOS 11 and above, and while Apple has an official one they use internally, it is not possible to achieve this effect without heavily customizing `UIButton`.
`TORoundedButton` has been crafted to be as graphically performant as possible, based on guidance from Core Animation engineers from Apple at WWDC 2019. It is not simply a subclass of `UIButton`. Instead, it is a subclass of `UIControl` with all button graphics and behavior re-engineered from scratch.
_In 2021, Apple finally introduced an official way to create rounded `UIButton` styles with the [new `UIBackgroundConfiguration` API](https://developer.apple.com/documentation/uikit/uibackgroundconfiguration). If your app targets iOS 15 and above, you should consider using the official API instead._
# Features
* A completely custom implementation; no `UIButton` hacking.
* Implemented with guidance from Core Animation engineers at WWDC 2019.
* Uses the classic Apple 'continuous' curving style on iOS 13 and up.
* Extremely flexible with many options for configuring the look and feel of the button.
* Integrates with Interface Builder for visual configuration.
* Elegantly cancels and resumes animations when the user slides their finger on and off the button.
* Piggy-backs off most standard `UIView` properties in order to minimize the learning curve.
* Includes dynamic color code to generate a 'tapped' shade of the normal color, saving you extra effort.
* Fully compatible with Swift, with the class name `RoundedButton`.
# Examples
`TORoundedButton` features a complete default configuration useful for most app instances, but can be easily modified beyond that.
```swift
// Create a new instance of `RoundedButton`
let button = RoundedButton(text: "Continue")
// The button color itself is controlled via tintColor
button.tintColor = .red
// If desired a brightness offset that will be used to
// dynamically calculate the 'tapped' color from the default one.
button.tappedTintColorBrightnessOffset = -0.15
// A closure is used to detect when tapped
button.tappedHandler = {
print("Button tapped!")
}
```
One important thing to remember is that the button color is controlled via `tintColor` and not `backgroundColor`.
# Requirements
`TORoundedButton` will work with iOS 10 and above. While written in Objective-C, it will easily import into Swift.
## Manual Installation
Copy the contents of the `TORoundedButton` folder to your app project.
## CocoaPods
```
pod 'TORoundedButton'
```
## Carthage
```
github "TimOliver/TORoundedButton"
```
# Why build this?
This sort of button style is more or less a bread and butter requirement of a lot of iOS apps. But with even that being the case, it wasn't offered as an official implementation in `UIButton` [until iOS 15](https://developer.apple.com/documentation/uikit/uibackgroundconfiguration).
Because of this, most developers will achieve this look by simply giving a `UIButton` a solid background, and then using the Core Animation `cornerRadius` API to round the corners.
This sort of "just-in-time" solution is fine for the vast majority of apps out there that might need one or two rounded buttons. But certainly for apps that would want many of these buttons, and demand all the buttons look and behaviour is consistent, then it's a no-brainer to create a standardised library for this style.
In addition to that, while `UIButton` is a vary capable API, it is quite limiting. For example, it's not possible to animate the button zooming as it is tapped, or any other custom behaviour.
As such, in order to give this control as much control and flexibility over `UIButton`, it made sense to simply subclass `UIControl` to get all of the system interaction features, and then custom tailor the visual look on top of it.
# Feedback from Apple
During WWDC, it's usually possible to visit Apple engineers in the labs to get 1-on-1 engineering consultations. In 2019, this library was shown directly to two engineers from the Core Animation team, and they were exceptionally helpful in clearing up some misconceptions this library had assumed.
Some of the tips they mentioned included:
1. The original codepath this library used where it generated an opaque background in Core Graphics was basically an anti-pattern. The memory consumption and CPU overhead of creating these bitmaps almost certainly outweighed the performance gains over simply using the `cornerRadius` API.
2. Core Animation is very smart in that if no subview content will be clipped, it uses Metal to draw the `cornerRadius` clipping as a transparent bitmap. Transparent blending is basically free on modern iOS devices, so this is much more preferable to using an opaque bitmap from Core Graphics.
3. If there is subview content that might be clipped, Core Animation must do an off-screen render pass (This can be tested in the Simulator by checking "Off-screen rendered"). While doing this occasionally is fine, it is still a much heavier graphics operation than regular transparency blending and should always be avoided if it can be helped.
# Credits
`TORoundedButton` was created by [Tim Oliver](http://twitter.com/TimOliverAU) as a component of [iComics](http://icomics.co).
iOS device mockup art by [Pixeden](http://pixeden.com).
# License
`TORoundedButton` is available under the MIT license. Please see the [LICENSE](LICENSE) file for more information.