Comment changer la couleur d'une Case à cocher?
Comment changer la couleur par défaut CheckBox
dans Android?
Par défaut, la couleur CheckBox
est verte, et je veux changer cette couleur.
Si ce n'est pas possible, dites-moi comment faire une coutume CheckBox
?
18 réponses
Vous pouvez modifier CheckBox
s dessinés à l'aide de android:button="@drawable/your_check_drawable"
attribut.
Vous pouvez colorier directement dans le xml. Utilisez buttonTint pour la boîte: (à partir du niveau de L'API 23)
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:buttonTint="@color/CHECK_COLOR" />
Vous pouvez également le faire en utilisant appCompatCheckbox v7 pour les anciennes API:
<android.support.v7.widget.AppCompatCheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:buttonTint="@color/COLOR_HERE" />
Vous pouvez définir le thème android de la case à cocher pour obtenir la couleur que vous voulez dans vos styles.ajouter xml:
<style name="checkBoxStyle" parent="Base.Theme.AppCompat">
<item name="colorAccent">CHECKEDHIGHLIGHTCOLOR</item>
<item name="android:textColorSecondary">UNCHECKEDCOLOR</item>
</style>
Puis dans votre fichier de mise en page:
<CheckBox
android:theme="@style/checkBoxStyle"
android:id="@+id/chooseItemCheckBox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
Contrairement à l'utilisation de android:buttonTint="@color/CHECK_COLOR"
cette méthode fonctionne sous Api 23
Version programmatique:
int states[][] = {{android.R.attr.state_checked}, {}};
int colors[] = {color_for_state_checked, color_for_state_normal}
CompoundButtonCompat.setButtonTintList(checkbox, new ColorStateList(states, colors));
Utilisez buttonTint et le sélecteur de couleur
<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"/>
Res / couleurs / 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>
<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" />
Ajoutez cette ligne dans votre fichier styles.xml
:
<style>
<item name="android:colorAccent">@android:color/holo_green_dark</item>
</style>
Je suggère d'utiliser l'approche de style he Dans android comme moyen de configurer les vues Android intégrées, ajouter un nouveau style dans votre projet:
<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>
Et ajouter attribuez ce style au thème de la case à cocher: android: Thème=" @ style / youStyle "
J'espère que cela aide.
Moi face au même problème, j'ai eu une solution en utilisant ci-dessous technique. Copiez le btn_check.xml
de android-sdk/platforms/android-#(version)/data/res/drawable
dans le dossier dessinable de votre projet et modifiez les États d'image' on 'et' off ' en images personnalisées.
Ensuite, votre xml aura juste besoin de android:button="@drawable/btn_check"
<CheckBox
android:button="@drawable/btn_check"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true" />
Si vous souhaitez utiliser différentes icônes Android par défaut, vous pouvez utiliser:
android:button="@android:drawable/..."
ButtonTint travaillé pour moi essayer
Android:buttonTint="@couleur/blanc"
<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"/>
Vous pouvez créer votre propre xml dans drawable et l'utiliser comme android: background= "@drawable/your_xml "
En ce que vous pouvez tout donner à border corner
<item>
<shape>
<gradient
android:endColor="#fff"
android:startColor="#fff"/>
<corners
android:radius="2dp"/>
<stroke
android:width="15dp"
android:color="#0013669e"/>
</shape>
</item>
Salut C'est le code de thème pour le thème sombre et le thème léger.
<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>
Si vous voulez changer la couleur de la case à cocher, l'attribut "colorAccent "utilisera pour l'état vérifié et" android:textColorSecondary " utilisera pour décocher l'état.
"actionOverflowButtonStyle" utilisera pour changer la couleur de l'icône de débordement dans la barre d'Action.
Attribut"buttonsearch_picture" utilisera pour changer la couleur de teinte du bouton D'Action dans la barre d'Action.C'est un attribut personnalisé dans style.xml
<attr name="buttonsearch_picture" format="reference"/>
La même chose est pour le bouton d'actualisation que j'utilise dans mon application.
Attribut"android:popupMenuStyle" utilise pour obtenir le style de menu contextuel thème léger dans le thème sombre.
<style name="PopupMenu" parent="Theme.AppCompat.Light.NoActionBar">
</style>
Et c'est le Code de la barre d'outils que j'utilise dans mon application 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>
Thèmes:-
<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>
Nous pouvons changer la couleur de la case à cocher en utilisant la ligne de code singe
Android: buttonTint=" @ color / app_color " / / quelle que soit la couleur
Vous pouvez changer la couleur d'arrière-plan du <CheckBox>
en l'intégrant dans un <LinearLayout>
. Ensuite, changez la couleur d'arrière-plan de <LinearLayout>
à la couleur que vous voulez.
Si vous allez utiliser les icônes android, comme décrit ci-dessus ..
android:button="@android:drawable/..."
.. c'est une bonne option , mais pour que cela fonctionne-j'ai trouvé que vous devez ajouter une logique à bascule pour afficher / masquer la coche, comme ceci:
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);
}
});
Créez un fichier xml Drawable resource file
sous res->drawable
et nommez-le, par exemple 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>
Téléchargez vos fichiers d'image de case à cocher personnalisés (je recommande png) dans votre dossier res->drawable
.
Ensuite, allez dans votre fichier de mise en page et modifiez votre case à cocher
<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"/>
Vous pouvez personnaliser n'importe quoi, tant que android:button
pointe vers le bon fichier XML que vous avez créé auparavant.
NOTE aux débutants: bien que ce ne soit pas obligatoire, il est néanmoins recommandé de nommer votre case à cocher avec un identifiant unique tout au long de votre arbre de mise en page entière.
Vous pouvez utiliser les deux propriétés suivantes dans " couleurs.xml "
<color name="colorControlNormal">#eeeeee</color>
<color name="colorControlActivated">#eeeeee</color>
ColorControlNormal est pour la vue normale de la case à cocher, et colorControlActivated est pour lorsque la case à cocher est cochée.
Vous devriez essayer le code ci-dessous. Il est travaillé pour moi.
<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>
Et Case À Cocher
<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" />