ON/OFF Image Button

Programming Questions

ariffinas..

in Programming Questions • 1 year ago

Hi All forum friends,

I'm a beginner on processing and noob ^_^. My question related to this ImageButton examples. How can i make the button become ON or OFF button, what is the programming. Ive seen on many site they using the Boolean function, but i don't understand it. What i want is, when the image button is not pressed its stayed on OFF position and image shows OFF image, when pressed its stayed on ON position and image shows ON image and when pressed it again its on OFF position again and image shows OFF image. This examples ImageButton not as i want, when i release my mouse it also release it.

Please help me,

Thanks.

Replies(8)

Jesse Sco..

Re: ON/OFF Image Button

1 year ago

Well, a boolean has either two states - ON or OFF (1 or 0 if you like)...

What you would want to do, is declare two separate images and your boolean:

PImage onImg;

PImage offImg;

boolean onOff = false;

Then load them in your setup:

onImg = loadImage(...);

offImg = loadImage(...);

Then, in your case, you want to switch on a mouse action - say mousePressed(). You can do this as a separate function outside of setup and draw:

void mousePressed() {

onOff != onOff // this switches it to the opposite state

println(onOff); // just to check...

}

Somewhere in your draw, you want to use a if/else conditional, to display the two separate images depending on your boolean:

if(onOff == true) {

image(onImg, 0, 0);

} else {

image(offImg, 0, 0);

}

That make sense ?

ariffinas..

Re: ON/OFF Image Button

1 year ago

Thanks Jesse Scott,

I appreciate that, I've tried it on processing just now. I copy the code you've given n paste it on processing and its says syntax error at "println(onOff); // just to check...", I'm so sorry i don't understand it. I've found this sample ARRAY OF BUTTON OBJECTS, from learningprocessing.com, its exactly what I want, but it is only a rectangle sketch not an image. And also it using "for" function. i don't yet really understand about "for" function. Can u make it single function for me rather than using "for" function?

Thanks.

dr.mo

Re: ON/OFF Image Button

1 year ago

synax error because you forgot a semi-colon behind "onOff != onOff" and anyway that should be "onOff = !onOff;"

ariffinas..

Re: ON/OFF Image Button

1 year ago

When I put semicolon after "onOff != onOff" its says, Syntax error on token "!=", invalid AssignmentOperator.

Jesse Sco..

Re: Re: ON/OFF Image Button

1 year ago

Right. Read Dr Mo's comment, I typed it wrong... change != to =! ....

ariffinas..

Re: ON/OFF Image Button

1 year ago

I'm so sorry, dr.mo. i really not see you also mention about the "!", from != to =!. Thousand thank you to you both, the program is success now.

But, I have a multiple image. I tried to copy and paste the code and make the "boolean onOff2", "PImage onImg2" and all same, i put no 2 at the back to sign it as second button. But, its not became as i want. Only the first button run properly, the second button always shows ON Image. How to make multiple button?

Jesse Sco..

Re: Re: ON/OFF Image Button

1 year ago

Can you show your code?

ariffinas..

Re: ON/OFF Image Button

1 year ago

Hi All.

tQ, to all who hv been helping me on this.

Ive done the programming with success.

Top Reply