如何更改CheckBox的颜色?


246

如何更改CheckBoxAndroid中的默认颜色?
默认情况下,CheckBox颜色为绿色,我想更改此颜色。
如果不可能,请告诉我如何进行自定义CheckBox


1
您是否要更改字体的颜色?还是实际盒子的颜色?

1
我改变的实际盒子颜色
Piyush 2014年

72
设置android:buttonTint="@color/mybrown"是更改框颜色的简便方法。
shauvik

6
@Shauvik它只是在材料设计上工作:)
Mucahit

9
@shauvik最好改用它app:buttonTint="@color/mybrown",这样它可以在API <21上运行
Nikaoto

Answers:


187

如果您年minSdkVersion满21岁,请使用android:buttonTint属性更新复选框的颜色:

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

在使用AppCompat库并支持低于21的Android版本的项目中,您可以使用buttonTint属性的compat版本:

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

在这种情况下,如果要子类化,CheckBox请不要忘记使用它AppCompatCheckBox

上一个答案:

您可以CheckBox使用android:button="@drawable/your_check_drawable"属性更改s drawable 。


7
您必须创建自己的可绘制对象。必须有一个更简单的方法……
IgorGanapolsky

14
更改buttonTint颜色是更直接的方法。我们必须使用本机元素,而不是不必要地对其进行自定义。
Neela

3
注意:对于材料设计样式,现在有以下contentControl选项:materialdoc.com/components/selection-controls
SimpsOff,

391

您可以直接在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 '16

8
很好,谢谢!并且不要忘记将xmlns:app =“ schemas.android.com/apk/res-auto ”添加到您的主/父布局中
AlbertoMéndez16年

2
使用“ android.support.v7.widget.AppCompatCheckBox”对我不起作用
Zvi 2013年

1
当您在布局中使用CheckBox时,将自动使用它。编写自定义视图时,您只需要手动使用此类。
奉宰choe

2
如何为选中状态和未选中状态设置2种不同的颜色?
DYS

129

您可以设置复选框的android主题,以在styles.xml中添加所需的颜色add:

<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 '16

@Mulgard很高兴能为您提供帮助!
Amro elaswar '16

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)

它给我带来了意想不到的色彩效果,您确定没有混淆任何东西吗?
基里尔·卡马津

@Carlos这不是一个更好的解决方案,因为在android中,您应该始终尝试在xml文件中设置所有布局内容,而不是通过编程方式设置,除非您需要动态更改它
kyay

@kyay并非“总是” ... Android资源系统是一团糟,通常以编程方式进行操作要容易得多且可维护得多。
nyholku

这有助于分离关注点
kyay,

42

使用buttonTint到按钮和颜色选择的颜色改变为上述21+ 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资源文件夹中。
本杰明·巴斯马奇

18

我建议在Android中使用他的样式方法作为配置内置android视图,在项目中添加新样式的方式:

<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”

希望这可以帮助。


同意此解决方案,这些属性应与默认的内置android组件一起更好地工作,而不会像在上面提到的那样麻烦地在drawable上操作。
Trung Le

1
这是9个月前Amro elaswar回答的重复。
jk7

这是一种真正的解决方案。
Iharob Al Asimi

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的答案中
MTCoster '16

10

styles.xml文件中添加以下行:

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

请用您的示例编辑您的答案,不要发表评论
bish 2015年

4
轻微修正:它的<项目名=” 机器人。:colorAccent> </项目>此外,这是只能从API 21和向上。
user3829751

这会更改colorAccent,这不是要求的内容
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.xmlfrom 复制android-sdk/platforms/android-#(version)/data/res/drawable到项目的drawable文件夹,然后将“ on”和“ off”图像状态更改为自定义图像。
然后您的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%稳健的方法。

就我而言,我没有访问XML布局源文件的权限,因为我是从第三方MaterialDialog库获取Checkbox的。因此,我必须以编程方式解决此问题。

  1. 在xml中创建ColorStateList:

res / color / 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);

PS另外,如果有人感兴趣,可以通过以下方法从MaterialDialog对话框中获取复选框(如果使用设置的话.checkBoxPromptRes(...)):

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

希望这可以帮助。


3

创建一个XML Drawable resource file下,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>

将您的自定义复选框图片文件(我建议为png)上传到您的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

嗨,这是深色主题和浅色主题的主题代码。

<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”属性将用于更改操作栏中操作按钮的颜色。这是style.xml中的自定义属性

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

我在应用程序中使用的刷新按钮也是如此。

“ android:popupMenuStyle”属性用于获取深色主题中的浅色主题弹出菜单样式。

<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关于按钮色彩的问题。
迈克·普尔

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
    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

Java:

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颜色转换为十六进制值,您需要提供parseColor

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.