一、獲取上下文繪制圖形只能在系統(tǒng)方法draw(_ rect: CGRect)中完成，剛剛這幾天有這個(gè)需求，花一點(diǎn)時(shí)間記錄一下舟陆，本文使用swift語言完成，完成效果如下：
![]()
66D51956-6A71-4867-B06A-8108B6306D19.png
66D51956-6A71-4867-B06A-8108B6306D19.png
二耻矮、直接上代碼吧秦躯，首先創(chuàng)建一個(gè)文字?jǐn)?shù)組以及l(fā)abel容器，可以增減數(shù)組內(nèi)容
var labels = Array<UILabel>()
let titles = ["應(yīng)收賬款","應(yīng)付賬款","應(yīng)繳稅金","貨幣資金余額","凈利潤增長率","營業(yè)收入"]
draw(_ rect: CGRect)代碼
override func draw(_ rect: CGRect) {
///移除視圖上已有l(wèi)abel
for label in self.labels {
label.removeFromSuperview()
}
var values = Array<Int>()
var sum = 0
///生成隨機(jī)數(shù)
for _ in titles {
let rand = Int.random(in: 200...500)
values.append(rand)
sum += rand
}
///計(jì)算百分比
var percents = Array<CGFloat>()
for value in values {
percents.append(CGFloat(value) / CGFloat(sum))
}
let center = CGPoint.init(x: kScreenWidth / 2.0, y: (self.height - self.bottomView.height) / 2.0)
let radius = kScreenWidth / 2.0 / 1.8
let context = UIGraphicsGetCurrentContext()!
///折線半徑
let radius2 = radius + 30.0
///label寬度不能超出屏幕
let width = kScreenWidth/2.0 - radius2
let height: CGFloat = 20.0
var index = 0
var startAngle:CGFloat = 0.0
for percent in percents {
let angle = CGFloat.pi * 2.0 * percent
let color = UIColor.init(red: CGFloat.random(in: 0.0...1.0), green: CGFloat.random(in: 0.0...1.0), blue: CGFloat.random(in: 0.0...1.0), alpha: 1.0)
///畫扇形
context.move(to: center)
context.setFillColor(color.cgColor)
context.addArc(center: center, radius: CGFloat(radius), startAngle: startAngle, endAngle: startAngle + angle, clockwise: false)
context.fillPath()
///畫折線
let halfAngle = startAngle + angle / 2.0
let point1 = self.getPoint(center: center, angle: halfAngle, radius: radius)
let point2 = self.getPoint(center: center, angle: halfAngle, radius: radius2)
let point3x = point1.x <= point2.x ? point2.x + width : point2.x - width
let point3 = CGPoint.init(x: point3x, y: point2.y)
context.move(to: point1)
context.addLines(between: [point1,point2,point3])
context.setStrokeColor((UIColor.lightGray.cgColor))
context.strokePath()
///值標(biāo)簽
let labelx = point1.x <= point2.x ? point2.x : point3.x
let label = UILabel.init(frame: CGRect.init(x:labelx, y: point2.y - height, width: width, height: height))
label.font = UIFont.systemFont(ofSize: 15)
label.textAlignment = .center
label.textColor = UIColor.gray
label.text = "￥" + String(values[index] * 100)
self.addSubview(label)
self.labels.append(label)
///文字標(biāo)簽
let textLabel = UILabel.init(frame: CGRect.init(x: 0, y: 0, width: width, height: 30))
textLabel.center = self.getPoint(center: center, angle: halfAngle, radius: radius - 30)
textLabel.font = UIFont.systemFont(ofSize: 10)
textLabel.textColor = .white
textLabel.textAlignment = .center
textLabel.numberOfLines = 0
textLabel.text = self.titles[index] + "\n" + String.init(format: "%.f%%", percent * 100.0)
textLabel.transform = CGAffineTransform.init(rotationAngle: halfAngle + CGFloat.pi / 2.0)
self.addSubview(textLabel)
self.labels.append(textLabel)
startAngle += angle
index += 1
}
let toolLabel = UILabel.init(frame: CGRect.init(x: 0, y: 0, width: radius, height: radius))
toolLabel.backgroundColor = UIColor.white
toolLabel.center = center
toolLabel.setCornerRadius(0)///自定義方法裆装，設(shè)置圓角
self.addSubview(toolLabel)
self.labels.append(toolLabel)
}
三踱承、自定義通過圓心、弧度哨免、半徑獲取目標(biāo)點(diǎn)CGPoint
func getPoint(center: CGPoint, angle: CGFloat, radius: CGFloat) -> CGPoint {
let x = center.x + cos(angle) * radius
let y = center.y + sin(angle) * radius
return CGPoint.init(x: x, y: y)
}
