CheckBox의 색상을 변경하는 방법은 무엇입니까?


247

CheckBoxAndroid 에서 기본 색상을 어떻게 변경 합니까?
기본적으로 CheckBox색상은 녹색이며이 색상을 변경하고 싶습니다.
그것이 가능하지 않다면 사용자 정의하는 방법을 알려주십시오 CheckBox.


1
서체 색상을 변경하려고합니까? 아니면 실제 상자의 색은?

1
실제 상자 색상 변경
Piyush

72
를 설정하면 android:buttonTint="@color/mybrown"상자 색상을 쉽게 변경할 수 있습니다.
shauvik

6
@Shauvik 그것은 단지 재료 디자인 작업 :)
Mucahit

9
@ shauvik app:buttonTint="@color/mybrown"대신 사용 하는 것이 낫습니다 .이 방법은 API <21에서 작동 할 수 있습니다
Nikaoto

답변:


187

당신이 경우 minSdkVersion21+ 사용 인 android:buttonTint체크 박스의 색상을 업데이트하는 속성 :

<CheckBox
  ...
  android:buttonTint="@color/tint_color" />

AppCompat 라이브러리를 사용하고 21 미만의 Android 버전을 지원하는 프로젝트에서는 compat 버전의 buttonTint속성을 사용할 수 있습니다 .

<CheckBox
  ...
  app:buttonTint="@color/tint_color" />

이 경우 서브 클래스를 만들고 싶다면 대신 CheckBox사용 AppCompatCheckBox하는 것을 잊지 마십시오 .

이전 답변 :

속성을 CheckBox사용하여 드로어 블을 변경할 수 있습니다 android:button="@drawable/your_check_drawable".


7
자신 만의 드로어 블을 만들어야합니다. 더 직접적인 방법이
있어야합니다

14
버튼 색상을 변경하는 것이보다 직접적인 방법입니다. 기본 요소를 불필요하게 사용자 정의하는 대신 사용해야합니다.
Neela

3
참고 : 머티리얼 디자인 스타일링을위한 contentControl옵션이 있습니다 : materialdoc.com/components/selection-controls
SimpsOff

392

XML에서 직접 색상을 변경할 수 있습니다. buttonTint상자에 사용 : (API 레벨 23 기준)

<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:buttonTint="@color/CHECK_COLOR" />

appCompatCheckbox v7이전 API 레벨 에서이 작업을 수행 할 수도 있습니다.

<android.support.v7.widget.AppCompatCheckBox 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    app:buttonTint="@color/COLOR_HERE" /> 

5
AppCompatCheckBox ... 감사합니다. 나는 이것을 몰랐다.
moskis

8
감사합니다! 그리고 xmlns : app = " schemas.android.com/apk/res-auto " 를 주 / 부모 레이아웃 에 추가하는 것을 잊지 마십시오
Alberto Méndez

2
'android.support.v7.widget.AppCompatCheckBox'를 사용하여 나를 위해 작동하지 않음
Zvi

1
레이아웃에서 CheckBox를 사용할 때 자동으로 사용됩니다. 사용자 정의보기를 작성할 때이 클래스 만 수동으로 사용해야합니다.
최봉재

2
확인 된 상태와 확인되지 않은 상태에 대해 서로 다른 두 가지 색상을 설정하는 방법
DYS

130

styles.xml에서 원하는 색상을 얻도록 확인란의 Android 테마를 설정할 수 있습니다.

<style name="checkBoxStyle" parent="Base.Theme.AppCompat">
    <item name="colorAccent">CHECKEDHIGHLIGHTCOLOR</item>
    <item name="android:textColorSecondary">UNCHECKEDCOLOR</item>
</style>

그런 다음 레이아웃 파일에서 :

<CheckBox
     android:theme="@style/checkBoxStyle"
     android:id="@+id/chooseItemCheckBox"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"/>

android:buttonTint="@color/CHECK_COLOR"이 방법을 사용 하는 것과 달리 Api 23에서 작동합니다.


5
TEXTCOLORSECONDARY !!!! 고마워요! 그게 다야. 선택하지 않은 배경색을 변경하기 위해 연령을 검색했으며 사용자 정의 드로어 블을 사용하고 싶지 않았습니다. 이거 야!
Mulgard

