본문 바로가기
개발(Development)/Android(안드로이드)

[안드로이드] 원형 프로그레스바 테두리 끝 둥글게 Roound 처리 방법

by 카레유 2021. 8. 21.

안드로이드에서 원형 프로그레스바를 만들고,

1. 테두리를 부드럽게하고, 

2. 그래프 선 끝부분을 둥글게 처리하는 방법을 정리한다.

안드로이드 원형 프로그레스바

 

안드로이드 도넛 그래프(원형 프로그레스바) 만드는 방법은 아래글을 참고

 

[안드로이드] 커스텀 원형 프로그레스 바(도넛 그래프) 만드는 방법

 


# 원형 프로그레스바 디자인 다듬기

원형 프로그레스바의 테두리/가장자리가 부드럽고, 끝부분은 둥글게 Round 처리 해보자.

 

1. 테두리 부드럽게 처리

Paint객체.isAntiAlias = true

* 단, 이 설정은 추가 연산이 필요해서 복잡한 뷰의 경우 성능 이슈가 있을 수 있다고 한다.

 

2. 그래프 선의 끝 가장자리를 둥글게 처리

Paint객체.strokeCap = Paint.Cap.ROUND 

class CustomCircleBarView: View {

    // 생성자
    constructor(context: Context?) : super(context)
    constructor(context: Context?, attrs: AttributeSet?) : super(context, attrs)


    // 원형 프로그레스바 그리기
    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)

        // Paint 객체 생성
        val paint = Paint()


        // 1. 회색 원(배경)그리기
        paint.color = Color.GRAY
        paint.style = Paint.Style.STROKE
        paint.strokeWidth = 40f        
        // 그래프 선의 테두리/가장자리를 부드럽게 처리
        paint.isAntiAlias = true
        canvas?.drawArc(200f, 200f, 700f, 700f, 0f, 360f, false, paint)


        // 2. 파란 원(프로그레스) 그리기
        paint.color = Color.GREEN
        // 그래프 선의 끝을 둥글게 처리!
        paint.strokeCap = Paint.Cap.ROUND
        canvas?.drawArc(200f, 200f, 700f, 700f, -90f, 180f, false, paint)

    }

}

 

참고로 Paint객체의 strokeCap에 설정할 수 있는 값은 3종류가 있다.

- Paint.Cap.BUTT 

- Paint.Cap.ROUND

- Paint.Cap.SQUARE

 

자세한 내용은 레퍼런스 참고

https://developer.android.com/reference/kotlin/android/graphics/Paint.Cap?hl=en#summary

 

 

이벤트 발생등으로 인한 값 변경에 따라 원형 프로그레스바의 진행률을 다르게 표현하는 방법은

아래 글을 참고

 

[안드로이드] 원형 프로그레스바 동적으로 조정하는 방법

 

 

댓글