/Punchcard

A punchcard UIView subclass written in Swift.

Primary LanguageSwiftMIT LicenseMIT

punchcard logo

Swift4 Platform Version License

Description

Punchcard is a customizable punchcard view written in Swift that can be used to display a measure of progression through a series of actions.

Example

In this screenshot the user has achieved 2 out of 5 punches, and the images used are the StockX logo.

Contents

  1. Features
  2. Installation
  3. Supported OS & SDK versions
  4. Usage
  5. License
  6. Contact

Features

  • Supports AutoLayout.
  • Applies a random transform (translation and rotation) to the punches to simulate a real-life stamp.
  • Supports any number of punches as long as they fit within the bounds of the view.
  • Supports customizing background images of all punches.
  • Supports being created either in code or a Storyboard.

Installation

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 Punchcard into your Xcode project using CocoaPods, specify it in your Podfile:

pod 'Punchcard'

(for Swift 3, use pod 'Punchcard', '~> 0.4' instead)

Then, run the following command:

$ pod install

In case Xcode complains ("Cannot load underlying module for Punchcard") go to Product and choose Clean (or simply press ⇧⌘K).

Manually

If you prefer not to use CocoaPods, you can integrate Punchcard into your project manually.

Supported OS & SDK Versions

  • Supported build target - iOS 8.2+ (Xcode 7.3+)

Usage

Punchcard is state based. To configure the view, simply update the state value with whatever values you'd like, and re-set the state:

  1. First you should set up the Punchcard:
var punchcardView = PunchcardView()

var state = punchcardView.state
state.backgroundColor = UIColor(patternImage: UIImage(named: "Punchcard-Background-Pattern")!)
state.borderColor = .lightGray
state.emptyPunchImage = UIImage(named: "X-Stamp-Empty")
state.filledPunchImage = UIImage(named: "X-Stamp-Fill")
state.punchesRequired = 5
state.punchNumberColor = .black
state.punchNumberFont = .systemFont(ofSize: 14)
state.rewardTextFont = .systemFont(ofSize: 11)
state.rewardText = "FREE SHIPPING"
state.rewardTextColor = .gray
state.rewardFillColor = .green
        
punchcardView.state = state
  1. In order to set the punches received, modify the state object:
var state = punchcardView.state
state.punchesReceived = 2
punchcardView.state = state

License

Punchcard is developed by Josh Sklar at StockX and is released under the MIT license. See the LICENSE file for details.

Contact

You can follow or drop me a line on my Twitter account. If you find any issues on the project, you can open a ticket. Pull requests are also welcome.