应用圆角边框和阴影不适用于 UITextField答案

【问题标题】：Apply rounded border as well as shadow doesn't work for UITextField应用圆角边框和阴影不适用于 UITextField
【发布时间】：2017-10-20 12:37:49
【问题描述】：

我想实现如下UI

这是我的代码

class RoundTextField: UITextField {

    override init(frame: CGRect) {
        super.init(frame: frame)
        customize()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        customize()
    }

    func customize() {
        apply(shadow: true)
    }

    func apply(shadow: Bool) {
        if shadow {
            borderStyle = .none
            layer.cornerRadius = bounds.height / 2

            layer.borderWidth = 1.0
            layer.borderColor = UIColor.lightGray.cgColor
            layer.shadowColor = UIColor.black.cgColor
            layer.shadowOffset = CGSize(width: 0, height: 5.0)
            layer.shadowRadius = 2
            layer.masksToBounds = false
            layer.shadowOpacity = 1.0
        } else {

        }
    }
}

这是问题的详细信息，

案例 1：对于上面的代码，我得到一个没有任何边框或阴影的 textField，
案例 2：如果我注释前两行，我会得到边框不圆角的阴影效果，并且边框变为默认圆角边框。

borderStyle = .none
layer.cornerRadius = bounds.height / 2

我该如何解决这个问题？

【问题讨论】：

borderStyle = .none 你是在告诉你 textField 不显示边框。试试.line 或.bezel 或.roundedRect
你在哪里调用你的 customize() 方法？
我怀疑您是否会单独使用UITextField 获得这种外观。您更有可能需要创建一个 UIView 子类来设置边框、圆角和阴影，并具有一个 UITextField 子视图。
@Magnas：你也试过了，但没有圆角:-(
@MikeQiu：抱歉没有更新完整的代码，我已经更新了代码，希望你在那里得到答案。

标签： ios swift swift3 uitextfield

【解决方案1】：

尝试从 LayoutSubViews 调用这些方法。

override func layoutSubviews() {
        super.layoutSubviews()
        // Call here
    }

【讨论】：

【解决方案2】：

您应该将 layer.masksToBounds 设置为 true。

【讨论】：

【解决方案3】：

我无法重现您遇到的案例 1，因此我将发布似乎可以实现您想要的 UI 的代码。

class RoundTextField: UITextField {

    override func layoutSubviews() {
        super.layoutSubviews()
        borderStyle = .none
        layer.cornerRadius = bounds.height / 2
        layer.borderWidth = 1.0
        layer.borderColor = UIColor.init(colorLiteralRed: 241/256, green: 241/256, blue: 241/256, alpha: 1).cgColor
        layer.shadowColor = UIColor.lightGray.cgColor
        layer.shadowOffset = CGSize(width: 0, height: 1.0)
        layer.shadowRadius = 2
        layer.masksToBounds = false
        layer.shadowOpacity = 1.0
        // set backgroundColor in order to cover the shadow inside the bounds
        layer.backgroundColor = UIColor.white.cgColor
    }
}

这是我的模拟器的截图：

【讨论】：

这段代码运行良好，看来需要在 layoutSubviews() 中应用阴影相关属性，我会进一步分析为什么会出现这种情况，谢谢。
@Bharath，不客气，我将代码放在 layoutSubviews() 中，因为我需要使用 bounds.height 来确定cornerRadius，而 layoutSubviews() 是在屏幕后面实现自动布局的地方。
如果高度是固定的，我想你不需要把这些阴影特定的代码放在 layoutSubviews() 中。