为UITextField应用圆角边框和阴影无效。

Question

我想实现以下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：如果我注释掉前两行，则会得到带有阴影效果的textField，但边框不是圆角的，边框变为默认的圆角边框。

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

我该如何解决这个问题？

- Bharath

---

你在哪里调用了你的customize()方法？ - Mike Qiu

我怀疑你无法仅通过使用 UITextField 来获得这种外观。更可能的是，您需要创建一个 UIView 子类来设置边框、圆角和阴影，并具有 UITextField 子视图。 - DonMag

@Magnas：我也试了，但没有圆角 :-( - Bharath

@DonMag：是的，我也考虑过这个问题。但我的情况是，在大多数屏幕中我都使用了textField，所以我想我可能会有任何想法来通过textField本身完成它 :-(。我想你明白我的情况吧 :-)。 - Bharath

@MikeQiu：实际上，这里不适用super.customize()，我的实际代码有另一个常见的基类，但是有一个虚拟的customize方法，我已经将其删除。你是否也得到了圆角边框和阴影效果？太棒了，请在答案部分分享代码，我想看看我错过了什么。 - Bharath

Answer 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
    }
}

这是我的模拟器截图：。

- Mike Qiu

---

这段代码运行良好，似乎需要在layoutSubviews()中应用阴影相关属性，我将进一步分析为什么会发生这种情况，谢谢。 - Bharath

@Bharath，不用谢，我把我的代码放在layoutSubviews()中，因为我需要使用bounds.height来确定cornerRadius，而layoutSubviews()是自动布局在后台实现的地方。 - Mike Qiu

如果高度是固定的，我认为你不需要在layoutSubviews()中放置这些阴影特定的代码。 - Mike Qiu

Answer 2

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

- Fayez Hellani

Answer 3

尝试在LayoutSubViews中调用这些方法。

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

- Himanshu