We closed this forum 18 June 2010. It has served us well since 2005 as the ALPHA forum did before it from 2002 to 2005. New discussions are ongoing at the new URL http://forum.processing.org. You'll need to sign up and get a new user account. We're sorry about that inconvenience, but we think it's better in the long run. The content on this forum will remain online.
Index › Programming Questions & Help › Other Libraries › how can i make 5 rectangles an object
‹ Previous Topic | Next Topic ›
Page Index Toggle Pages: 1
how can i make 5 rectangles an object? (Read 331 times)
gg
how can i make 5 rectangles an object?
Nov 20th, 2008, 2:43am  
maybe i don't know even the basic about processing but here's my silly question:
I want to draw 5 rect and then use them like one shape that moves in different
x and y positions.
I draw rectangles x,y,w,h only using one variable x that is increasing.
(that helps me to change any time my shape).
What i see is that not only the x and y positions change but also the w and h.
I understand this because w,h,y=x;
So is there an easy way to make these 5 rects to behave like one shape?
What is the method?
I'm interested in how it must be structured.
here's the code:

int x;

void setup(){
 size(800,800);
 background(0);
 x=12;
 //x1=5;
 
}
void draw(){
 background(0);
fill(25,80,90);
noStroke();
beginShape();
rect(x,x,5*x,x);
rect(4*x,2*x,2*x,x);
rect(2*x,3*x,3*x,x);
rect(x,4*x,2*x,x);
rect(x,5*x,5*x,x);

endShape(CLOSE);
 for(int i=0; i<x1;i++){
   x+=x1;
}

if(x>=x1){
  fill(255,255,255);
  //translate(x1,x);
  x=mouseX;
  x=mouseY;
  }
}
Back to top
 
 
PhiLho 
Re: how can i make 5 rectangles an object?
Reply #1 - Nov 20th, 2008, 10:52pm  
I think you are on the right track, after removing all the lines with x1, I found it was behaving nicely. I am not sure to understand what is your problem, exactly.

If you want the shape to keep a constant shape, you should make w and h depend on a constant instead of variable x, no? Same formulae, but another multiplier.
Back to top
 
WWW  
gg
Re: how can i make 5 rectangles an object?
Reply #2 - Nov 21st, 2008, 1:02am  
Thank you for taking a look.I think the code is working correctly and I'm really
excited.
In the other hand I would like to use these 5 rectangles like one shape. For example I try to move them all together without destroy the shape
(in this case the shape is the letter z that I have designed).
I have designed more letters , that are constructed by 5 or more rectangles , and finally I try to move them all together.
To do that I must make classes of my shapes?
What is the right direction to achieve that without loosing the x variable ?(because the x variable here is my basic structure of the shape)
How the x and y position of my shape(that is constructed by 5 rect) could change without destroying the final shape?
Back to top
 
 
PhiLho 
Re: how can i make 5 rectangles an object?
Reply #3 - Nov 21st, 2008, 2:50pm  
Note: No need for beginShape/endShape because you already draw closed shapes.

And yes, using classes might be a good, flexible solution.

There are at least two ways of designing such class: one, I didn't took, is to make one class, and to feed each instance with data to draw the rectangles, storing this data into an array for example.
Another, which I illustrate here, is to make a master, generic (abstract in Java lingo) class and to make a specialized class per letter. It might need slightly more code, but is it much more flexible: for example, you can use another shape for a part of a letter.

File LetterShape.java: Code:
import processing.core.*;

abstract class LetterShape
{
  static final int RECT_SCALE = 10;
  PApplet pa;

  int x, y; // Position
  // You can add other parameters like color...

  public LetterShape(PApplet pap, int posX, int posY)
  {
    pa = pap;
    x = posX;
    y = posY;
  }

  void drawLetter()
  {
    pa.pushMatrix();
    pa.translate(x, y); // Put letter in place on screen
    drawShape();
    pa.popMatrix();  // Undo translate
  }

  void drawRect(int px, int py, int w, int h)
  {
    pa.rect(px*RECT_SCALE, py*RECT_SCALE, w*RECT_SCALE, h*RECT_SCALE);
  }

  abstract void drawShape();
}

class LetterZ extends LetterShape
{
  public static final int WIDTH = 5;

  public LetterZ(PApplet p, int x, int y) { super(p, x, y); }

  void drawShape()
  {
    drawRect(1, 1, 5, 1);
    drawRect(4, 2, 2, 1);
    drawRect(2, 3, 3, 1);
    drawRect(1, 4, 2, 1);
    drawRect(1, 5, 5, 1);
  }
}

class LetterI extends LetterShape
{
  public static final int WIDTH = 1;

  public LetterI(PApplet p, int x, int y) { super(p, x, y); }

  void drawShape()
  {
    drawRect(1, 1, 1, 5);
  }
}

class LetterY extends LetterShape
{
  public static final int WIDTH = 3;

  public LetterY(PApplet p, int x, int y) { super(p, x, y); }

  void drawShape()
  {
    drawRect(1, 1, 1, 3);
    drawRect(2, 2, 1, 4);
    drawRect(3, 1, 1, 3);
  }
}

File LetterShapes.pde: Code:
LetterShape lI, lY, lZ;
void setup()
{
  size(800, 400);
  smooth();
  int pos = 0;
  lI = new LetterI(this, pos, 0);
  pos += LetterShape.RECT_SCALE * (1 + LetterI.WIDTH);
  lZ = new LetterZ(this, pos, 0);
  pos += LetterShape.RECT_SCALE * (1 + LetterZ.WIDTH);
  lY = new LetterY(this, pos, 0);
}

void draw()
{
  background(200);
  fill(#195060);
  translate(mouseX, mouseY);
  lI.drawLetter();
  lZ.drawLetter();
  lY.drawLetter();
  // Matrix is reset here
}

Code is still a bit rough, can get some more improvements...
Back to top
« Last Edit: Nov 21st, 2008, 5:24pm by PhiLho  »  
WWW  
gg
Re: how can i make 5 rectangles an object?
Reply #4 - Nov 21st, 2008, 3:42pm  
That's great!!
The code is working perfect.
This is what I need.Thanx a lot!
The most important for me is that I understand  the way that is structured.
Back to top
 
 
Page Index Toggle Pages: 1
‹ Previous Topic | Next Topic ›