Error moving object (using quad())

kenkt · May 25, 2023, 6:49am

I want this object moving by mouse x and mouse y, but this code error. anybody, can help me?

That’s my code:


void setup() {
size (700,700);
}

void draw() {
background(255);
quad(mouseX+1,mouseY-5,mouseX+75,mouseY+70,mouseX+10+mouseY+80,mouseX+1,mouseY+85);
}

Chrisir · May 25, 2023, 7:42am

size (700,700);
background(255);

quad( mouseX+1,mouseY-5,
  mouseX+75,mouseY+70,
  mouseX+10+mouseY+80,mouseX+1,
  mouseY+85, ...... );

I think that’s because you pass 7 parameters instead of 8

Please add one parameter

I like to place line breaks between parameters so you can see the 4 pairs directly

(that you pass int instead of float is not the problem I guess, I am not on my computer right now and can’t test it though)

kenkt · May 25, 2023, 8:04am

What is parameter? Sorry, I don’t know and dots at the end should be filled?

Chrisir · May 25, 2023, 8:19am

Yeah, the 8 entries you pass to the function quad
are the parameters

The dots represent the 8th parameter

Parameters are separated by comma ,

The dots shall be filled, try mouseX

kenkt · May 25, 2023, 8:31am

Thanks for the explanation, it worked! And, how to keep the shape from changing? because after I try, the shape changes

Chrisir · May 25, 2023, 8:39am

The shape changes 60 times per second when you move the mouse

There are different ways to change this

For example you store your parameters
in variables or a list when you press a mouse button

Chrisir · May 25, 2023, 9:17am

You can also say

if(mousePressed)
noLoop();

if(keyPressed)
loop();

Both in draw() function

kenkt · May 25, 2023, 10:04am

Oh I see, thanks a lot! I will try it

glv · May 25, 2023, 10:05am

Hello @kenkt ,

There are resources here:

One example:

:)

Chrisir · May 25, 2023, 12:06pm

you can use a list of floats:

float[] list = new float[8];

void setup() {
  size (700, 700);
}

void draw() {
  background(255);

  list = new float[8];


  list[0]=mouseX+1;
  list[1]=mouseY-5;


  list[2]=mouseX+75;
  list[3]=mouseY+70;

  list[4]=mouseX+10+mouseY+80;
  list[5]=mouseX+1;

  list[6]=mouseY+85;
  list[7]=mouseX;

  drawQuad(list);
}

void drawQuad(float[] list_) {
  quad(list[0], list[1],
    list[2], list[3],
    list[4], list[5],
    list[6], list[7]
    );
}

Let’s put the storing in a function too


float[] list = new float[8];

void setup() {
  size (700, 700);
}

void draw() {
  background(255);

  storeQuad();
  drawQuad(list);
}

// ---------------------------------------------------------

void storeQuad() {

  list[0]=mouseX+1;
  list[1]=mouseY-5;


  list[2]=mouseX+75;
  list[3]=mouseY+70;

  list[4]=mouseX+10+mouseY+80;
  list[5]=mouseX+1;

  list[6]=mouseY+85;
  list[7]=mouseX;
}

void drawQuad(float[] list_) {
  quad(list[0], list[1],
    list[2], list[3],
    list[4], list[5],
    list[6], list[7]
    );
}

Next version

You can store forms/quads in a list on mouse click

here you can display multiple forms:

float[] list = new float[8];

// Two parallel ArrayLists
ArrayList<float[]> listOfQuads = new ArrayList();
ArrayList<Integer> listOfColors = new ArrayList(); // for Color 

void setup() {
  size (700, 700);
}

void draw() {
  background(255);

  int i=0;
  for (float[] floatList : listOfQuads) {
    fill(listOfColors.get(i));
    drawQuad(floatList);
    i++;
  }//for

  noFill();
  storeQuad();
  drawQuad(list);
}//func

// ---------------------------------------------------------

void mousePressed() {
  listOfQuads.add(copyList(list));
  listOfColors.add(color(random(255), 0, 0));
}

float[] copyList(float[] list_) {
  float[] l1=new float [8];

  int i=0;
  for (float floatValue : list_) {
    l1[i]=floatValue;
    i++;
  }
  return l1;
}

void storeQuad() {
  list[0]=mouseX+1;
  list[1]=mouseY-5;


  list[2]=mouseX+75;
  list[3]=mouseY+70;

  list[4]=mouseX+10+mouseY+80;
  list[5]=mouseX+1;

  list[6]=mouseY+85;
  list[7]=mouseX;
}

