ControlP5 buttons - How to make them work

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.

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);
}
1 Like

you should have posted your code,
so here UNTESTED idea that you missed to make

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);
  //...
}
2 Likes

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. :sweat_smile:

yes, might need to set some boolean / or one global

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?

1 Like

Hey! I have just tried it and works perfectly :smile::ok_hand:

1 Like

Thank you so much for your time.
:raised_hands: