Nicely animated flat design switch alternative to UISwitch
Clone or download
cocoatoucher Merge pull request #15 from marcuswu/master
Improve accessibility by announcing changed values
Latest commit 2425e7a Sep 21, 2018

README.md

AIFlatSwitch

A smooth, nice looking and IBDesignable flat design switch for iOS. Can be used instead of UISwitch.

Inspired by Creativedash's Dribbble post here

Platform Language License








Requirements

  • iOS 8.0+
  • Xcode 8.0+ (Use pod version 0.0.4 for Xcode 7)
  • Swift 3.0+ (Use pod version 0.0.4 for Swift 2.3)

Installation

Embedded frameworks require a minimum deployment target of iOS 8.

To use with a project targeting iOS 7, you must include the AIFlatSwitch.swift source file directly in your project.

CocoaPods

CocoaPods is a dependency manager for Cocoa projects.

CocoaPods 0.36 adds supports for Swift and embedded frameworks. You can install it with the following command:

$ gem install cocoapods

To integrate AIFlatSwitch into your Xcode project using CocoaPods, specify it in your Podfile:

source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '8.0'
use_frameworks!

pod 'AIFlatSwitch', '~> 1.0.1'

Then, run the following command:

$ pod install

Manually

  1. Download and drop AIFlatSwitch.swift in your project.
  2. Congratulations!

Usage

Creating the flat switch

  • Either programmatically
var flatSwitch = AIFlatSwitch(frame: CGRectMake(0, 0, 50, 50))
  • Or in Interface Builder

Methods

To change its selected state:

flatSwitch.selected = true
  • IBInspectable

or:

flatSwitch.setSelected(true, animated: true)

To listen to its state changes:

@IBAction func handleSwitchValueChange(sender: AnyObject) {
		if let flatSwitch = sender as? AIFlatSwitch {
			println(flatSwitch.selected)
		}
	}

Styling the switch:

flatSwitch.lineWidth = 2.0
flatSwitch.strokeColor = UIColor.blueColor()
flatSwitch.trailStrokeColor = UIColor.redColor()
flatSwitch.animatesOnTouch = false
  • IBInspectable

License

AIFlatSwitch is released under the MIT license. See LICENSE for details.

animated check button, checkmark