Background in draw()

edited March 2017 in Questions about Code

I'm writing a simple code where I can drag the mouse around and a color streak will appear on screen where my mouse goes.

`void setup(){
  size(1200, 1200);
  frameRate(30);
}

void draw(){
   background(255);
  //background(random(255), random(255), random(255));
}

void mouseDragged() {
  stroke(random(255), random(255), random(255));
  strokeWeight(random(20));
  line(pmouseX, pmouseY, mouseX, mouseY);
}`

The issue I'm having is with the background in draw(). I do want the background color to continuously load, but I also want the background to change to a new color each time some event is triggered (preferably a mouse release), and continuously load only that color until another trigger occurs. Right now I have the background just set to white.

So to reiterate the program logic:

1)Program starts with background continuously running initial color.

2)Mouse pressed and dragged creating colorful streak.

3)Mouse released triggering background change to new random color.

4)Background continuously runs the new random color.

5)Back to (2).

Answers

  • edited March 2017

    @PRouse -- How long do you want the stroke trace to last?

    1. for one frame
    2. until the mouse is released
    3. forever?

    Don't call background(0) every frame in draw() if you want continuous drawing -- unless you are drawing to a separate PGraphics so that background won't immediately erase it all. Here is one example of strokes that last until the mouse is released, using mouseReleased():

    void setup(){
      size(400, 400);
      background(255);
    }
    
    void draw(){}
    
    void mouseDragged() {
      stroke(random(255), random(255), random(255));
      strokeWeight(random(20));
      line(pmouseX, pmouseY, mouseX, mouseY);
    }
    
    void mouseReleased() {
      background(random(255),random(255),random(255));
    }
    
  • I want the user to be able to drag the streak around until the mouse is released. At the point of release I'd like for the background color to change to a new random color, and then the user can click and drag the streak again.

    With your example the background does change but it only loads once, so the streak leaves a trail when you move like using a paint brush in MS Paint. If you run my original code you can see how the streak works when you click and drag your mouse around (it kind of bounces from one location to the next where you drag). That's the movement I want, but that requires the background color to continuously load. I can do that with a random() function, but then it will load random colors continuously in a flash of colors. I'm trying to get it to load one color at a time, continuously, upon each release of the mouse.

    Example:

    Lets say I run my original code and get a white screen at the start. That's the background function in draw() continuously running background(255, 255, 255). Now I click and drag the color streak around, then release. What I want to happen is the background function in draw() to update to a new random color...lets say background(120, 220, 85). Now it's continuously running that color. So you can click again and drag the streak around, and then release again and get another new random color. I'm just not sure how to do that.

  • Easy. Call background every draw. Change the color it uses every mouseReleased.

    color c;
    
    void setup(){
      size(400, 400);
      c = color(255);
    }
    
    void draw(){
      background(c);
    }
    
    void mouseDragged() {
      stroke(random(255), random(255), random(255));
      strokeWeight(random(20));
      line(pmouseX, pmouseY, mouseX, mouseY);
    }
    
    void mouseReleased() {
      c = color(random(255),random(255),random(255));
    }
    
  • Ah, I see. You just set a global variable, so as to change it everywhere once the mouse is released.

    I should have thought of that from the start. Thank You.

Sign In or Register to comment.