@Mulgard 내가 도울 수있어서 기쁘다!
Amro elaswar

2
나를 위해 일했지만 텍스트를 볼 수 있도록 CheckBox xml에 추가해야했습니다-android : textColor = "@ color / textColor"
Zvi

프로그래밍 방식으로 어떻게합니까?
Zvi

@Zvi 나는 이것을 당신이 프로그램 적으로 할 수 있는지 확신하지 못한다
Amro elaswar

48

프로그래밍 버전 :

int states[][] = {{android.R.attr.state_checked}, {}};
int colors[] = {color_for_state_checked, color_for_state_normal}
CompoundButtonCompat.setButtonTintList(checkbox, new ColorStateList(states, colors));

1
고마워. 더 나은 솔루션, 당신은 바위.
Carlos

색상에 예기치 않은 결과가 생겼습니다. 혼동하지 않으셨습니까?
Kirill Karmazin

@Carlos 이것은 "더 나은"솔루션이 아닙니다. 안드로이드에서는 항상 모든 XML 파일의 레이아웃을 설정하고 동적으로 변경해야하는 경우를 제외하고 프로그래밍 방식으로 설정하지 않아야합니다.
kyay

@kyay "항상"이 아닙니다 ... 안드로이드 리소스 시스템은 혼란스럽고 프로그래밍 방식으로 수행하는 것이 훨씬 쉽고 유지 관리가 용이합니다.
nyholku

그것은 문제의 분리를 도와줍니다
kyay

42

buttonTint21 개 이상의 API 버전에서 버튼 색상 및 색상 선택기를 변경하는 데 사용 합니다.

<android.support.v7.widget.AppCompatCheckBox
                android:id="@+id/check"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:buttonTint="@color/checkbox_filter_tint"
                tools:targetApi="21"/>

res / colors / checkbox_filter_tint.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/light_gray_checkbox"
          android:state_checked="false"/>
    <item android:color="@color/common_red"
          android:state_checked="true"/>
</selector>

3
영어로 말하고 답을 설명해 주시겠습니까?
GGO

항상 영어를 사용하십시오.
nyconing

더 나은 답변입니다
Vivek A Naik

이것은 모든 장치에서 작동하는 체크 색상과 체크되지 않은 색상을 모두 설정하는 유일한 간단한 방법 인 것 같습니다.
Gumby The Green

이것이 정답입니다. 셀렉터가 values리소스 로 선언 된 경우에는 작동하지 않습니다 . 위에 표시된 경로로 표시된 것처럼 colors리소스 폴더 안에 있어야 합니다.
Benjamin Basmaci '

18

내장 안드로이드 뷰를 구성하고 프로젝트에 새로운 스타일을 추가하는 방법으로 안드로이드에서 스타일 접근 방식을 사용하는 것이 좋습니다.

<style name="yourStyle" parent="Base.Theme.AppCompat">
    <item name="colorAccent">your_color</item> <!-- for uncheck state -->
    <item name="android:textColorSecondary">your color</item> <!-- for check state -->
</style>

android : theme = "@ style / youStyle"확인란의 테마에이 스타일을 추가합니다.

도움이 되었기를 바랍니다.


이 솔루션에 동의하면 해당 속성은 upvoted answer와 같은 drawable에 번거 로움없이 기본 내장 Android 구성 요소에서 더 잘 작동합니다.
Trung Le

1
이것은 9 개월 전의 Amro elaswar의 답변의 반복입니다.
jk7

이것이 바로 실제 솔루션 인 솔루션입니다.
Iharob Al Asimi 2016 년

16

XML에 buttonTint 추가

<CheckBox
      android:id="@+id/chk_remember_signup"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:buttonTint="@android:color/white"
      android:text="@string/hint_chk_remember_me" />

2
이 답변의 내용은 이미 afathman 's answer에 있습니다.
MTCoster

10

styles.xml파일에 다음 줄을 추가 하십시오.

<style>
    <item name="android:colorAccent">@android:color/holo_green_dark</item>
</style>

예를 들어 답을 편집하고 코멘트로 게시하지 마십시오
bish

4
약간의 수정 : <item name = " android : colorAccent> </ item>입니다. 또한 API 21 이상에서만 사용할 수 있습니다
user3829751

