可以像这样制作 UITextField 吗？

Question

情况：我想在 xcode 项目中为我的文本字段使用自定义 UITextField class。我希望 textField 看起来像这样：

我在使边缘变圆和更改占位符颜色方面没有问题，但我不知道如何保持底部边缘平整并仅在底部绘制黑色边框。

这是我的代码：

import UIKit

class GrayTextField: UITextField {
    override func awakeFromNib() {
        super.awakeFromNib()
        backgroundColor = .grayf1f1f1
        layer.borderWidth = 1
        layer.borderColor = UIColor.black.cgColor
        layer.cornerRadius = 10
        clipsToBounds = true
    }

    override var placeholder: String? {
        didSet {
            let attributes = [ NSAttributedString.Key.foregroundColor: UIColor.black, NSAttributedString.Key.font : UIFont.systemFont(ofSize: 16, weight: .thin)]
            attributedPlaceholder = NSAttributedString(string: placeholder ?? "", attributes: attributes)
        }
    }
}

而我目前的结果：

Answer 1

好吧，经过一番研究，我做到了。如果我的最终代码在这里：

import UIKit

class GrayTextField: UITextField {
    override func awakeFromNib() {
        super.awakeFromNib()
        backgroundColor = .grayf1f1f1
        clipsToBounds = true

        let maskPath = UIBezierPath(roundedRect: self.bounds,
                                    byRoundingCorners: [.topLeft, .topRight],
                                    cornerRadii: CGSize(width: 10.0, height: 10.0))

        let shape = CAShapeLayer()
        shape.path = maskPath.cgPath
        layer.mask = shape

        addBottomBorder(with: .darkGray, andWidth: 1)
    }


    override var placeholder: String? {
        didSet {
            let attributes = [ NSAttributedString.Key.foregroundColor: UIColor.black, NSAttributedString.Key.font : UIFont.systemFont(ofSize: 16, weight: .thin)]
            attributedPlaceholder = NSAttributedString(string: placeholder ?? "", attributes: attributes)
        }
    }

    func addBottomBorder(with color: UIColor?, andWidth borderWidth: CGFloat) {
        let border = UIView()
        border.backgroundColor = color
        border.autoresizingMask = [.flexibleWidth, .flexibleTopMargin]
        border.frame = CGRect(x: 0, y: frame.size.height - borderWidth, width: frame.size.width, height: borderWidth)
        addSubview(border)
    }
}

这是结果：

Answer 2

在您的回答中，左下角和右下角仍然存在一些问题。

要获得准确的结果，请将 UITextField Border Style 更改为 No Border。

文本填充：

class GrayTextField: UITextField {

    let padding = UIEdgeInsets(top: 0, left: 15, bottom: 0, right: 5)

    ..... Your Exact Code .....

    override open func textRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: padding)
    }

    override open func placeholderRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: padding)
    }

    override open func editingRect(forBounds bounds: CGRect) -> CGRect {
        return bounds.inset(by: padding)
    }
}

OutPut

可以像这样制作 UITextField 吗？

Is possible make a UITextField like this?

xcode

uitextfield

swift