如何在编辑时更改uitextfield leftView image tintColor

时间:2018-10-17 21:00:25

标签: ios swift uitextfield

我正在尝试实现UITextField的编辑或不编辑这样的样式:

enter image description here

但是对我来说,最棘手的部分是如何更改左侧图像色调的颜色。 到目前为止,我已经做到了:

enter image description here

我的代码:

UITextField

lazy var email: UITextField = {
    let name = UITextField()
    name.layer.cornerRadius = 17.5
    name.layer.borderColor = UIColor(red: 0.55, green: 0.61, blue: 0.69, alpha: 0.5).cgColor
    name.layer.borderWidth = 1.5
    name.placeholder = "Email"
    name.font = UIFont.systemFont(ofSize: 15)
    name.textColor = UIColor(red: 0.55, green: 0.61, blue: 0.69, alpha: 1)
    name.backgroundColor = .clear
    name.leftViewMode = UITextFieldViewMode.always
    name.delegate = self
    name.translatesAutoresizingMaskIntoConstraints = false
    return name
}()

leftImage函数:

func addLeftImageTo(txtField: UITextField, andImage img: UIImage) {

    let leftView = UIView(frame: CGRect(x: 0, y: 0, width: 42.75, height: 40))
    let centerX: CGFloat = (leftView.frame.midX) - (img.size.width / 2)
    let centerY: CGFloat = (leftView.frame.midY) - (img.size.height / 2)
    let leftImageView = UIImageView(frame: CGRect(x: centerX + 2 , y: centerY - 1, width: img.size.width, height: img.size.height))
    leftImageView.contentMode = .scaleAspectFit
    leftImageView.image = img
    leftView.addSubview(leftImageView)
    txtField.leftView = leftView
    txtField.leftViewMode = .always
}

添加leftImages:

let emailLeftImg = UIImage(named: "ic_txt_field_email")
addLeftImageTo(txtField: email, andImage: emailLeftImg!)

let passwordLeftImg = UIImage(named: "ic_txt_field_password")
addLeftImageTo(txtField: password, andImage: passwordLeftImg!)

editingBugains and End:

func textFieldDidBeginEditing(_ textField: UITextField) {
    self.setTextBorder(textField: textField, color: UIColor.white, borderColor: UIColor.white, isSelected: true)

}

func textFieldDidEndEditing(_ textField: UITextField) {
    self.setTextBorder(textField: textField, color: UIColor.clear, borderColor: UIColor(red: 0.55, green: 0.61, blue: 0.69, alpha: 0.5),  isSelected: false)
}


func setTextBorder(textField: UITextField, color: UIColor, borderColor: UIColor, isSelected: Bool) {
    textField.backgroundColor = color
    textField.layer.borderColor = borderColor.cgColor
    textField.tintColor = UIColor(red: 1.0, green: 0.2, blue: 0.33, alpha: 1)
    textField.layer.masksToBounds = false

    if isSelected == true {
        textField.layer.shadowRadius = 3.0
        textField.layer.shadowColor = UIColor.black.cgColor
        textField.layer.shadowOffset = CGSize(width: 0, height: 2)
        textField.layer.shadowOpacity = 0.125
    } else {
        textField.layer.shadowRadius = 0
        textField.layer.shadowColor = UIColor.clear.cgColor
        textField.layer.shadowOffset = CGSize(width: 0, height: 0)
        textField.layer.shadowOpacity = 0
    }

}

我曾尝试添加此代码来更改图片颜色,但没有用。

var picTintColor: Bool = false 

在LeftImage函数中:

if picTintColor == true {
        leftImageView.image = img.withRenderingMode(.alwaysTemplate)
        leftImageView.tintColor = .blue
    } else {
        leftImageView.image = img
    }

在编辑“大笑话”和“结尾功能”中:

if isSelected == true {
        picTintColor = true
    } else {
        picTintColor = false
    }

我在IOS编程中是一个完全的菜鸟,因此感谢您的耐心配合和英语不好。谢谢!

1 个答案:

答案 0 :(得分:0)

根据代码,它实际上无法将 isSelected 信号传递给 leftImageView ,也许 leftImageView 获得的不是最早的,或者信号未成功通过。 我建议一种简单的方法,只需在 editingBegains and Ending:中完成您想要更改的图像视图,就像这样:

func textFieldDidBeginEditing(_ textField: UITextField) {
     let emailLeftImg = UIImage(named: "ic_txt_field_email")
     addLeftImageTo(txtField: email, andImage: emailLeftImg!)
}

func addLeftImageTo(txtField: UITextField, andImage img: UIImage) {

let leftView = UIView(frame: CGRect(x: 0, y: 0, width: 42.75, height: 40))
let centerX: CGFloat = (leftView.frame.midX) - (img.size.width / 2)
let centerY: CGFloat = (leftView.frame.midY) - (img.size.height / 2)
let leftImageView = UIImageView(frame: CGRect(x: centerX + 2 , y: centerY - 1, width: img.size.width, height: img.size.height))
leftImageView.contentMode = .scaleAspectFit
if picTintColor == true {
    leftImageView.image = img.withRenderingMode(.alwaysTemplate)
    leftImageView.tintColor = .blue
} else {
    leftImageView.image = img
}
leftView.addSubview(leftImageView)
txtField.leftView = leftView
txtField.leftViewMode = .always

} 最后使用delgate方法,只需执行此操作,您就可以尝试这种方式进行测试。希望能为您提供帮助。