Skip to content
This repository has been archived by the owner on Dec 21, 2023. It is now read-only.

stockx/PinEntryView

Repository files navigation

PinEntryView Logo

Swift5.0 Platform Version License

Description

PinEntryView is a customizable view written in Swift that can be used to confirm alphanumeric pins. Use cases include typing ACCEPT after reviewing Terms of Service and setting or confirming a passcode.

borders

Contents

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

Features

  • Supports AutoLayout and has intrinsic size. Optionally set a height to make the boxes taller or a width to add more inner spacing between boxes.
  • Fully configurable in Interface Builder (supports @IBDesignable and @IBInspectable) and code.
  • Customizable for many different use cases.
  • Example app to demonstrate the various configurations.

screen shot 2018-02-19 at 4 23 30 pm

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

pod 'PinEntryView'

Legacy Support:

  • For Swift 3.1, use pod 'PinEntryView', '~> 1.0.0' instead
  • For Swift 4, use pod 'PinEntryView', '~> 4.0.0' instead

Then, run the following command:

$ pod install

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

Manually

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

  • Supported build target - iOS 8.0+ (Xcode 8.3.2+)

PinEntryView 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 PinEntryView and provide an initial state:
var pinEntryView = PinEntryView()
pinEntryView.state = PinEntryView.State(pin: "ACCEPT",
                                        allowsBackspace: true,
                                        showsPlaceholder: true,
                                        placeholderTextColor: .lightGray,
                                        allowsAllCharacters: false,
                                        focusBorderColor: .black,
                                        inactiveBorderColor: .lightGray,
                                        completedBorderColor: .green,
                                        errorBorderColor: .red,
                                        returnKeyType: .done,
                                        buttonBorderStyle: .full)
  1. Once set, you can optionally adjust individual parameters in the state:

Reassigning one var can be done in line:

pinEntryView.state?.returnKeyType = .next

or

Group up reassigning multiple vars that way only one update (PinEntryView.update()) cycle is made:

var state = pinEntryView.state
state?.completedBorderColor = .clear
state?.showsPlaceholder = false
pinEntryView.state = state

PinEntryView is developed by Jeff Burt at StockX and is released under the MIT license. See the LICENSE file for details.

Feel free to follow me on my personal Twitter account. If you find any problems with the project or have ideas to enhance it, feel free to open a GitHub issue and/or create a pull request.