ImageButton - toggle color when pressed

Question

How can i toggle the color of an ImageButton when user presses the ImageButton?

I want the ImageButton to toggle between red (power off) and green (power) when pressed.

Code:

    ImageButton star, power;
Intent i;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    star = (ImageButton)findViewById(R.id.ibStar);
    star.setOnClickListener(this);

    power = (ImageButton)findViewById(R.id.ibPower);
    power.setOnTouchListener(this);


}

public boolean onTouch(View v, MotionEvent event) {
    if (event.getAction() == MotionEvent.ACTION_DOWN ) {
        power.setImageResource(R.drawable.power);

    }
     else if (event.getAction() == MotionEvent.ACTION_UP ) {
        power.setImageResource(R.drawable.power_off);

    }

    return true;
}

I'm afraid you have to clarify what exactly is your problem. It's hard to understand what you want to return. — Andrzej Gis, Aug 16 '12 at 19:28
After pressing the button changes to green - It works. By pressing again, I want it to be red (power_off) — Silesia, Aug 16 '12 at 19:30

Andrzej Gis · Accepted Answer · 2012-08-16T19:45:49.527

2

I think this is what you need.

ImageButton star, power;
Intent i;
boolean isOn=false;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    star = (ImageButton)findViewById(R.id.ibStar);
    star.setOnClickListener(this);

    power = (ImageButton)findViewById(R.id.ibPower);
    power.setOnTouchListener(this);


}

public boolean onTouch(View v, MotionEvent event) {
    if (event.getAction() == MotionEvent.ACTION_DOWN ) {
        isOn=!isOn; // change its state to the oposite one

        if(isOn)
            power.setImageResource(R.drawable.power);
        else
            power.setImageResource(R.drawable.power_off);
    }

    return true;
}

edited Aug 16 '12 at 19:45

answered Aug 16 '12 at 19:36

Andrzej Gis

13,706
14
86
130

My code works the same way. I mean here is that when I click the back button again to return to the color red – Silesia Aug 16 '12 at 19:44
@Silesia now it should be fine. – Andrzej Gis Aug 16 '12 at 19:46

prolink007 · Answer 2 · 2012-08-16T19:47:00.983

1

Try using the OnClickListener instead of the OnTouch. There are a few ways you can handle this situation.

One way is to have a boolean that toggles between true and false signifying if the power is on or off. And then check that value when the ImageButton is pressed and change the color of the ImageButton accordingly.

/* The boolean below is
 * declared in the 
 * class and not in a method. 
 * Whatever default value you need, i assumed false. */
private boolean isPowerOn = false;

power = (ImageButton)findViewById(R.id.ibPower);
power.setOnClickListener(new OnClickListener() {
    @Override
        public void onClick(View v) {
            if (isPowerOn) {
                /* set color to red */
                isPowerOn = false;
            } else {
                /* set power to green */
                isPowerOn = true;
            }
        }
    });

OR

You can check the color of the ImageButton when it is pressed and then change the color accordingly. This way seems a little funky. Use the boolean method.

edited Aug 16 '12 at 19:47

answered Aug 16 '12 at 19:36

prolink007

33,872
24
117
185

I mean the button only After pressing the button changes to green - It works. By pressing again, I want it to be red (power_off) – Silesia Aug 16 '12 at 19:38
Yeah, i read your comment above and changed your question. Your question is easier to understand now. – prolink007 Aug 16 '12 at 19:41
My code works the same way. I mean here is that when I click the back button again to return to the color red – Silesia Aug 16 '12 at 19:45
1

Updated my answer with your new information, let me know if you have any questions. – prolink007 Aug 16 '12 at 19:47

score 0 · Answer 3 · edited May 23 '17 at 12:04

If you want to have the button press event show a different color (i.e. during the press event), use a selector, like shown at Button Background Selector.

If you want to have the button color toggle between red and green after an onClick event, then use an onClickListener() (pseudo-code):

onClick(ImageButton ib)
{
 if (button is green)
  ib.setImageResource(red)
 else
  ib.setImageResource(green)
}

ImageButton - toggle color when pressed

3 Answers3