Swift Chart 라이브러리 BarChartView CornerRadius
개발 도중에 차트가 필요해서 라이브러리를 활용 하려고 했다
차트 UI를 구성 중에 BarChart가 가장 상승 하락을 표시하기 가장 적합하다 생각 했고 모서리를 둥글게 하는것이
현재 구현하고 있는 UI와 어울릴 것이라 판단되어 CornerRadius 를 찾아보았지만 BarChart에서는 기본적으로 CornerRadius 해주는것이 없다..
해당 라이브러리의 issue, pull Reqeust를 뒤져보면 나처럼 CornerRadius에 대해 고민하고 해결방안을 제시한 사람들이 꽤 있다
stackoverflow에서도 해결방안으로 해당 라이브러리 pullRequest 링크를 올려져 있다
내가 해결한 방법은 해당 BarChartView를 Render 해주는 파일에서 직접 bar에 UIBezierPath를 지정하여 문제를 해결했다
여러 방법들이 있었지만 그 중 나는 이렇게 하는 방법이 이해하기 쉬었다
Charts라이브러리 폴더에 Source - > Renderers 에 가보면 BarChartRenderer.swift 있는데 이파일 BarChart를 그려주는 클래스
let bezierPath = UIBezierPath(roundedRect: barRect, cornerRadius: "YOURConerRadiudCGFloat")
context.addPath(bezierPath.cgPath)
context.drawPath(using: .fill)수정할 라인은 382라인 context.fill(barRect) 제거해준다
그리고 해당 라인에 코드를 넣어주면 내가 넣어준 cornerRadius 값만큼 변화되어있는것을 볼 수 있다.
왜 CornerRadius 메서드가 구현되어있지 않는 이유는
얇은 막대의 경우 타원형으로 보일수도 있으며 이것이 결점이라 더 나은 솔루션을 찾는중이며
개발자는 자신이 구현한 코드가 만족스럽지 못하고, 오픈소스이니 직접 고쳐보세요 이런 늬앙스?
그렇다고한다
둥근 막대를 쉽게 그릴수 있다면 좋을텐데 만들어주지 않아 아쉽다
내가 만든 CornerRadius 적용한 BarChartView 스크린샷이다
이미지처럼 높이마다 CornerRadius를 거의 비슷하게 만들기는 위의 방법대로는 불가능하며 높이값에 따라 Radius 값을 다르게 줘야한다
func calculateCornerRadius(rect: CGRect) -> CGFloat {
let height = Double(rect.size.height * 0.1)
let ceil = ceil(height)
if ceil > 8 {
return 8
}
return CGFloat(ceil)+1
}함수를 만들어서 각 높이마다 CornerRadius값을 따로 구하여 적용시켜준다면 이미지 처럼 나오게 된다
130 높이의 경우 14의 Radius값을 가지게 되는데 그렇게되면 넓이에 비해 모서리가 더욱 둥글게 되는 현상이 있고 여러 높이값들을 비교해보며 UI적으로 보기 좋은 값을 찾아 제한을 8로 두었다
높이값 5 ~ 130 까지 직접 만들어가며 비교해보았다
번외
나는 라이브러리를 보통 Package Manager를 이용한다
따로 pod를 설치 할 필요도없고 간편하게 쉽게 설치 제거가 가능하기 때문에
하지만 이번 차트 라이브러리는 CornerRadius를 수정하기 위해서는 직접 라이브러리를 수정해야되는 상황이였다
Package Manager로 설치된 라이브러리는 수정할수가 없어 pod로 설치해야 하나 고민이 들었지만
pod를 설치 하지 않고 다른 방법으로 라이브러리 수정하여 Package Manager로 주입시켰다
Charts 라이브러리를 내 레포에 Fork 후 해당 부분만 수정하고 Package Manager에 내 레포에 있는 Chart라이브러리를 가져가 쓰는 방법으로 pod 설치하지 않고 라이브러리 코드를 수정하고 사용할수 있었다
단점 : pod 라면 해당 프로젝트 로컬에 있기 때문에 편하게 프로젝트 내에서 수정이 가능하겠지만 내 상황은 그렇지 않기 때문에 파일을 열어 수정하고 commit , push 까지 해주고 현재 Pakage Manager 라이브러리를 지우고 다시 설치하는 귀찮은 작업들이 생겼다...
* 그리고 업데이트가 되었을때 문제가 발생할수도 있는 상황을 주의해야한다