Android - 커스텀 체크박스(Checkbox) 생성하는 방법 (Kotlin)

안드로이드 체크박스

기본 체크박스

안드로이드 스튜디오 개발 툴에서 제공하는 체크박스 입니다.

현재 안드로이드 10 버전이 상용화되고, 곧 안드로이드 11일 출시될 예정입니다.
이렇듯 버전이 지속적으로 증가하면서 기본 뷰 디자인도 굉장히 무난하고 이뻐졌습니다.

하지만 우리 개발자들은 늘 100% 만족은 못하잖아요?
지금 체크박스보다 조금 더 이쁘게 커스텀을 해보겠습니다.

커스텀 체크박스

커스텀 레이아웃 생성

우선 drawble에 커스텀 체크박스 레이아웃을 만들어줍니다.

한번 보시면 어떤 라인이 어떤 뷰를 담당하고 기능을 하는지 쉽게 알 수 있을겁니다.
입맛대로 바꿔주고 저장합니다.
여기서 이미지 영역에 체크 이미지가 필요합니다. 아이콘을 가져와야 합니다.

저는 무료 icon 사이트인 이 곳을 추천합니다.

https://www.flaticon.com/

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Unchecked -->
    <item android:state_checked="false">
        <shape>
            <stroke android:color="#c4cbd2" android:width="1dp" />
            <corners android:radius="10dp" />
            <solid android:color="#fff" />
        </shape>
    </item>
    <!-- Checked -->
    <item android:state_checked="true">
        <layer-list>
            <!-- 배경 -->
            <item>
                <shape>
                    <corners android:radius="10dp" />
                    <solid android:color="#FF4081" />
                </shape>
            </item>
            <!-- 이미지 영역 -->
            <item android:drawable="@drawable/checkimg" android:top="4dp" android:right="4dp" android:bottom="4dp" android:left="4dp" />
        </layer-list>
    </item>
</selector>

본 레이아웃에 커스텀 적용

사용하고자 하는 레이아웃에 체크박스를 생성합니다.

• android:background 속성에 이전에 만든 커스텀 파일의 값을 줍니다.
• button은 버튼의 색상을 투명하게 변경합니다

<CheckBox
        android:id="@+id/checkbox"
        android:layout_margin="3dp"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:button="@android:color/transparent"
        android:background="@drawable/checkbox"
        android:checked="false"/>

이렇게 모든 체크박스를 만들었으면 한번 테스트 해봅시다.

어떄요? 기본 체크박스보다 더 외관상 괜찮아진 것 같나요?

저는 다음과 같이 뷰 이미지 객체에 체크박스를 넣었습니다.

다음 포스팅부터는 리사이클러뷰의 객체에 체크박스를 만들고 이를 제어하는 부분에 대해 다루어보겠습니다.

• 참고자료: https://ghj1001020.tistory.com/2