CreditCardForm
CreditCardForm 是一个 iOS 框架,允许开发者创建一个与实际信用卡相仿的 UI。
修正了拼写错误,使用 CreditCardForm 而不是 CreditCardForum
截图
示例
要运行示例项目,首先克隆仓库,然后从 Demo-* 目录中运行 pod install
。
支持卡片
- 万事达卡
- 维萨卡
- JCB卡
- 大都会卡
- 发现卡
- 美国运通卡
- 银联卡
需求
- Xcode 8
- iOS 8.1+
安装
CocoaPods
使用CreditCardForm 可通过 CocoaPods 获得。要安装它,只需在您的 Podfile
中添加以下行。
pod "CreditCardForm"
Carthage
使用CreditCardForm 通过 Carthage 提供。要安装它,只需在您的 Cartfile
中添加以下行
github "orazz/CreditCardForm-iOS"
手动
如果您不希望使用上述任何依赖管理器,可以手动将CreditCardForm集成到您的项目中。
- 下载并将
CreditCardForm
文件放入您的项目目录中。 - 完成!
使用示例
第一步:此框架集成了Stripe,您必须安装Stripe
Storyboard
创建一个视图,设置类名为CreditCardFormView(推荐帧大小:300x200)。
完成这一步后,您需要按照下面列出的简单步骤操作,才能让所有功能正常运行。
import Stripe
import CreditCardForm
Swift
@IBOutlet weak var creditCardForm: CreditCardFormView!
// Stripe textField
let paymentTextField = STPPaymentCardTextField()
在您的viewController的viewDidLoad函数中添加以下代码
// Set up stripe textfield
paymentTextField.frame = CGRect(x: 15, y: 199, width: self.view.frame.size.width - 30, height: 44)
paymentTextField.translatesAutoresizingMaskIntoConstraints = false
paymentTextField.borderWidth = 0
let border = CALayer()
let width = CGFloat(1.0)
border.borderColor = UIColor.darkGray.cgColor
border.frame = CGRect(x: 0, y: paymentTextField.frame.size.height - width, width: paymentTextField.frame.size.width, height: paymentTextField.frame.size.height)
border.borderWidth = width
paymentTextField.layer.addSublayer(border)
paymentTextField.layer.masksToBounds = true
view.addSubview(paymentTextField)
NSLayoutConstraint.activate([
paymentTextField.topAnchor.constraint(equalTo: creditCardForm.bottomAnchor, constant: 20),
paymentTextField.centerXAnchor.constraint(equalTo: view.centerXAnchor),
paymentTextField.widthAnchor.constraint(equalToConstant: self.view.frame.size.width-20),
paymentTextField.heightAnchor.constraint(equalToConstant: 44)
])
委托方法
为了使用委托方法,首先在设置时将Stripe的委托设置到父视图控制器中
paymentTextField.delegate = self
之后,您可以在父视图控制器内设置以下委托方法
func paymentCardTextFieldDidChange(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidChange(cardNumber: textField.cardNumber, expirationYear: textField.expirationYear, expirationMonth: textField.expirationMonth, cvc: textField.cvc)
}
func paymentCardTextFieldDidEndEditingExpiration(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidEndEditingExpiration(expirationYear: textField.expirationYear)
}
func paymentCardTextFieldDidBeginEditingCVC(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidBeginEditingCVC()
}
func paymentCardTextFieldDidEndEditingCVC(_ textField: STPPaymentCardTextField) {
creditCardForm.paymentCardTextFieldDidEndEditingCVC()
}
现在您已经准备好使用CreditCardForm了!!
自定义
1) 颜色
creditCardForm.backgroundColor (UIColor)
creditCardForm.cardHolderExpireDateColor (UIColor)
creditCardForm.cardHolderExpireDateTextColor (UIColor)
creditCardForm.backLineColor (UIColor)
// Brands Color brand name, front color, back color
[String: [UIColor]]
creditCardForm.cardGradientColors[Brands.Visa.rawValue] = [UIColor.blue, UIColor.red]
~~creditCardForm.colors[Brands.Visa.rawValue] = [UIColor.black, UIColor.black]~~
...
~~creditCardForm.colors[Brands.MasterCard.rawValue] = [UIColor.black, UIColor.black]~~
// Set font
creditCardForm.cardNumberFont = UIFont(name: "FontName", size: 20)!
creditCardForm.cardPlaceholdersFont = UIFont(name: "FontName", size: 10)!
creditCardForm.cardTextFont = UIFont(name: "FontName", size: 12)!
2) 图片
creditCardForm.chipImage (UIImage)
3) 占位符
creditCardForm.cardHolderString (String)
creditCardForm.expireDatePlaceholderText (String)
卡号: 配置掩码字段
creditCardForm.cardNumberMaskExpression (String)
creditCardForm.cardNumberMaskTemplate (String)
creditCardForm.cardNumberFontSize (CGFloat)
贡献
我们非常希望您为 CreditCardForm 贡献,更多详细信息请检查 LICENSE
文件。
元
第三方库
CreditCardValidator
AKMaskField
许可证
CreditCardForm 在MIT许可证下可用。更多详情请参阅LICENSE文件。