如何正确分组和最小化 UITextfields 的样式代码？

Question

我正在尝试严格基于 login/sign up 字段实现我的文本字段的标准通用样式。

所以，我将它们设计得完全相同，但我认为我正在重用大量可以压缩并可能在变量中使用的代码？我不知道该怎么做。

它的工作方式，但我相信它可以做得比这更好。我几乎可以肯定有一种方法可以最大限度地减少此代码以获得更好的练习。

我还在学习，所以我真的很想在开发中学习更好的实践。

这是我的注册视图和字段样式的示例：

class JoinVC: UIViewController, UITextFieldDelegate {`

    @IBOutlet weak var enterEmailTextField: UITextField!
    @IBOutlet weak var enterPasswordTextField: UITextField!
    @IBOutlet weak var enterNameTextField: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Field Border Corner + Width
        self.enterEmailTextField.layer.cornerRadius = 24.0
        self.enterEmailTextField.layer.borderWidth = 1.5
        self.enterPasswordTextField.layer.cornerRadius = 24.0
        self.enterPasswordTextField.layer.borderWidth = 1.5
        self.enterNameTextField.layer.cornerRadius = 24.0
        self.enterNameTextField.layer.borderWidth = 1.5
        // ...

        // Field Placeholder ColorEnter
        var placeholderEnterEmail = NSAttributedString(string: "Enter Email", attributes: [NSForegroundColorAttributeName : UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)])
        var placeholderEnterPass = NSAttributedString(string: "Choose Password", attributes: [NSForegroundColorAttributeName : UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)])
        var placeholderEnterName = NSAttributedString(string: "Choose Username", attributes: [NSForegroundColorAttributeName : UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)])

        enterEmailTextField.layer.sublayerTransform = CATransform3DMakeTranslation(20, 0, 0);
        enterPasswordTextField.layer.sublayerTransform = CATransform3DMakeTranslation(20, 0, 0);
        enterNameTextField.layer.sublayerTransform = CATransform3DMakeTranslation(20, 0, 0);
        // ...

        // Text Field Border color
        var borderColor : UIColor = UIColor( red: 255, green: 255, blue:255, alpha: 0.8 )
        self.enterPasswordTextField.layer.borderColor = borderColor.CGColor; enterEmailTextField.attributedPlaceholder = placeholderEnterEmail;
        self.enterEmailTextField.layer.borderColor = borderColor.CGColor; enterPasswordTextField.attributedPlaceholder = placeholderEnterPass;
        self.enterNameTextField.layer.borderColor = borderColor.CGColor; enterNameTextField.attributedPlaceholder = placeholderEnterName;
    // ...


    }
}

Answer 1

可以使用Extension functionality。只需创建 UITextField 的 Extension，然后将您的代码放入 Extension （简易教程here）

例如：

extension UITextField
{
    func setPlaceholderColorAndString(pholder: String, color: UIColor)
    {
        self.attributedPlaceholder = NSAttributedString(string:pholder,
            attributes:[NSForegroundColorAttributeName: color])
    }

    func setupField()
    {
        self.layer.cornerRadius = 24.0
        self.layer.borderWidth = 1.5
    }
}

然后在您的代码中您可以像这样使用它：

self.enterEmailTextField.setPlaceholderColorAndString(pholder: "Enter Email", color: UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)
self.enterEmailTextField.setupField()
self.enterPasswordTextField.setPlaceholderColorAndString(pholder: "Enter Password", color: UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)
self.enterPasswordTextField.setupField()

等等。当然，上面的代码片段只是为了让您了解如何使用它，您可以对其进行很多改进以满足您的需要。

Answer 2

可重用代码的简单解决方案是处理程序

  func setupTextField(textField : UITextField, placeHolderString: String)
  {
    let borderColor = UIColor( red: 1.0, green: 1.0, blue:1.0, alpha: 0.8 )
    textField.layer.cornerRadius = 24.0
    textField.layer.borderWidth = 1.5
    textField.layer.sublayerTransform = CATransform3DMakeTranslation(20, 0, 0);
    textField.layer.borderColor = borderColor.CGColor;
    textField.attributedPlaceholder = NSAttributedString(string: placeHolderString, attributes: [NSForegroundColorAttributeName : UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)])

  }

  override func viewDidLoad() {
    super.viewDidLoad()

    setupTextField(enterEmailTextField, placeHolderString: "Enter Email")
    setupTextField(enterPasswordTextField, placeHolderString: "Choose Password")
    setupTextField(enterNameTextField, placeHolderString: "Choose Username")
  }

注意：UIColor 值必须在 0.0 到 1.0 的范围内

Answer 3

我之前解决这个问题的方法，特别是如果项目中的所有文本字段都是：

总是会有相同的属性，
总是从情节提要中创建

是subclass UITextField并应用-awakeFromNib中的属性：

class KBTextField: UITextField {
    let myAttributes = [NSForegroundColorAttributeName : UIColor(red: 255/255, green: 255/255, blue:255/255, alpha: 0.6)]
    let mySublayerTransform = CATransform3DMakeTranslation(20, 0, 0)
    let myBorderColor = UIColor( red: 255, green: 255, blue:255, alpha: 0.8 )

    override func awakeFromNib () {
        self.layer.sublayerTransform = mySublayerTransform
        self.layer.borderColor = myBorderColor.CGColor
        self.layer.cornerRadius = 24.0
        self.layer.borderWidth = 1.5
        self.attributedPlaceholder = NSAttributedString(string: self.placeholder!, attributes: myAttributes)
    }
}

然后您只需在故事板上设置 class（在本例中为 KBTextField），它会自动处理您的所有属性。

这样，您可以确保应用中的所有 KBTextField 看起来都一样，只要您通过故事板创建它们即可。

如何正确分组和最小化 UITextfields 的样式代码？

How can I properly group and minimize style code for UITextfields?

xcode

cocoa-touch

uitextfield

ios

swift