huangwenfei / colorslider

🎨 Snapchat-style color picker in Swift

---

ColorSlider is an iOS color picker with live preview written in Swift.

	Features
👻	"Snapchat-style" color picker
🌈	Extensible live preview
🎨	Customizable appearance
🌀	Vertical and horizontal support
🎹	Black and white colors included
📚	Fully documented
🐤	Swift 5

Usage

Create and add a ColorSlider to your view:

let colorSlider = ColorSlider(orientation: .vertical, previewSide: .left)
colorSlider.frame = CGRect(x: 0, y: 0, width: 12, height: 150)
view.addSubview(colorSlider)

Respond to changes in color using UIControlEvents:

colorSlider.addTarget(self, action: #selector(changedColor(_:)), forControlEvents: .valueChanged)

func changedColor(_ slider: ColorSlider) {
    var color = slider.color
    // ...
}

Customize appearance attributes:

// Add a border
colorSlider.gradientView.layer.borderWidth = 2.0
colorSlider.gradientView.layer.borderColor = UIColor.white.cgColor

// Disable rounded corners
colorSlider.gradientView.automaticallyAdjustsCornerRadius = false

Preview

ColorSlider has a live preview that tracks touches along it. You can customize it:

let previewView = ColorSlider.DefaultPreviewView()
previewView.side = .right
previewView.animationDuration = 0.2
previewView.offsetAmount = 50

let colorSlider = ColorSlider(orientation: .vertical, previewView: previewView)

Create your own live preview by subclassing DefaultPreviewView or implementing ColorSliderPreviewing in your UIView subclass. Then, just pass your preview instance to the initializer:

let customPreviewView = MyCustomPreviewView()
let colorSlider = ColorSlider(orientation: .vertical, previewView: customPreviewView)

ColorSlider will automatically update your view's center as touches move on the slider. By default, it'll also resize your preview automatically. Set colorSlider.autoresizesSubviews to false to disable autoresizing.

To disable the preview, simply pass nil to ColorSlider's initializer:

let colorSlider = ColorSlider(orientation: .vertical, previewView: nil)

See the documentation for more details on custom previews.

Documentation

ColorSlider is fully documented here.

Installation

CocoaPods

platform :ios, '9.0'
pod 'ColorSlider', '~> 4.4'

Carthage

github "gizmosachin/ColorSlider" >= 4.4

Version Compatibility

Swift Version	ColorSlider Version
5.0	master
4.2	4.3

Demo

Please see the Demo directory for a basic iOS project that uses ColorSlider.

Contributing

ColorSlider is a community - contributions and discussions are welcome!

Please read the contributing guidelines prior to submitting a Pull Request.

License

ColorSlider is available under the MIT license, see the LICENSE file for more information.