How to make a slider stay inside the box and go either direction and display a value from 0 to 1000?

Here's what I got so far, I couldn't figure out what to do:

void draw() {

    fill(0);
    rect(39, 124, 255, 60);
    fill(255, 0, 0);
    rect(39+255+value, 124, 20, 60);


}

void mouseDragged() {
  value = value - 1;
  if (value > 255) {
    value = 0;
  }
}
Tagged:

Answers

  • @Sandyjakes --

    Here are two relevant examples related to constraining the mouse within a region:

    ...and changing the output based on the mouse value:

  • could you please provide me with some cod, so I can further understand what you are saying?

  • Check this. Please refer to the reference for the different functions provided next.

    Kf

    final int minX=39;
    final int maxX=255+minX;
    
    final int sliderWidth=20;
    
    int value=maxX;
    
    void setup(){
     size(400,400); 
     rectMode(CORNERS);
    }
    
    void draw() {
    
        fill(0);
        rect(minX, 124, maxX+sliderWidth, 60);
        fill(255, 0, 0);
        rect(value, 124, value+sliderWidth, 60);
    }
    
    void mouseDragged() {
      value +=mouseX-pmouseX;
      value=constrain(value,minX,maxX);
    }
    
  • Answer ✓
    final int minX=39;
    final int maxX=255+minX;
    
    final int sliderWidth=20;
    
    int value=maxX;
    
    void setup() {
      size(900, 400); 
      rectMode(CORNERS);
    }
    
    void draw() {
      background(111); 
      fill(0);
      rect(minX, 124, maxX+sliderWidth, 60);
      fill(255, 0, 0);
      rect(value, 124, value+sliderWidth, 60);
    
      fill(255);
      text(map(value, minX, maxX, 0, 1000), 33, height-22);
    }
    
    void mouseDragged() {
      value +=mouseX-pmouseX;
      value=constrain(value, minX, maxX);
    }
    
Sign In or Register to comment.