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.
IndexProgramming Questions & HelpSyntax Questions › rotation of two shapes
Page Index Toggle Pages: 1
rotation of two shapes (Read 454 times)
rotation of two shapes
Feb 9th, 2006, 2:28pm
 
This code lets you click a shape, drag it around, and click again to "drop" it.  I wanted to have the shape rotate if you clicked and held the mouse down and dragged.  I got this working with one shape but I can't figure out how to do it with two shapes because it seems like the way rotation is done effects the whole plane... what am I missing?

Current code below:

int shapeCount = 2;
shape[] shapes = new shape[shapeCount];
void setup()
{
 size(360, 360);
 //rectMode(CENTER_RADIUS);  
 framerate(30);
 shapes[0] = new shape(180,180,"square");
 shapes[1] = new shape(50,50,"triangle_small");
}

void draw()
{
 background(0);

 for(int i=0; i < shapeCount; i++)
 {
   shapes[i].update();
 }
}

void mousePressed() {
 for(int i=0; i < shapeCount; i++)
 {
   shapes[i].mousePressed();
 }
}
void mouseDragged() {
 for(int i=0; i < shapeCount; i++)
 {
   shapes[i].spin();
 }
}
void mouseReleased() {
 for(int i=0; i < shapeCount; i++)
 {
   shapes[i].mouseReleased();
 }
}

class shape {
 float bx;
 float by;
 int bs = 40;
 boolean bover = false;
 boolean locked = false;
 boolean spinning = false;
 float bdifx = 0.0;
 float bdify = 0.0;
 float angle = 0;
 int mouseHitX = 0;
 int mouseHitY = 0;
 String _shapeType = "";
 
 shape(int x, int y, String shapeType) {
   bx = x;
   by = y;
   mouseHitX = x;
   mouseHitY = y;
   _shapeType = shapeType;
 }
 
 void update() {
   // Test if the cursor is over the box
   
   if (over()) {
     // Locked = Mouse currently down  
     if(locked) {
       stroke(255);
       fill(153);
     }
   } else {
     stroke(153);
     fill(153);
   }
   // Draw the box
   if (locked) {
     mouseDragged();
   }

//uncommenting this and the "0,0" calls below
//will turn on rotation.. but it's pretty strange
   //translate(bx,by);
   //rotate(angle);  
   //rectMode(CENTER);
   
   if (_shapeType == "square")
   {
     //rect(0,0,bs,bs);
     rect(bx,by,bs,bs);
   }
   else if (_shapeType == "triangle_small")
   {
     triangle(bx,by, bx,by+bs, bx+bs,by);
     //triangle(0,0, 0,bs, bs,0);
   }
 }
 
 boolean over()
 {
   return (mouseX > bx-bs && mouseX < bx+bs &&
       mouseY > by-bs && mouseY < by+bs);
 }
 
 void mousePressed() {
   if(over()) {
     locked = !locked;
     fill(255, 255, 255);
     spinning = true;
     mouseHitX = mouseX;
     mouseHitY = mouseY;
   } else {
     locked = false;
   }
   bdifx = mouseX-bx;
   bdify = mouseY-by;
 }  

 void mouseDragged() {
   if(locked & !spinning) {
     bx = constrain(mouseX-bdifx, bs, width-bs);
     by = constrain(mouseY-bdify, bs, height-bs);
   }
 }
 
 void spin() {
   if (locked & spinning)
   {
     angle = radians(mouseX);
   }
 }

 void mouseReleased() {
    spinning = false;
    int tolerance = 2;
    if (abs(mouseX - mouseHitX) > tolerance &
        abs(mouseY - mouseHitY) > tolerance)
        {
          locked = false;
        }
 }
}
Re: rotation of two shapes
Reply #1 - Feb 9th, 2006, 2:54pm
 
What you need is pushMatrix(); and popMatrix(); this will limit all rotation/translations to just affect a single object at a time.

You put the pushMatrix() just before you do the translation/rotation/drawing or the shape, and the popMatrix(); once you've finished drawing it.

See the reference pages for more info:
http://processing.org/reference/pushMatrix_.html
http://processing.org/reference/popMatrix_.html
Re: rotation of two shapes
Reply #2 - Feb 11th, 2006, 3:32pm
 
Thank you very much... exactly what I was looking for!
Page Index Toggle Pages: 1