이것은 색을 변화시킵니다, 그것은 요청 된 것이 아닙니다
Alberto M

1
Galaxy S3에서는 CheckBox의 확인 된 상태 만 변경합니다. 그러나 확인되지 않은 상태는 여전히 동일합니다.
Slava

9

buttonTint는 나를 위해 노력했다.

android : buttonTint = "@ color / white"

<CheckBox
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:id="@+id/agreeCheckBox"
    android:text="@string/i_agree_to_terms_s"
    android:buttonTint="@color/white"
    android:layout_below="@+id/avoid_spam_text"/>

8

나는 같은 문제에 직면했고, 아래 기술을 사용하여 해결책을 얻었습니다. 복사 btn_check.xml에서 android-sdk/platforms/android-#(version)/data/res/drawable프로젝트의 당김 폴더 및 사용자 정의 이미지에 이미지 상태 '오프'를 '사용'을 변경합니다.
그런 다음 XML이 필요합니다.android:button="@drawable/btn_check"

<CheckBox
    android:button="@drawable/btn_check"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:checked="true" />

다른 기본 Android 아이콘을 사용하려는 경우 다음을 사용할 수 있습니다.

android:button="@android:drawable/..."

좋은 답변-사용자 정의 XML을 만드는 것보다 훨씬 쉽습니다. 감사합니다! 나에게 회색 배경이 있고 확인란 테두리가 보이지 않았습니다. 나는 이것을 추가했고 당신은 지금 그것을 볼 수 있습니다 : android : button = "@ android : drawable / checkbox_off_background"
Gene Bo

1
실제로이 방법을 사용하는 것보다 조금 더 많은 것이 있습니다. 그러나 여전히 좋은 옵션입니다. 아래에 세부 정보를 추가했습니다. stackoverflow.com/a/29831532/2162226
Gene Bo

5

checkbox줄의 코드를 사용하여 색상을 변경할 수 있습니다

android:buttonTint="@color/app_color" //whatever color


4

100 % 강력한 접근 방식.

필자의 경우 타사 MaterialDialog 라이브러리에서 Checkbox를 가져 오기 때문에 XML 레이아웃 소스 파일에 액세스 할 수 없었습니다. 따라서 프로그래밍 방식으로 해결해야합니다.

  1. xml에서 ColorStateList를 만듭니다.

입술 / 색상 /checkbox_tinit_dark_theme.xml :

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/white"
        android:state_checked="false"/>
    <item android:color="@color/positiveButtonBg"
        android:state_checked="true"/>
</selector>
  1. 그런 다음 확인란에 적용하십시오.

    ColorStateList darkStateList = ContextCompat.getColorStateList(getContext(), R.color.checkbox_tint_dark_theme);
    CompoundButtonCompat.setButtonTintList(checkbox, darkStateList);

추신 : 누군가 관심이 있다면, MaterialDialog 대화 상자에서 (확인란을 설정 한 경우) 확인란을 얻는 방법은 다음과 .checkBoxPromptRes(...)같습니다.

CheckBox checkbox = (CheckBox) dialog.getView().findViewById(R.id.md_promptCheckbox);

도움이 되었기를 바랍니다.


3

