web-dev-qa-db-fra.com

Bouton - Changer la couleur de fond au clic

J'ai 8 boutons dans mon activité. Ce que je recherche, c’est que les boutons ont un arrière-plan par défaut et qu’un clic sur un bouton permet de changer la couleur de l’arrière-plan. Cette partie est assez simple. Mais lorsque je clique sur un autre bouton, la couleur d'arrière-plan du premier bouton redevient la couleur par défaut. Je comprends que cela sera fait en utilisant des "états de sélecteur", mais je ne sais pas trop comment le mettre en œuvre. Plus je lis à ce sujet, plus je suis confus.

Pour le moment, le code XML que j'ai est le suivant: dans un dossier pouvant être dessiné

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">

    <item Android:drawable="@color/blue" Android:state_pressed="true"/>
    <item Android:drawable="@color/dark_grey" Android:state_focused="true"/>  
    <item Android:drawable="@drawable/image_border"/>

 </selector>

drawable/image_border dans le fichier xml est utilisé pour définir la forme du bouton. Ci-dessous, le image_border.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android" >

    <solid Android:color="@color/dark_grey" />

    <stroke
        Android:width="4dp"
        Android:color="@color/light_grey" />

    <padding
        Android:bottom="1dp"
        Android:left="1dp"
        Android:right="1dp"
        Android:top="1dp" />

</shape>

Quelqu'un peut-il m'aider avec la façon de changer le code XML pour qu'il se comporte comme je le souhaite?

[EDIT 1]

Toutes les réponses ci-dessous indiquent une solution similaire. Voici les changements que j'ai apportés. Mais quand même, quand j'appuie sur le bouton, il passe à la couleur spécifiée mais revient immédiatement à la couleur par défaut.

button_background_blue.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">

    <item Android:drawable="@drawable/image_border_blue" Android:state_pressed="true"/>
    <item Android:drawable="@color/dark_grey" Android:state_focused="true"/>  
    <item Android:drawable="@drawable/image_border"/>

 </selector>

image_border_blue.xml

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android" >

    <solid Android:color="@color/blue" />

    <stroke
        Android:width="4dp"
        Android:color="@color/blue" />

    <padding
        Android:bottom="1dp"
        Android:left="1dp"
        Android:right="1dp"
        Android:top="1dp" />

</shape>

Des pensées?

androidxmlandroid-selector
10
Vamsi Challa

Créez une forme nommée button_pressed.xml comme suit ....

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">

    <solid Android:color="@color/blue" />

    <stroke
        Android:width="4dp"
        Android:color="@color/blue" />

    <padding
        Android:bottom="1dp"
        Android:left="1dp"
        Android:right="1dp"
        Android:top="1dp" />

</shape>

Supposons que vous ayez un bouton de remorquage dont les ids sont R.id.btn et R.id.btn1 comme suit ...

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

    <Button
        Android:id="@+id/btn"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="12dp"
        Android:background="@drawable/button_pressed"
        Android:onClick="onClick"
        Android:text="Press Me 1" />

    <Button
        Android:id="@+id/btn2"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="12dp"
        Android:background="@drawable/button_pressed"
        Android:onClick="onClick"
        Android:text="Press Me 2" />

</LinearLayout>

Ecrivez la méthode onClick() comme suit ... ce qui vous permettra de conserver la couleur modifiée jusqu'à ce qu'un autre bouton soit enfoncé.

Button button;

public void onClick(View v) {

    Drawable dr = getResources().getDrawable(R.drawable.button_pressed);
    dr.setColorFilter(Color.parseColor("#FF0000"), PorterDuff.Mode.SRC_ATOP);

    switch (v.getId()) {
    case R.id.btn:

        if (button == null) {
            button = (Button) findViewById(v.getId());
        } else {
            button.setBackgroundResource(R.drawable.button_pressed);
            button = (Button) findViewById(v.getId());
        }
        button.setBackgroundDrawable(dr);

        break;

    case R.id.btn2:
        if (button == null) {
            button = (Button) findViewById(v.getId());
        } else {
            button.setBackgroundResource(R.drawable.button_pressed);
            button = (Button) findViewById(v.getId());
        }
        button.setBackgroundDrawable(dr);

        break;

    default:
        break;
    }
}

Je pense que maintenant vous obtiendrez ce que vous vouliez faire.

8
Hamid Shatu

utilisez ce sélecteur et placez-le dans le dossier pouvant être dessiné et définissez l’arrière-plan du bouton sur ce sélecteur.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">

<item Android:drawable="@color/blue" Android:state_pressed="true"/>
<item Android:drawable="@color/AliceBlue" Android:state_focused="true"/>  
<item Android:drawable="@color/Azure"/>

 </selector>

OU Vous pouvez utiliser Color au lieu de Background . espérons que cela vous aidera.

12
i.n.e.f

Je vous suggère ce sélecteur.

Créez simplement un fichier selector.xml simple dans un dossier pouvant être dessiné, puis ajoutez le sélecteur à votre bouton sous la forme Android:background="@drawable/selector" ou par le code suivant: yourButton.setBackground(getResources().getDrawable(R.drawable.selector));

selector.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:state_enabled="true"
        Android:state_pressed="true" Android:drawable="@Android:color/holo_blue_light" />
    <item Android:state_enabled="true"
        Android:state_focused="true" Android:drawable="@Android:color/holo_green_dark" />
    <item Android:state_enabled="true"
        Android:state_selected="true" Android:drawable="@Android:color/holo_purple" />
    <item
        Android:drawable="@drawable/yourdrawable" />
