bezierpath视图上的阴影将怪异的笔触添加到角落

Question

我想重新创建带有圆角和阴影的AppStore的“ today”卡。

我创建了一个路径，一个maskLayer和一个单独的shadowLayer，根据一些消息来源，这就是这样做的方式。

但是，问题是我可爱的带有阴影的圆角矩形在其拐角处出现了一些灰色笔触。我该如何解决？我尝试了不同的阴影不透明度和半径。它没有解决我的问题。

在这里您可以在下面看到我的屏幕截图和代码。

override func loadView() {
        let view = UIView()
        view.backgroundColor = .white
        self.view = view

        // create sample view and add to view hierarchy
        let bigTeaser = UIView(frame: CGRect(x: 16, y: 200, width: 343, height: 267))
        bigTeaser.backgroundColor = UIColor.white
        view.addSubview(bigTeaser)

        // create the path for the rounded corners and the shadow
        let roundPath = UIBezierPath(roundedRect: bigTeaser.bounds, cornerRadius: 20)

        // create maskLayer
        let maskLayer = CAShapeLayer()
        maskLayer.frame = bigTeaser.bounds
        maskLayer.path = roundPath.cgPath
        bigTeaser.layer.mask = maskLayer

        // create shadowLayer
        let shadowLayer = CAShapeLayer()
        shadowLayer.path = roundPath.cgPath
        shadowLayer.frame = bigTeaser.frame
        shadowLayer.shadowOpacity = 0.3
        shadowLayer.shadowRadius = 24
        shadowLayer.shadowColor = UIColor.black.cgColor
        shadowLayer.shadowOffset = CGSize(width: 0, height: 2)

        // insert layers
        bigTeaser.superview!.layer.insertSublayer(shadowLayer, below: bigTeaser.layer)

    }

Answer 1

如果您替换：

shadowLayer.path = roundPath.cgPath

到

shadowLayer.shadowPath = roundPath.cgPath

丑陋的边界将神奇地消失。