Drawable resource file아래 에 xml 을 res->drawable만들고 이름을 지정하십시오 (예 :checkbox_custom_01.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item 
   android:state_checked="true"   
   android:drawable="@drawable/checkbox_custom_01_checked_white_green_32" />
  <item 
   android:state_checked="false" 
   android:drawable="@drawable/checkbox_custom_01_unchecked_gray_32" />
</selector>

사용자 정의 확인란 이미지 파일 (ipng 권장)을 res->drawable폴더에 업로드하십시오 .

그런 다음 레이아웃 파일로 이동하여 확인란을 다음으로 변경하십시오.

<CheckBox
    android:id="@+id/checkBox1"
    android:button="@drawable/checkbox_custom_01"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:focusable="false"
    android:focusableInTouchMode="false"
    android:text="CheckBox"
    android:textSize="32dip"/>

android:button이전에 생성 한 올바른 XML 파일을 가리키는 한 아무 것도 사용자 정의 할 수 있습니다 .

초보자를위한 참고 사항 : 필수 사항은 아니지만 전체 레이아웃 트리에서 확인란의 이름을 고유 한 ID로 지정하는 것이 좋습니다.


3

Hi 이것은 어두운 테마와 밝은 테마의 테마 코드입니다.

<attr name="buttonsearch_picture" format="reference"/>
<attr name="buttonrefresh_picture" format="reference"/>

<style name="Theme.Light" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowBackground">@color/white</item>
    <item name="android:windowActionBar">false</item>
    <item name="android:textColorPrimary">@color/black</item>
    <item name="android:textColorSecondary">@color/black</item>
    <item name="android:textColor">@color/material_gray_800</item>
    <item name="actionOverflowButtonStyle">@style/LightOverflowButtonStyle</item>
    <item name="buttonsearch_picture">@drawable/ic_search_black</item>
    <item name="buttonrefresh_picture">@drawable/ic_refresh_black</item>
</style>

<style name="Theme.Dark" parent="Theme.AppCompat.NoActionBar">
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowBackground">@color/white</item>
    <item name="android:windowActionBar">false</item>
    <item name="android:textColorPrimary">@color/white</item>
    <item name="android:textColorSecondary">@color/material_gray_500</item>
    <item name="android:textColor">@color/material_gray_800</item>
    <item name="actionOverflowButtonStyle">@style/DarkOverflowButtonStyle</item>
    <item name="buttonsearch_picture">@drawable/ic_search_white</item>
    <item name="buttonrefresh_picture">@drawable/ic_refresh_white</item>
    <item name="android:colorBackground">#ffffff</item>
    <item name="android:alertDialogTheme">@style/LightDialogTheme</item>
    <item name="android:alertDialogStyle">@style/LightDialogTheme</item>
  <!-- <item name="android:textViewStyle">@style/AppTheme.Widget.TextView</item>-->
    <item name="android:popupMenuStyle">@style/PopupMenu</item>
</style>

체크 박스 색상을 변경하려면 "colorAccent"속성이 체크 상태에 사용되고 "android : textColorSecondary"상태 체크에 사용됩니다.

"actionOverflowButtonStyle"은 작업 표시 줄에서 오버플로 아이콘의 색상을 변경하는 데 사용됩니다.

"buttonsearch_picture"속성은 Action Bar에서 Action Button의 색조 색상을 변경하는 데 사용됩니다. style.xml의 사용자 정의 속성입니다.

<attr name="buttonsearch_picture" format="reference"/>

내 앱에서 사용하는 새로 고침 버튼도 마찬가지입니다.

"android : popupMenuStyle"속성은 Dark 테마에서 Light 테마 팝업 메뉴 스타일을 가져 오는 데 사용됩니다.

<style name="PopupMenu" parent="Theme.AppCompat.Light.NoActionBar">
</style>

그리고 이것은 내 Rocks Player 앱에서 사용하는 툴바 코드입니다.

 <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    app:contentInsetStart="0dp"
    android:title="Rocks Player"
    android:layout_width="match_parent"
    android:elevation="4dp"
    android:layout_height="48dp"
    app:layout_scrollFlags="scroll|enterAlways"
    android:minHeight="48dp"
    app:titleTextAppearance="@style/Toolbar.TitleText"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:background="?attr/colorPrimary"
    >
</android.support.v7.widget.Toolbar>

테마 :-

 <style name="AppTheme0" parent="Theme.Light">
    <item name="colorPrimary">#ffffff</item>
    <item name="colorPrimaryDark">#cccccc</item>
    <item name="colorAccent">#0294ff</item>
</style>

<style name="AppTheme1" parent="Theme.Dark">
    <item name="colorPrimary">#4161b2</item>
    <item name="colorPrimaryDark">#4161b2</item>
    <item name="colorAccent">#4161b2</item>
</style>

2

drawable에서 자신의 XML을 만들고 android : background = "@ drawable / your_xml"로 사용할 수 있습니다.

테두리 모서리에 모든 것을 줄 수 있다는 점에서

<item>
    <shape>
        <gradient

            android:endColor="#fff"
            android:startColor="#fff"/>
        <corners
            android:radius="2dp"/>
        <stroke
            android:width="15dp"
            android:color="#0013669e"/>

    </shape>
</item>


1
드로어 블 벡터 그래픽에 대해 아는 것이 좋지만이 답변은 버튼 색조에 대한 OP의 질문에 대답하지 않습니다.
Mike Poole

2

"colors.xml"에서 다음 두 속성을 사용할 수 있습니다.

<color name="colorControlNormal">#eeeeee</color>
<color name="colorControlActivated">#eeeeee</color>

colorControlNormal은 확인란의 일반보기를위한 것이고 colorControlActivated는 확인란을 선택한 경우를위한 것입니다.


1

<CheckBox>에 삽입 하여의 배경색을 변경할 수 있습니다 <LinearLayout>. 그런 다음 <LinearLayout>배경색을 원하는 색으로 변경하십시오 .


문제는 배경이 아닌 체크 박스의 색상에 관한 것입니다.
Zvi

1

아래 코드를 시도해야합니다. 나를 위해 일하고 있습니다.

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/checked" 
          android:state_checked="true">
        <color android:color="@color/yello" />
    </item>
    <!-- checked -->
    <item android:drawable="@drawable/unchecked" 
          android:state_checked="false">
        <color android:color="@color/black"></color>
    </item>
    <!-- unchecked -->
    <item android:drawable="@drawable/checked" 
          android:state_focused="true">
        <color android:color="@color/yello"></color>
    </item>
    <!-- on focus -->
    <item android:drawable="@drawable/unchecked">
        <color android:color="@color/black"></color>
    </item>
    <!-- default -->
</selector>

및 CheckBox

<CheckBox
    Button="@style/currentcy_check_box_style"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="20dp"
    android:text="@string/step_one_currency_aud" />

1

위에서 설명한대로 Android 아이콘을 사용하려는 경우 ..

android:button="@android:drawable/..."

.. 좋은 옵션이지만이 기능을 사용하려면 다음과 같이 확인 표시를 표시하거나 숨기려면 토글 논리를 추가해야합니다.

    checkBoxShowPwd.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {

        // checkbox status is changed from uncheck to checked.
        public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

            int btnDrawable = android.R.drawable.checkbox_off_background;

            if (isChecked)
            {
                btnDrawable = android.R.drawable.checkbox_on_background;
            }

            checkBoxShowPwd.setButtonDrawable(btnDrawable);

        }
    });

