TKFormTextField 0.3.1

TKFormTextField 0.3.1

测试已测试
语言 SwiftSwift
许可证 MIT
发布最后发布2018年10月
SPM支持 SPM

Thongchai Kolyutsakul 维护。



  • Thongchai Kolyutsakul

TKFormTextField

Build Status

Demo

一个 UITextField 子类

  • 在文本输入时内置 UILabel 以显示错误消息
  • 文本输入时悬浮提示词
  • 具有下划线
  • 可以自定义浮动提示词的未选择/选择颜色
  • 可以自定义未选择/选择颜色和粗细的下划线

系统要求

  • iOS 8.0 或更高版本
  • Swift 4.2 -> 最新版
  • Swift 4.0 -> 0.2.0
  • Swift 3.0 -> 0.1.6

示例

class ViewController: UIViewController {
  
  @IBOutlet weak var emailTextField: TKFormTextField!

  override func viewDidLoad() {
    super.viewDidLoad()

    // normal UITextField properties
    self.emailTextField.placeholder = "Email"
    self.emailTextField.enablesReturnKeyAutomatically = true
    self.emailTextField.returnKeyType = .next
    self.emailTextField.clearButtonMode = .whileEditing
    self.emailTextField.placeholderFont = UIFont.systemFont(ofSize: 18)
    self.emailTextField.font = UIFont.systemFont(ofSize: 18)

    // floating placeholder title
    self.emailTextField.titleLabel.font = UIFont.systemFont(ofSize: 18)
    self.emailTextField.titleColor = UIColor.lightGray
    self.emailTextField.selectedTitleColor = UIColor.gray

    // underline
    self.emailTextField.lineColor = UIColor.gray
    self.emailTextField.selectedLineColor = UIColor.black
    
    // bottom error label
    self.emailTextField.errorLabel.font = UIFont.systemFont(ofSize: 18)
    self.emailTextField.errorColor = UIColor.red // this color is also used for the underline on error state

    // update error message
    // NOTE: Ideally you should show error on .editingDidEnd, and attempt to hide it on .editingChanged.
    // See TKFormTextFieldDemo.xcodeproj on how I design the validation flow.
    self.emailTextField.addTarget(self, action: #selector(updateError), for: .editingChanged)
  }

  func updateError(textField: TKFormTextField) {
    guard let text = textField.text, !text.isEmpty else {
      textField.error = "Text is empty!" // to show error message in errorLabel
      return
    }
    textField.error = nil // to remove the error message
  }
}

安装

TKFormTextField 可通过 CocoaPods 和 Carthage 获得。

CocoaPods,将以下内容添加到 Podfile 中

pod "TKFormTextField"

注意:要运行示例项目,请克隆仓库,然后从 Example 目录中首先运行 pod install

Carthage

github "hlung/TKFormTextField"

故事

对于文本输入表单来说,使用警告来显示错误信息过于侵入性,使用户丢失了错误的上下文,并且需要额外点击来关闭。而且每次只能显示一个。我认为TKFormTextField是文本输入表单UI的解决方案。

注意,我没有使用IBInspectable / IBDesignable,因为这个感觉比较慢且容易出错。此外,因为通常你的应用中有多个文本字段,我觉得在代码中进行更易定制的操作要好一些。

这灵感来源于https://github.com/Skyscanner/SkyFloatingLabelTextField

许可

TKFormTextField遵循MIT许可。有关更多信息,请参阅LICENSE文件。