如何在不使用CAShapeLayer的情况下让UIBezierPath线条置于CAShapeLayer圆形上方?
问题原因
UIView的渲染顺序是固定的:先绘制自身的内容层(也就是drawRect方法里绘制的所有内容),再依次渲染所有子图层(包括你添加的CAShapeLayer圆形)。所以不管你在drawRect里先调用添加圆形图层的方法还是后画线,drawRect里的线条都会被CAShapeLayer的圆形盖住。
解决方案
不用额外CAShapeLayer承载线条的话,有两种可行方式:
方式一:调整圆形CAShapeLayer的层级
让圆形图层处于内容层的下方,这样drawRect里的线条就能显示在上面:
- 设置圆形图层的
zPosition为负数,强制它下沉到内容层之下:circleLayer.zPosition = -1 - 或者在添加图层时,直接把它插入到子图层数组的最底部:
self.layer.insertSublayer(circleLayer, at: 0)
方式二:放弃CAShapeLayer,全在drawRect里绘制
把圆形也改成用UIBezierPath在drawRect里绘制,按照先圆后线的顺序,线条自然会覆盖在圆形上方:
override func draw(_ rect: CGRect) { // 绘制圆形 let circlePath = UIBezierPath(ovalIn: CGRect(x: 50, y: 50, width: 100, height: 100)) UIColor.lightGray.setFill() circlePath.fill() // 绘制线条 let linePath = UIBezierPath() linePath.move(to: CGPoint(x: 30, y: 100)) linePath.addLine(to: CGPoint(x: 170, y: 100)) UIColor.black.setStroke() linePath.lineWidth = 2 linePath.stroke() }
内容的提问来源于stack exchange,提问作者iOS
相关产品推荐
相关产品推荐

