라디오 버튼(Radio Button) 기본색상 변경해보기

 라디오 버튼(Radio Button) 

기본색상 변경해보기

ㆍ 대단한건 아니고 이번에는 라디오버튼 기본색을

    변경해보려고 합니다.

    많은분들이 라디오버튼은 커스텀해서 쓰시는걸로 알고 있는데

    간단하게 색깔 정도만 바꾸시길 원하시는분들은 사용해보세요

 

먼저 시작전에

혹시 아래 코드에서

일반 RadioButton과

AppCompatRadioButton의

차이점을

아시나요?

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="15sp"
        android:textColor="#000000"
        android:text="----------------일반 라디오 버튼------------"/>
    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"/>
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <RadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RadioGroup>


    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="15sp"
        android:textColor="#000000"
        android:text="----------------support 라디오 버튼------------"/>
    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <android.support.v7.widget.AppCompatRadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"/>
        <android.support.v7.widget.AppCompatRadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <android.support.v7.widget.AppCompatRadioButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </RadioGroup>
</LinearLayout>

일단 차이점을 보기 위해서

실행시켜보겠습니다

위 사진은 

API23 에뮬에서

실행시킨 결과화면입니다.

뭐 차이점이 없어보이죠?

그럼 이번에는

API19 디바이스에서

돌려보겠습니다

위의 결과랑은

다르게 나옵니다

일반 라디오버튼은

검정색으로 나오는데

아래 서포트 라디오버튼은

분홍색으로 나옵니다

API23과 API19의

차이점은 무엇일까요?

차이점은

중간에 API21(롤리팝)이 있다는

점입니다.

(머티리얼 디자인)

API21 위로는 기본적인

라디오버튼을 써도

분홍색으로 이쁘게 나오지만

그 아래버전의 디바이스는

예전라디오 버튼처럼

약간 구식으로 나옵니다

이를 해결해주기 위해서

support.v7.~어쩌구~AppCompatRadioButton을

사용할 수 있도록 내놨습니다.

이 라디오 버튼을 사용하면

api가 낮은 버전의 디바이스도

위처럼 이쁜 분홍색 라디오버튼을

얻을 수가 있습니다.

그리고 추가적으로

AppCompatRadioButton에서

라디오버튼색상을

변경시켜줄수 있는

ButtonTint라는놈도 생겼습니다

아래 코드와 같이

<android.support.v7.widget.AppCompatRadioButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:buttonTint="#FF0000"
    android:checked="true"/>

요론식으로

버튼틴트를 

추가시켜주면

위 사진처럼

빨간색 라디오버튼을

사용하실 수 있습니다.

라고 말씀드리고 싶은데

요놈의 틴트도

낮은 버전의 api는

무용지물입니다.

(분홍색 라디오버튼 디폴트..)

그래서 해결방법으로

이걸 강제적으로

바꾸기 위해서

Style의 색을 바꿔줍니다.

[values]-[style]을

들어가봅니다

3번째 colorAccent

쟤를 바꿔주면 됩니다

현재는 @color/colorAccent로

되어있으므로

[values]-[colors]로 가서

원하는 색상을 만들어줍니다

이런식으로 바꿔준후에

다시 Style에서 바꿔주면

끝~

짜잔

뭐 결론만 얘기하자면

1. AppCompatRadioButton을 쓴다

2. Style에서 colorAccent의 색상을 바꿔준다

이상입니다.

혹시

 틀린부분이나

제가 넘기고간 부분

있다면 알려주시면

정말정말 감사하겠습니다