</selector>

Le premier élément est pour pressed, le second pour focused et le dernier est pour selected état.

8
Stefano Munarini

changement de couleur d'arrière-plan dans la présentation lorsque vous cliquez sur le bouton de couleur correspondant dans Android

main_layout.xml 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:orientation="vertical"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:background="#b056ff"
    Android:id="@+id/l1">
    <Button
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:id="@+id/b1"
        Android:layout_gravity="center"
        Android:text="RED"/>
    <Button
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:id="@+id/b2"
        Android:layout_gravity="center"
        Android:text="GREEN" />
    <Button
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:id="@+id/b3"
        Android:layout_gravity="center"
        Android:text="BLUE"/>

MyActivity.Java 

package ram.Android.com.cwp1;

import Android.app.Activity;
import Android.graphics.Color;
import Android.net.Uri;
import Android.os.Bundle;
import Android.view.View;
import Android.widget.Button;
import Android.widget.LinearLayout;

import com.google.Android.gms.appindexing.Action;
import com.google.Android.gms.appindexing.AppIndex;
import com.google.Android.gms.common.api.GoogleApiClient;

/**
 * Created by VENKATESH on 10-Jun-16.
 */
public class MyActivity extends Activity implements View.OnClickListener {
    /**
     * ATTENTION: This was auto-generated to implement the App Indexing API.
     * See https://g.co/AppIndexing/AndroidStudio for more information.
     */
    Button r, g, b;
    LinearLayout ll;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_layout);
        ll = (LinearLayout) findViewById(R.id.l1);
        r = (Button) findViewById(R.id.b1);
        g = (Button) findViewById(R.id.b2);
        b = (Button) findViewById(R.id.b3);
        r.setOnClickListener(this);
        g.setOnClickListener(this);
        b.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.b1:
                ll.setBackgroundColor(Color.RED);
                break;

            case R.id.b2:
                ll.setBackgroundColor(Color.GREEN);
                break;
            case R.id.b3:
                ll.setBackgroundColor(Color.BLUE);
                break;

        }

    }
}
1
Ramakrishna

Je sais que c'est très tard, mais j'espère que quelqu'un trouvera l'utile ... J'ai une solution très simple, que j'ai utilisée dans mon application et qui fonctionne à merveille.

Permettez-moi d'expliquer la logique, 1. Gardez une trace de 2 clics de bouton - le bouton précédent a été cliqué et le bouton actuel a été cliqué. J'utilise ArrayList 2. Pour chaque clic de bouton, continuez à mettre à jour la valeur des clics de bouton précédents et actuels dans ArrayList . 3. change la couleur de fond du bouton précédent sur lequel vous avez cliqué . 4. changer la couleur de fond du bouton en cours cliqué.

J'espère que la logique est simple et directe.

Voici la mise en place

xml

<Button
            Android:onClick="onClickRosterDay"
            Android:text="Mon"
            Android:textColor="@color/textColorWhite"
            Android:background="@color/colorAccent"
            Android:id="@+id/rosterMonday"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content" />

la méthode OnClick est définie pour chaque bouton dans XML, dans l'exemple, il s'agit de onClickRosterDay

Java 

 //buttons 

    Button rosterMonday;
    Button rosterTuesday;
    Button rosterWednesday;
    Button rosterThursday;
    Button rosterFriday;
    Button rosterSaturday;

    //ArrayList to track button clicks
    private ArrayList<Button> buttonClickedDay;

    in OnCreate

    buttonClickedDay = new ArrayList<>();
    // to start with these are the default clicks. 
    buttonClickedDay.add(rosterMonday ); //previous button clicked
    buttonClickedDay.add(rosterMonday ); // current button clicked



    public void onClickRosterDay(View v) {
            switch (v.getId()){
                case R.id.rosterMonday:
                    daySelected = "MONDAY";
                    // move current click button to previous button clicked position
                    buttonClickedDay.set(0, buttonClickedDay.get(1)); 
                    // update current clicked position
                    buttonClickedDay.set(1,rosterMonday);
                    break;

                case R.id.rosterTuesday:
                    daySelected = "TUESDAY";
                    buttonClickedDay.set(0, buttonClickedDay.get(1));
                    buttonClickedDay.set(1,rosterTuesday);
                    break;

                case R.id.rosterWednesday:
                    daySelected = "WEDNESDAY";
                    buttonClickedDay.set(0, buttonClickedDay.get(1));
                    buttonClickedDay.set(1,rosterWednesday);
                    break;

                case R.id.rosterThursday:
                    daySelected = "THURSDAY";
                    buttonClickedDay.set(0, buttonClickedDay.get(1));
                    buttonClickedDay.set(1,rosterThursday);
                    break;

                case R.id.rosterFriday:
                    daySelected = "FRIDAY";
                    buttonClickedDay.set(0, buttonClickedDay.get(1));
                    buttonClickedDay.set(1,rosterFriday);
                    break;

                case R.id.rosterSaturday:
                    daySelected = "SATURDAY";
                    buttonClickedDay.set(0, buttonClickedDay.get(1));
                    buttonClickedDay.set(1,rosterSaturday);
                    break;
            }





        if(buttonClickedDay.get(0) != buttonClickedDay.get(1)) {
            // update background color of  previous button clicked    
buttonClickedDay.get(0).setBackgroundColor(this.getResources().getColor(R.color.colorAccent));
            // update background color of  current button clicked      
buttonClickedDay.get(1).setBackgroundColor(this.getResources().getColor(R.color.textBackgroundGreen));
        }
    }
0
tanni tanna