PWSwitch
Custom UISwitch implementation designed for those who want more control over the looks of the component. Built with CALayer and CAAnimation for finer control and nice interaction visual effects.
- Supports Autolayout
- Supports Storyboard (@IBDesignable, @IBInspectable)
- Can be easily added and configured programmatically
- Global customization with UIAppearance
- Supports standard UISwitch setOn method and ValueChanged control event
- Replicates standard UISwitch visual feedback animations
1.1 version breaking changes
- Renamed
trackOnFillColortotrackOnBorderColorand added realtrackOnFillColorproperty which works only ifshouldFillOnPushis set to false. To restore previous behavior renametrackOnFillColortotrackOnBorderColorin your project everywhere you use it and then set newtrackOnFillColorto clear. (should be by default) - Added
thumbOffPushBorderColor. If you have changed defaultthumbOffBorderColorthen you probably need to adjustthumbOffPushBorderColornow also.
Usage
Simply add PWSwitch init with non-zero rect to your view. 50x26 is the default size, changing it may require adjusting thumbDiameter property
let pwSwitch = PWSwitch(frame: CGRect(x: 0, y: 0, width: 50, height: 26))
view.addSubview(pwSwitch)Alternatively you can use storyboard and/or autolayout to add PWSwitch to your view.
PWSwitch supports standard UISwitch setOn(on: Bool, animated :Bool) method to change state of PWSwitch from code, add sends UIControlEvents.ValueChanged event when state changes. Current state of the control can be obtained with the on property.
pwSwitch.setOn(true, animated: true)
pwSwitch.addTarget(self, action: #selector(self.onSwitchChanged), forControlEvents: .ValueChanged)
if pwSwitch.on {
//do something is switch is on
}PWSwitch has a wide number of properties to customize it's appearance. All properties can be set globally with the UIAppearance proxy: PWSwitch.appearance(), or directly in code or Interface Builder attribute inspector. Global values set with the UIAppearance can be overriden for specific instance by changing their property values directly.
trackOffBorderColor- track border color when state is OfftrackOffPushBorderColor- track border color when switch is pressed (touch began, but not ended). Border width is animated and fills inside of the track completely ifshouldFillOnPushis truetrackOffFillColor- track fill color when state is OffthumbOffBorderColor- thumb border color when state is OffthumbOffPushBorderColor- thumb border color when switch is pressed (touch began, but not ended). Set to the same value asthumbOffBorderColorif border color animation is not desireablethumbOffFillColor- thumb fill color when state is OfftrackBorderFillColor- track border color when state is On. IfshouldFillOnPushis true then border completely fills tracktrackOnFillColor- track fill color when state is OnthumbOnBorderColor- thumb border color when state is OnthumbOnFillColor- thumb fill color when state is OnthumbDiameter- diameter of thumb in pixelscornerRadius- track corner radiusthumbCornerRadius- thumb corner radiusshouldFillOnPush- track border width is animated and fills inside of the track completely when switch is pressed if truetrackInset- track inset from the outer control frame. Usable if thumb is bigger than trackthumbShadowColor- thumb shadow color. Alpha value can be used to change shadow opacityshadowStrength- overall strength of thumb shadowthumbDelta- how much thumb grows when touhes begin. Setting to0will disable thumb growing/shrinking
Issues
Values set with the PWSwitch.appearance() override @IBInspectable values set it the Interface Builder attributes inspector.
Example
To run the example project, clone the repo, and run pod install from the Example directory first.
Requirements
- iOS 8.3+
- Xcode 8.0+
- Swift 3.0+
Please use release 1.0.0 for the final Swift 2.x supported version.
Installation
PWSwitch is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod "PWSwitch"Author
Nikita Shanin, [email protected]
License
PWSwitch is available under the MIT license. See the LICENSE file for more info.
