Latest 0.1.0
License MIT
Platforms ios 8.0, requires ARC
Frameworks UIKit

Color Masking Button


Create a Masking Button

Color Masking Button uses a CGPath as its mask. You can create a CGPath from a SVG file with PocketSVG. Color Masking Button adjusts its frame to the size of the mask’s path. To create different sized buttons, initiate with different sized paths.

// Create path
let myPath = PocketSVG.pathFromSVGFileNamed("mySVGFile").takeUnretainedValue()

// Set the origin of the frame, and Color Masking Button will adjust its frame
let myColorMaskingButton = ColorMaskingButton(origin: myOrigin, withPath: myPath, withDirection: .LeftToRight, withForegroundColor: color1, withBackgroundColor: color2)


enum MaskingDirection {
    case LeftToRight
    case RightToLeft
    case TopToBottom
    case BottomToTop

Defines the possible directions of the masking effect.


var direction: MaskingDirection

Returns direction of the color mask. (read-only)

var path: CGPath

Returns the path of the color mask. (read-only)


init(origin: CGPoint, withPath path: CGPath, withDirection direction: MaskingDirection, withForegroundColor foregroundColor: UIColor, withBackgroundColor backgroundColor: UIColor)

Basic instantiation with a CGPath of the mask. Foreground color denotes the initial color inside the mask. Note that Color Masking Button will readjust its frame size to fit the given CGPath.

func addTarget(target: AnyObject?, action: Selector, forControlEvents controlEvents: UIControlEvents)

Add target to a selector. Color Masking Button is a subclass of UIButton.

func updateColorOffset(targetFrame: CGRect)

Updates the mask’s offset according to the target view’s frame. Note that both the Color Masking Button and the target view must be in the same superview.

func change(foregroundColor: UIColor?, andBackgroundColor backgroundColor: UIColor?)

Change the color of either the foreground or the background.

func resetColorMask()

Force a reset the color mask.

func setMaskWithPath(path: CGPath)

Change the color mask while preseving color and offset.


To run the example project, clone the repo, and run pod install from the Example directory first.


  • Swift 2.0+
  • iOS 8.0+


ColorMaskingButton is available through CocoaPods. To install
it, simply add the following line to your Podfile:

pod "ColorMaskingButton"


Lawrence Tran


See the LICENSE file for more info.

Latest podspec

    "name": "ColorMaskingButton",
    "version": "0.1.0",
    "summary": "A color masking effect for UIButton.",
    "description": "Dynamically pan the color of a button to the offset of another view's frame.",
    "homepage": "",
    "license": "MIT",
    "authors": {
        "Lawrence Tran": "[email protected]"
    "source": {
        "git": "",
        "tag": "0.1.0"
    "platforms": {
        "ios": "8.0"
    "requires_arc": true,
    "source_files": "Pod/Classes/**/*",
    "resource_bundles": {
        "ColorMaskingButton": [
    "frameworks": "UIKit"

Pin It on Pinterest

Share This