Selamlar, Swift ile UIKit aracılığıla yaptığımız bir proje içerisinde Pie Chart – Pasta Grafiği ihtiyacı sırasında gelen verilere göre yüzdelik olarak dilim payı ve boşluklu olmasını hedefledik. Arayışlarım içerisinde Swift, Java ve Kotlin aynı kütüphaneyi kullanıyordu. Eski sürümler ile ilgili çöp bilgi çok fazlaydı. Sizler için daha fazla uzatmadan kullanıma geçireyim;
Xcode için CacaoPods ile kurulumunu anlatmıyorum aşağıdaki adresten kurulumuna ulaşabilirsiniz;
Charts kütüphanesinin GitHub linki;
Kurulumu tamamladıktan sonra Pie Chart için işlem yapacağınız Storyboard’a yeni bir UIView ekleyelim ve konumunu ayarlayalım.
Ekledim ve konumunu ayarladım. 394×240 boyut verdim. Siz istediğiniz gibi verebilirsiniz.
Ardından oluşturduğunuz View’i işlem yapacağımız swift sınıfımıza tanımlayalım.
Renkler için öncelikle yeni bir Extension oluşturalım. Çünkü NSUIColor kullanacağız, hex değeri ile rengi verebilecek extension’unumuzu oluşturalım.
NSUIColor+Hex.swift dosyasını oluşturalım.
import Foundation
import Charts
extension NSUIColor {
convenience init(red: Int, green: Int, blue: Int) {
assert(red >= 0 && red <= 255, "Bilinmeyen Kırmızı Komponent")
assert(green >= 0 && green <= 255, "Bilinmeyen Yeşil Komponent")
assert(blue >= 0 && blue <= 255, "Bilinmeyen Mavi Komponent")
self.init(red: CGFloat(red) / 255.0, green: CGFloat(green) / 255.0, blue: CGFloat(blue) / 255.0, alpha: 1.0)
}
convenience init(hex: Int) {
self.init(
red: (hex >> 16) & 0xFF,
green: (hex >> 8) & 0xFF,
blue: hex & 0xFF
)
}
}
Devamında işlem yapacağımız dosyamıza gelelim. Ve aşağıdaki kodları buna göre ayarlayalım.
import UIKit
import Charts
class ViewController: UIViewController {
@IBOutlet private weak var pieView: PieChartView!
override func viewDidLoad() {
super.viewDidLoad()
setupPieChart()
}
func setupPieChart(){
pieView.drawHoleEnabled = false
pieView.rotationAngle = 0
pieView.rotationEnabled = false
pieView.drawSlicesUnderHoleEnabled = true
pieView.drawEntryLabelsEnabled = false
pieView.usePercentValuesEnabled = true
pieView.highlightPerTapEnabled = false
pieView.legend.enabled = false
pieView.holeRadiusPercent = 100
pieView.setExtraOffsets(left: 5, top: 0, right: 5, bottom: 0)
var entries : [PieChartDataEntry] = Array()
entries.append(PieChartDataEntry(value: 70))
entries.append(PieChartDataEntry(value: 30))
let dataSet = PieChartDataSet(entries: entries, label : "")
dataSet.sliceSpace = 0
dataSet.yValuePosition = .outsideSlice
dataSet.xValuePosition = .outsideSlice
let x_pie_color = NSUIColor(hex: 0xEAE2F2)
let c_pie_color = NSUIColor(hex: 0xA87EC9)
let x_text_color = NSUIColor(hex: 0x4a0ca0)
let c_text_color = NSUIColor(hex: 0xAAFFFF)
let value_line_color = NSUIColor(hex: 0xCCCFFF)
dataSet.colors = [x_pie_color, c_pie_color]
dataSet.valueColors = [x_text_color, c_text_color]
let pFormatter = NumberFormatter()
pFormatter.numberStyle = .percent
pFormatter.maximumFractionDigits = 1
pFormatter.multiplier = 1
pFormatter.percentSymbol = "%"
dataSet.valueFormatter = DefaultValueFormatter(formatter: pFormatter)
dataSet.valueFont = NSUIFont(name: "HelveticaNeue-Medium", size: CGFloat(18.0))!
dataSet.drawValuesEnabled = true
dataSet.selectionShift = 0
dataSet.valueLinePart1Length = 0.5
dataSet.valueLinePart2Length = 0.5
dataSet.valueLineColor = value_line_color
pieView.data = PieChartData(dataSet: dataSet)
}
}
Burada entries.append() kısmına verilerimizi ekleyebiliriz. dataSet.colors ve dataSet.valueColors’a sırasıyla append ettiklerimizin renklerini verebiliriz.
pFormatter.percentSybol ile yüzde işareti verdim.
let x_pie_color ve diğerleriyle hex kodu ile NSUIColor rengi oluşturup tanımlayabilirsiniz.
Ancak böyle yaptığımızda yüzdeleri dışarı yazdıracağız. Çünkü aşağıdaki kısım ile dışarıda gösterilmesini sağlıyoruz.
dataSet.yValuePosition = .outsideSlice
dataSet.xValuePosition = .outsideSlice
İçeride yüzdeleri yazdırmak için ise aşağıdaki gibi güncellemelisiniz.
dataSet.yValuePosition = .insideSlice
dataSet.xValuePosition = .insideSlice
İçerisine label eklemek için ise aşağıdaki gibi drawEntryLabelsEnabled’ı true yapmamız ve entries’e append ettiğimiz PieChartDataEntry’e label değerini eklememiz gerekiyor.
pieView.drawEntryLabelsEnabled = true
entries.append(PieChartDataEntry(value: 70, label: "70 için label"))
entries.append(PieChartDataEntry(value: 30, label: "30 için label"))
Eğer içerisine spacing eklemek isterseniz
dataSet.sliceSpace = 5
veya istediğiniz bir boyutta seçebilirsiniz. Sonucu aşağıdaki gibi olacaktır.
Olabildiğince kısa biçimde kullanımını anlattım. Takıldığınız veya değişmesini istediğiniz bir yer olursa buradan mail atabilir, destek alabilirsiniz.
