Question

我试图设置一个带有圆角但只有左上角和右上角以及彩色边框的视图。这是我的意见课：

class PullUpOverview: UIVisualEffectView {

override init(effect: UIVisualEffect?) {
    super.init(effect: effect)

    let maskLayer = CAShapeLayer()
    maskLayer.path = UIBezierPath(roundedRect: bounds,
                                  byRoundingCorners: [.topRight, .topLeft],
                                  cornerRadii: CGSize(width: 25, height: 25)).cgPath
    layer.mask = maskLayer

    let borderLayer = CAShapeLayer()
    borderLayer.frame = bounds
    borderLayer.path = maskLayer.path
    borderLayer.lineWidth = 1
    borderLayer.strokeColor = UIColor.gray.cgColor
    borderLayer.fillColor = UIColor.clear.cgColor
    layer.addSublayer(borderLayer)
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}
}

我以如下方式（viewDidLoad设置正确）在overviewRect方法中将视图添加到viewController视图中：

let overview = PullUpOverview(effect: UIBlurEffect(style: UIBlurEffect.Style.extraLight))
overview.frame = overviewRect
self.mapView.addSubview(overview)

但是，如果我添加视图，则什么也不会出现。如果我将PullUpOverview的超类更改为UIView并在viewDidLoad方法中将我的代码更改为跟随该视图，并且正确添加并应用了其蒙版（显然缺少模糊效果，这就是为什么我尝试与UIVisualEffectView）相同：

let overview = PullUpOverview(frame: overviewRect)
self.mapView.addSubview(overview)

那么我需要做些什么，以使我得到一个带有两个圆角（两个顶角）和一个边框层的UIVisualEffectView？

Answer 1

对于size，zero是bounds，因此两个图层都不可见。您可以按如下方式引入自定义初始化程序，

class PullUpOverview: UIVisualEffectView {

    init(effect: UIVisualEffect?, size: CGSize) {
        super.init(effect: effect)

        let rect = CGRect(origin: .zero, size: size)

        let maskLayer = CAShapeLayer()
        maskLayer.path = UIBezierPath(roundedRect: rect,
                                      byRoundingCorners: [.topRight, .topLeft],
                                      cornerRadii: CGSize(width: 25, height: 25)).cgPath
        maskLayer.frame = rect
        layer.mask = maskLayer

        let borderLayer = CAShapeLayer()
        borderLayer.frame = rect
        borderLayer.path = maskLayer.path
        borderLayer.lineWidth = 1
        borderLayer.strokeColor = UIColor.yellow.cgColor
        borderLayer.fillColor = UIColor.clear.cgColor
        layer.addSublayer(borderLayer)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

现在您可以初始化view并将其添加为

let overviewRect = CGRect(origin: CGPoint(x: 100, y: 200), size: CGSize(width: 200, height: 200))
let overview = PullUpOverview(effect: UIBlurEffect(style: .dark), size: overviewRect.size)
overview.frame = overviewRect
self.view.addSubview(overview)

这将导致以下情况，

Swift：具有圆形顶部边缘和彩色边框的UIVisualEffectView

1 个答案: