重绘时未清除 UIBezierPath
UIBezierPath not cleared on redraw
我有自定义 UIView
,我在其中绘制了 UIBezierPath。此视图用于 UITableViewCell。因此,当我滚动时,自定义视图的贝塞尔曲线路径会被重绘。问题是新路径覆盖了旧路径图(上下文未正确清除)。我在 table 单元格提取上调用 setNeedsDisplay()
,并且还为视图设置了 clearsContextBeforeDrawing = true
。清除旧绘图的唯一方法是调用 context.clear(rect)
但这一点也不理想,因为我失去了背景(它变成黑色)。
关于如何解决这个问题有什么想法吗?
class CustomView: UIView {
var percentage: CGFloat = 0 {
didSet {
setNeedsDisplay()
}
}
override init(frame: CGRect) {
super.init(frame: frame)
clearsContextBeforeDrawing = true
contentMode = .redraw
clipsToBounds = false
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
// NOTE: don't really like doing this
let context = UIGraphicsGetCurrentContext()!
context.clear(rect)
let center = CGPoint(x: self.bounds.size.width/2, y: self.bounds.size.height/2)
let path = UIBezierPath(arcCenter: center,
radius: self.bounds.size.width/2-10,
startAngle: 0.5 * .pi,
endAngle: (-2.0 * self.percentage + 0.5) * .pi,
clockwise: false)
path.lineWidth = 4
UIColor.red.setStroke()
path.stroke()
}
}
这是设置我的单元格和自定义 uiview 的地方。
override func tableView(_ tableView: UITableView, cellForItemAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)
let num = list[indexPath.item]
let percentage = CGFloat(num) / 10
cell.customView.percentage = percentage // Custom view should get redrawn after this call
return cell
}
我认为问题仅仅是您的绘图很大并且偏离了单元格,因为您的视图没有裁剪到边界。那是不连贯的。每个单元格只需要绘制自己的内容。
换句话说,您看到的重叠与自定义视图绘制无关;它与 cell 绘图有关。你正在用你的绘画感染邻近的细胞。
对了,你说:
but this isn't at all ideal since I lose the background (it becomes black)."
您可以通过在 init
中说 self.backgroundColor = .clear
来解决这个问题。
我有自定义 UIView
,我在其中绘制了 UIBezierPath。此视图用于 UITableViewCell。因此,当我滚动时,自定义视图的贝塞尔曲线路径会被重绘。问题是新路径覆盖了旧路径图(上下文未正确清除)。我在 table 单元格提取上调用 setNeedsDisplay()
,并且还为视图设置了 clearsContextBeforeDrawing = true
。清除旧绘图的唯一方法是调用 context.clear(rect)
但这一点也不理想,因为我失去了背景(它变成黑色)。
关于如何解决这个问题有什么想法吗?
class CustomView: UIView {
var percentage: CGFloat = 0 {
didSet {
setNeedsDisplay()
}
}
override init(frame: CGRect) {
super.init(frame: frame)
clearsContextBeforeDrawing = true
contentMode = .redraw
clipsToBounds = false
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
override func draw(_ rect: CGRect) {
super.draw(rect)
// NOTE: don't really like doing this
let context = UIGraphicsGetCurrentContext()!
context.clear(rect)
let center = CGPoint(x: self.bounds.size.width/2, y: self.bounds.size.height/2)
let path = UIBezierPath(arcCenter: center,
radius: self.bounds.size.width/2-10,
startAngle: 0.5 * .pi,
endAngle: (-2.0 * self.percentage + 0.5) * .pi,
clockwise: false)
path.lineWidth = 4
UIColor.red.setStroke()
path.stroke()
}
}
这是设置我的单元格和自定义 uiview 的地方。
override func tableView(_ tableView: UITableView, cellForItemAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)
let num = list[indexPath.item]
let percentage = CGFloat(num) / 10
cell.customView.percentage = percentage // Custom view should get redrawn after this call
return cell
}
我认为问题仅仅是您的绘图很大并且偏离了单元格,因为您的视图没有裁剪到边界。那是不连贯的。每个单元格只需要绘制自己的内容。
换句话说,您看到的重叠与自定义视图绘制无关;它与 cell 绘图有关。你正在用你的绘画感染邻近的细胞。
对了,你说:
but this isn't at all ideal since I lose the background (it becomes black)."
您可以通过在 init
中说 self.backgroundColor = .clear
来解决这个问题。