void drawQuad(float[] list_) {
  quad(list_[0], list_[1],
    list_[2], list_[3],
    list_[4], list_[5],
    list_[6], list_[7]
    );
}

Code a bit simplified


// draws quads according to mouse pos; click mouse to store the current quad.

float[] list = new float[8];

// Two parallel ArrayLists
ArrayList<float[]> listOfQuads  = new ArrayList();
ArrayList<Integer> listOfColors = new ArrayList();  // for Color 

// ---------------------------------------------------------

void setup() {
  size (700, 700);
}

void draw() {
  background(255);

  // draw old quads
  drawExistingQuads();

  // the current quad
  noFill();
  storeQuad();
  drawQuad(list);
}//func

// ---------------------------------------------------------

void mousePressed() {
  // store current quad
  listOfQuads.add(list.clone());  // using clone() here
  listOfColors.add(color(random(255), 0, 0));
}

// ---------------------------------------------------------

void drawExistingQuads() {
  // draw old quads
  int i=0;
  for (float[] floatList : listOfQuads) {
    fill(listOfColors.get(i));
    drawQuad(floatList);
    i++;
  }//for
}//func

void storeQuad() {
  // current quad
  list[0]=mouseX+1;
  list[1]=mouseY-5;


  list[2]=mouseX+75;
  list[3]=mouseY+70;

  list[4]=mouseX+10+mouseY+80;
  list[5]=mouseX+1;

  list[6]=mouseY+85;
  list[7]=mouseX;
}

void drawQuad(float[] list_) {
  // draw the quad indicated by list_
  quad(
    list_[0], list_[1],
    list_[2], list_[3],
    list_[4], list_[5],
    list_[6], list_[7]
    );
}
//

Minor changes



// draws quads according to mouse pos; click mouse to store the current quad.

// the current quad
float[] list = new float[8];

// Two parallel ArrayLists store the quad
ArrayList<float[]> listOfQuads  = new ArrayList();
ArrayList<Integer> listOfColors = new ArrayList();

// ---------------------------------------------------------

void setup() {
  size (700, 700);
}//func

void draw() {
  background(255);

  // draw old quads
  drawExistingQuads();

  // the current quad
  noFill();
  storeQuad(list);
  drawQuad(list);
}//func

// ---------------------------------------------------------

void mousePressed() {
  // store current quad
  listOfQuads.add(list.clone());
  listOfColors.add(color(random(255), random(255), random(255)));
}//func

// ---------------------------------------------------------

void drawExistingQuads() {
  // draw old quads - using both ArrayLists
  int i=0;
  for (float[] floatList : listOfQuads) {
    fill(listOfColors.get(i));
    drawQuad(floatList);
    i++;
  }//for
}//func

void storeQuad(float[] list_) {
  // current quad
  list_[0]=mouseX+1;
  list_[1]=mouseY-5;


  list_[2]=mouseX+75;
  list_[3]=mouseY+70;

  list_[4]=mouseX+10+mouseY+80;
  list_[5]=mouseX+1;

  list_[6]=mouseY+85;
  list_[7]=mouseX;
}//func

void drawQuad(float[] list_) {
  // draw the quad indicated by list_
  quad(
    list_[0], list_[1],
    list_[2], list_[3],
    list_[4], list_[5],
    list_[6], list_[7]
    );
}//func
//

glv · May 25, 2023, 11:33pm

You original code:
mouseX+10+mouseY+80

Did you intend to add these?
If you change the + in the middle to a , you have your 8 parameters and the shape moves with mouse but does not change.

:)

kenkt · May 26, 2023, 3:59am

thanks again for the help! I don’t know what to repay you with other than thanks. hope your days are fun!

kenkt · May 26, 2023, 4:02am

Thanks for the explanation! I will try it

Chrisir · May 26, 2023, 7:10am

Maybe that what glv said is what you really meant.

Then I misunderstood you. nvm

Chrisir · May 26, 2023, 7:11am

You can also use rect () and rectMode(CENTER);

kenkt · May 26, 2023, 2:42pm

no problem, thank you!

Topic		Replies	Views
[SOLVED] I'm failing at drawing multiple quads in a loop Coding Questions	7	814	August 17, 2018
Shape has weird behavior with 4 parameters Coding Questions	1	245	November 2, 2019
Quad() gets drawn twice Coding Questions	13	1081	October 8, 2020
createShape() and lerp() Libraries	23	1856	September 28, 2018
Polygons Distribution with loops Coding Questions	5	459	September 16, 2021

Error moving object (using quad())

Related topics