PinFieldView 1.1.5

PinFieldView 1.1.5

×

由 Bas van Kuijck 管理。

PinFieldView 1.1.5

  • 由
  • Bas van Kuijck

PinFieldView

轻松输入 PIN 码

Platform CocoaPods Compatible Travis-ci

Screenshot

安装

CocoaPods

Podfile

pod 'PinFieldView'

然后

pod install

SwiftPM

将以下行添加到您的依赖中

.package(url: "https://github.com/e-sites/PinFieldView.git", .upToNextMajor(from: "1.0.0"))

实现

您可以将 PinFieldView 添加到 XIB 或 storyboard 中，或者以编程方式添加

import PinFieldView
import UIKit

let entryView = PinFieldView(frame: CGRect(x: 10, y: 10, width: 300, height: 64))
entryView.sizeBehavior = .fixedWidth(64) // This will make all the entries equal sized
entryView.digits = 5 // 5 digit pin code
entryView.viewType = EntryView.self // it must enherit from PinFieldViewable and UIView
view.addSubview(entryView)

创建自己的入口视图项

import UIKit

class EntryView: UILabel, PinFieldViewable {
	var digitValue: Int? {
        didSet {
            text = digitValue == nil ? nil : "*" // Place a * when the digit is entered
        }
    }

     convenience required init() {
        self.init(frame: CGRect.zero)
        layer.borderColor = UIColor.orange.cgColor
        backgroundColor = UIColor.darkGray
        textAlignment = .center
        textColor = UIColor.white
        font = UIFont.systemFont(ofSize: 30, weight: .semibold)
    }

    override public func becomeFirstResponder() -> Bool {
        layer.borderWidth = 2 // When the item is active, show the border
        return true
    }

    override public func resignFirstResponder() -> Bool {
        layer.borderWidth = 0 // When the item is inactive, hide the border
        return true
    }
}

变量

变量 类型 描述
value 字符串 （只读）返回类型化的邮政编码（例如 "12345"）
views [PinFieldUIView] （只读）当前输入项目视图，因此您可以按需使用它们
isFilled 布尔型 （只读）所有输入字段是否都已填写？
digits 整型 数字位数（默认：4，最小：1，最大：10）
sizeBehavior SizeBehavior 查看大小行为（默认：.spacing(10)
viewType PinFieldUIView.Type 查看视图类型（默认：DefaultEntryType.self)

函数

函数 描述
func clear() 清除所有输入字段

配置

大小行为

在数字视图的大小方面有两个选项

  1. 固定宽度 → SizeBehavior.fixedWidth(CGFloat)
  2. 固定间距 → SizeBehavior.spacing(CGFloat)

视图类型

这可能是这个类最重要的部分，视图类型将定义单个数字输入字段的外观。
创建一个新的类，该类扩展 UIView 并实现 PinFieldViewable 协议。

在该类中，有三个重要的事情需要您注意

高亮状态

becomeFirstResponder() 会在字段激活时被调用一次，下面的代码将在需要为该特定字段输入数字时，使视图的背景变为橙色。

override public func becomeFirstResponder() -> Bool {
    backgroundColor = UIColor.orange
    return true
}

脱落高亮状态

resignFirstResponder() 会在字段不再活跃时被调用一次，下面的代码将使视图的背景再次变成白色。

override public func resignFirstResponder() -> Bool {
    backgroundColor = UIColor.white
    return true
}

3. 当用户输入（或删除）数字时

这就是 PinFieldViewable 协议的作用所在，我们需要实现 var digitValue: Int?，这样这个视图就知道用户输入了哪个数字。在这个特定的例子中，一旦输入数字，背景将变为绿色，否则（默认）为白色。

var digitValue: Int? {
	didSet {
		backgroundColor = digitValue == nil ? UIColor.white : UIColor.green
	}
}

上面的代码将产生类似的效果

import Foundation
import UIKit
import PinFieldView

public class DigitEntryView: UIView, PinFieldViewable {

    public var digitValue: Int? {
        didSet {
            backgroundColor = digitValue == nil ? UIColor.white : UIColor.green
        }
    }

    override public func becomeFirstResponder() -> Bool {
        backgroundColor = UIColor.orange
        return true
    }

    override public func resignFirstResponder() -> Bool {
        backgroundColor = UIColor.white
        return true
    }
}