음, 이것은 실제로 필요하지 않은 추가 작업입니다. 드로어 블의 xml 파일에서 선택기의 드로어 블 리소스에 대한 참조를 제공합니다. 확인란의 상태에 따라 올바른 드로어 블이 자동으로 배치됩니다.
jkincali

0

대부분의 답변은 xml 파일을 통해 진행됩니다. 대부분의 Android 버전에 대한 능동적 인 답변을 찾고 두 상태에 대해 하나의 색상 만있는 경우 확인 취소를 확인하십시오. 내 솔루션은 다음과 같습니다.

코 틀린 :

val colorFilter = PorterDuffColorFilter(Color.CYAN, PorterDuff.Mode.SRC_ATOP)
CompoundButtonCompat.getButtonDrawable(checkBox)?.colorFilter = colorFilter

자바:

ColorFilter colorFilter = new PorterDuffColorFilter(Color.CYAN, PorterDuff.Mode.SRC_ATOP);
Drawable drawable = CompoundButtonCompat.getButtonDrawable(checkBox);
if (drawable != null) {
    drawable.setColorFilter(colorFilter);
}

-1

프로그래밍 방식으로 색상을 설정하는 훨씬 쉬운 방법이 있습니다. 아래 메소드 Checkbox.setButtonTintList (ColorStateList.valueOf (getContext (). getColor (R.color.yourcolor)))를 사용하십시오.


-2

아래 코드 줄을 사용하여 Java 코드에서 Checkbox의 배경을 동적으로 변경할 수 있습니다.

//Setting up background color on checkbox.
 checkbox.setBackgroundColor(Color.parseColor("#00e2a5"));

이 답변은이 사이트 에서 온 것 입니다 . 이 사이트 를 사용 하여 RGB 색상을 16 진수 값으로 변환 할 수 있습니다 . parseColor를 공급해야합니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.