带有阴影和圆角边缘的容器视图

Question

我想创建一个带有阴影和圆角边缘的自定义ContainerView。这个ContainerView是一个小矩形，放置在另一个UIView的顶部。在这种特殊情况下，既不能使用额外的层，也不能使用CoreGraphics绘制阴影。

- Hubert Zajączkowski

---

你为什么认为添加额外的视图/层不会有帮助？你的问题是在将cornerRadius应用于containerView后看不到阴影吗？ - alexburtnik

每次我添加额外的视图/层时，阴影就会出现，并且边缘会变圆，但是我无法摆脱这个“白色”区域。 - Hubert Zajączkowski

你应该发布你的代码以便得到帮助。 - alexburtnik

你有尝试设置 containerView.layer.masksToBounds = true 吗？ - Nathan Hitchings

Answer 1

你的看法是错误的，额外的视图/层会有帮助。

你可以将带有圆角的roundedContainer放入另一个带阴影的shadowedView中。为了避免出现白色边角，请确保在某个地方设置背景颜色为clear。

例如：

//superview for container with rounded corners
shadowedView.backgroundColor = UIColor.clear //this will fix your white corners issue
shadowedView.layer.shadowColor = UIColor.black.cgColor
shadowedView.layer.shadowOffset = .zero
shadowedView.layer.shadowOpacity = 0.3
shadowedView.layer.shadowRadius = 5.0

//add a container with rounded corners
let roundedView = UIView()
roundedView.frame = baseView.bounds
roundedView.layer.cornerRadius = 10
roundedView.layer.masksToBounds = true
shadowedView.addSubview(roundedView)

- alexburtnik

Answer 2

我找到了一个合适的解决方案。我将阴影投射到每个 UIView 内部的超类 ContainerView 中。然后，我使用 UIViewController 类为这个小矩形区域设置了圆角边缘。

class GraphViewController: UIViewController {
    @IBOutlet var graphView: GraphViewRenderer!

    override func viewDidLoad() {
        graphView.layer.cornerRadius = 20.0
        graphView.layer.masksToBounds = true

        super.viewDidLoad()
    }
}

class GraphContainerView: UIView {
    func applyPlainShadow() {
        layer.shadowColor = UIColor.black.cgColor
        layer.shadowOffset = CGSize.zero
        layer.shadowRadius = 5.0
        layer.shadowOpacity = 0.7
    }

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

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

- Hubert Zajączkowski

---

它不是一个超级类，而是一个超级视图。两者并不相同。你的答案基本上就是我所建议的。 - alexburtnik

感谢 @alexburtnik 的帮助。 - Hubert Zajączkowski