OSC and ControlP5 Libraries working together

I am writing a sketch that uses the ControlP5 and OSC libraries. I want to have control over something using theControlP5 GUI in Processing. I also want to have a fader on my mobile device change the y-position through OSC.

My question is how can I route the OSC signal into ControlP5 so that the GUI fader is updated as I use the mobile interface?

Otherwise I would end up changing a variable in the sketch without updating the GUI.

I hope my question is clear.

oscP5: http://www.sojamo.de/libraries/oscp5/ controlP5: http://www.sojamo.de/libraries/controlP5/

Tagged:

Answers

  • edited May 2015 Answer ✓

    Hi, when an OSC message is received by oscEvent(OscMessage) then get the instance of a controller by calling

    Controller c = cp5.getController("slider");

    to change the value of the Controller, call setValue(). lets assume your OSC message carries a float as its first argument, then use the following

    float f = m.get(0).floatValue(); // m is of instance OscMessage
    c.setValue(f);
    

    to set the position of a controller, use the same method but instead of calling setValue(f), call setPosition(x,y).

  • Okay sweet, so you can set the value. I think this will provide a way to so it. I will try and construct a working sketch and explore this path.

    Thank you for the advice and thank you for contributing the excellent libraries!

  • Got it, I was able to use the keyboard. But I can see how this would extend to any command. I would imagine you can set other parameters this way like position and all that? Wow, very cool. Going to do the button version next.

    // Setting a value for ControlP5 Slider with a keyboard
    
    import controlP5.*;
    
    ControlP5 cp5;
    
    int slider;
    
    void setup() {
      size(320, 240);
    
      cp5 = new ControlP5(this);
    
      cp5.addSlider("slider")
        .setPosition(20, 20)
          .setRange(0, width)
            .setSize(100, 20)
              ;
    }
    
    void draw() {
      rectMode(CENTER);
      background(0);
      fill(128, 0, 0);
      stroke(128);
      strokeWeight(5);
      line(slider, 0, slider, height);
    
      if (keyPressed) {
        if (key == 's') {
          Controller c = cp5.getController("slider");
          c.setValue(100);
          rect(width/2, height/2, 40, 40);
        }
      }
    }
    
  • And a toggle button...

    // Setting a state for ControlP5 Toggle with a keyboard
    
    import controlP5.*;
    
    ControlP5 cp5;
    
    boolean button;
    
    void setup() {
      size(320, 240);
    
    
      cp5 = new ControlP5(this);
      cp5.addToggle("button")
        .setPosition(20, 20)
          .setSize(50, 20)
            .setMode(ControlP5.SWITCH)
              ;
    }
    
    void draw() {
      rectMode(CENTER);
      background(0);
      fill(128, 0, 0);
      stroke(128);
      strokeWeight(5);
    
      if (button == true) {
        rect(width/2, height/4, 80, 40);
      }
    
      // Instructions
      fill(128);
      text("press the 's' key to change the button state", 20, height - 20);
    }
    
    // Used released so that holding a key down too long did not 
    // cause it to rapidly change states if you hold it down longer
    // than a single frame.
    void keyReleased() {
      if (key == 's') {
        if (button == true) {
          button = false;
          Controller c = cp5.getController("button");
          c.setValue(0);
          noStroke();
          fill(0, 128, 0);
          rect(width/2, height/2, 80, 10);
        } else {
          button = true;
          Controller c = cp5.getController("button");
          c.setValue(1);
          noStroke();
          fill(0, 128, 0);
          rect(width/2, height/2 + 40, 80, 10);
        }
      }
    

    }

  • edited May 2015

    @sojam When I get a lot of sliders and buttons and try to setValue(x) in the setup() function I sometimes am not able to load negative numbers. Is there any way to hard set this?

    EDIT I found you had to make a separate variable if you want to have it be loaded in draw(). I think it's time to learn about the saving values feature.

    Thanks again,

Sign In or Register to comment.