# ControlP5 buttons - How to make them work
**URL:** https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550
**Category:** Libraries
**Created:** [November 16, 2019, 7:17pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550 "2019-11-16T19:17:16Z")
**Posts on this page:** 6
**Page:** 1
### Author:  [@dawn](https://discourse.processing.org/u/dawn)
#### Post date: [November 16, 2019, 7:17pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/1 "2019-11-16T19:17:16Z")
Hello, Iโm trying to create a photo filter app using controlP5 buttons.
How can I make it work?
I have tried this (thinking how I built a filter app before using the keyboard), but it doesnโt work, seems like I still donโt understand it.
```auto
boolean imgPRCS[] = new boolean [2];
PImage foto;
import controlP5.*;
ControlP5 cp5;
void setup() {
size(550, 550);
noFill();
foto= loadImage("foto.jpg");
foto.resize(width, height);
cp5 = new ControlP5(this);
ButtonBar b = cp5.addButtonBar("bar")
.setPosition(0, 0)
.setSize(550, 20)
.addItems(split("a b c d e f g h i j"," "))
;
println(b.getItem("a"));
b.changeItem("a","text","choose");
b.changeItem("b","text","upload");
b.changeItem("c","text","fliter1");
{
filter(GRAY);}
b.changeItem("d","text","fliter");
b.changeItem("e","text","fliter3");
b.changeItem("f","text","fliter4");
b.changeItem("g","text","fliter");
b.changeItem("h","text","fliter");
b.changeItem("i","text","fliter");
b.changeItem("j","text","fliter");
b.onMove(new CallbackListener(){
public void controlEvent(CallbackEvent ev) {
ButtonBar bar = (ButtonBar)ev.getController();
println("hello ",bar.hover());
}
});
}
void bar(int n) {
println("bar clicked, item-value:", n);
}
void draw() {
background(220);
image(foto, 0, 0);
}
```
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [November 16, 2019, 10:36pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/2 "2019-11-16T22:36:15Z")
you should have posted your code,
so here UNTESTED idea that you missed to make
```auto
void bar(int n) { // __________________ i am called on click
println("bar clicked, item-value:", n);
if ( n == 2 ) filter(GRAY);
if ( n == 3 ) filter(POSTERIZE,3);
//...
}
```
---
### Author:  [@dawn](https://discourse.processing.org/u/dawn)
#### Post date: [November 19, 2019, 10:55pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/3 "2019-11-19T22:55:00Z")
I have tried what you suggest to me! kinda works but only for less than a second when you click it, you can see the filter better if you click the button several times.
Thank you so much for answer my question. I noticed that I had missed out the void bar when I started to read the code. ๐
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [November 20, 2019, 1:19am UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/4 "2019-11-20T01:19:16Z")
> [@dawn](#):
>
> kinda works but only for less than a second when you click it
yes, might need to set some boolean / or one global
```auto
int filtern=0;
void bar(int n) {
filtern = n;
}
```
and use that in draw.
but all that depends on if you need a OPTION BUTTON thinking ( 1 of N )
( see example controlP5 radio button )
or it is possible to have several options true?
---
### Author:  [@dawn](https://discourse.processing.org/u/dawn)
#### Post date: [November 20, 2019, 10:13pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/5 "2019-11-20T22:13:00Z")
Hey! I have just tried it and works perfectly ๐๐
---
### Author:  [@dawn](https://discourse.processing.org/u/dawn)
#### Post date: [November 20, 2019, 10:15pm UTC](https://discourse.processing.org/t/controlp5-buttons-how-to-make-them-work/15550/6 "2019-11-20T22:15:44Z")
Thank you so much for your time.
๐