Swift 循环绘制多条路径
Swift draw several paths in loops
我正在努力将我以前的圆图更改为圆环图(可以支持超过 1 个数字)。
我的所有角度都是正确的,更改了我的数据以使用数组。
但是当我尝试绘制我的路径时,它只绘制了最后一条。
这是问题的示例屏幕截图:
在上面的例子中,设置绘制这个数组:
cell.circleChart.percentFills = [weight, 10]
其中权重是圆圈标签中显示的百分比。所以你可以看到,它没有画出第一个角,但是下一个角的起点是正确的。
这是我绘制圆环图的代码。
override func drawRect(rect: CGRect) {
// Define the center.
let center = CGPoint(x:bounds.width/2, y: bounds.height/2)
// Define the radius
let radius: CGFloat = max(bounds.width, bounds.height)
// Define starting and ending angles
var startAngle: CGFloat = CGFloat(DegreesToRadians(-90))
let endAngle: CGFloat = CGFloat(DegreesToRadians(270))
// Set up the full path. (for the default background color)
var path = UIBezierPath(arcCenter: center,
radius: bounds.width/2 - arcWidth/2,
startAngle: startAngle,
endAngle: endAngle,
clockwise: true)
// draw the full chart with the background color
path.lineWidth = arcWidth
chartColor.setStroke()
path.stroke()
//calculate the arc for each per percent
let arcLengthPerPercent = CGFloat(DegreesToRadians(360/100))
// Temporary var for loop testing
var i = 0
println("startAngle before loop: \(RadiansToDegrees(Double(startAngle)))")
for percentFill in percentFills {
println("LOOP: \(i)")
if i == 0 {
fillColor = UIColor.formulaBlueColor()
println("BLUE")
} else {
fillColor = UIColor.formulaGreenColor()
println("GREEN")
}
//then multiply out by the actual percent
let fillEndAngle = arcLengthPerPercent * CGFloat(percentFill) + startAngle
println("fillEndAngle: \(RadiansToDegrees(Double(fillEndAngle)))")
//2 - draw the outer arc
var fillPath = UIBezierPath(arcCenter: center,
radius: bounds.width/2 - arcWidth/2,
startAngle: startAngle,
endAngle: fillEndAngle,
clockwise: true)
progressLine.path = fillPath.CGPath
progressLine.strokeColor = fillColor.CGColor
progressLine.fillColor = UIColor.clearColor().CGColor
progressLine.lineWidth = arcWidth
// add the curve to the screen
self.layer.addSublayer(progressLine)
i++
startAngle = startAngle+(arcLengthPerPercent * CGFloat(percentFill))
}
}
我想我可能在最后一点出错了,我将 progressLine 添加为子层,但我不知道我还应该在这里做什么。
当然,我已经测试过,如果我在数组中只有 1 个值,它会按预期绘制(蓝色)
任何帮助绘制多条路径的帮助,将不胜感激!
But when I try to draw my paths, it only draws the last one.
问题是 progressLine
是在此例程之外声明的。因此,您只是一遍又一遍地添加 same 路径层作为子层 - 而不是多个路径子层。因此它只在您的界面中出现一次,包含您最近最近分配给它的路径(段)——上次迭代中的最后一个循环。
我正在努力将我以前的圆图更改为圆环图(可以支持超过 1 个数字)。
我的所有角度都是正确的,更改了我的数据以使用数组。
但是当我尝试绘制我的路径时,它只绘制了最后一条。
这是问题的示例屏幕截图:
在上面的例子中,设置绘制这个数组:
cell.circleChart.percentFills = [weight, 10]
其中权重是圆圈标签中显示的百分比。所以你可以看到,它没有画出第一个角,但是下一个角的起点是正确的。
这是我绘制圆环图的代码。
override func drawRect(rect: CGRect) {
// Define the center.
let center = CGPoint(x:bounds.width/2, y: bounds.height/2)
// Define the radius
let radius: CGFloat = max(bounds.width, bounds.height)
// Define starting and ending angles
var startAngle: CGFloat = CGFloat(DegreesToRadians(-90))
let endAngle: CGFloat = CGFloat(DegreesToRadians(270))
// Set up the full path. (for the default background color)
var path = UIBezierPath(arcCenter: center,
radius: bounds.width/2 - arcWidth/2,
startAngle: startAngle,
endAngle: endAngle,
clockwise: true)
// draw the full chart with the background color
path.lineWidth = arcWidth
chartColor.setStroke()
path.stroke()
//calculate the arc for each per percent
let arcLengthPerPercent = CGFloat(DegreesToRadians(360/100))
// Temporary var for loop testing
var i = 0
println("startAngle before loop: \(RadiansToDegrees(Double(startAngle)))")
for percentFill in percentFills {
println("LOOP: \(i)")
if i == 0 {
fillColor = UIColor.formulaBlueColor()
println("BLUE")
} else {
fillColor = UIColor.formulaGreenColor()
println("GREEN")
}
//then multiply out by the actual percent
let fillEndAngle = arcLengthPerPercent * CGFloat(percentFill) + startAngle
println("fillEndAngle: \(RadiansToDegrees(Double(fillEndAngle)))")
//2 - draw the outer arc
var fillPath = UIBezierPath(arcCenter: center,
radius: bounds.width/2 - arcWidth/2,
startAngle: startAngle,
endAngle: fillEndAngle,
clockwise: true)
progressLine.path = fillPath.CGPath
progressLine.strokeColor = fillColor.CGColor
progressLine.fillColor = UIColor.clearColor().CGColor
progressLine.lineWidth = arcWidth
// add the curve to the screen
self.layer.addSublayer(progressLine)
i++
startAngle = startAngle+(arcLengthPerPercent * CGFloat(percentFill))
}
}
我想我可能在最后一点出错了,我将 progressLine 添加为子层,但我不知道我还应该在这里做什么。
当然,我已经测试过,如果我在数组中只有 1 个值,它会按预期绘制(蓝色)
任何帮助绘制多条路径的帮助,将不胜感激!
But when I try to draw my paths, it only draws the last one.
问题是 progressLine
是在此例程之外声明的。因此,您只是一遍又一遍地添加 same 路径层作为子层 - 而不是多个路径子层。因此它只在您的界面中出现一次,包含您最近最近分配给它的路径(段)——上次迭代中的最后一个循环。