› › ›

Dragging shapes: How can I drag my shapes separately?

timeanatortimeanator
edited March 2017 in Questions about Code

Hello, I am very new to processing and I'm having a difficult time with my code. I used part of this code that I found online and modified it to my liking, I am trying to modify it even more by adding the option of dragging the triangle shapes. To do this I was using the mouse functions example from the processing site: https://processing.org/examples/mousefunctions.html and it worked pretty well for one of my triangles, but then when I attempted to include another triangle they dragged as one, instead of separately. I want to be able to drag each of the triangle shapes separately and have them stay in the place where you drag them. In the final code the user should be ale to click on the heart made of triangles, have the triangles all separate and then be able to drag the triangle shapes back in place.

CODE:

boolean now = false;

//  ************************* Triangles
boolean triShapes = false;
boolean triNOW = false;

float tx1 = 120;
float ty1 = 235;
float tx2 = 200;
float ty2 = 235;
float tx2a = 120;
float ty2a = 235;
float tx3 = 140;
float ty3 = 275;
float tx4 = 160;
float ty4 = 235;
float tx5 = 180;
float ty5 = 275;
float tx6 = 200;
float ty6 = 235;
float tx7 = 220;
float ty7 = 275;
float tx8 = 240;
float ty8 = 235;
float tx9 = 140;
float ty9 = 275;

float txSpeed = 10;
float tySpeed = 10;
float tx2Speed = 2;
float ty2Speed = 11.5;
float tx8Speed = 10.5;
float ty8Speed = 9;
float tx3Speed = 10;
float ty3Speed = 1;
float tx7Speed = 10;
float ty7Speed = 2;
float tx2aSpeed = 4;
float ty2aSpeed = 11.5;
float tx4Speed = 10;
float ty4Speed = 12;
float tx5Speed = 2;
float ty5Speed = 14;
float tx6Speed = 10;
float ty6Speed = 2;
float tx9Speed = 10;
float ty9Speed = 12;

float gravity = 0.5;

// ***********************************Dragging
int triangleSize = 75;

boolean overTriangle = false;
boolean locked = false;
float xOffset = 0.0; 
float yOffset = 0.0; 


void setup() {
  size(400,550);
  smooth();
  frameRate(40);
}

void draw() {
  noStroke();
  fill(255);
  rect(0,0,400,550);
  (triShapes) = true;

// _____________________________________________________________ Begin if (triShapes) 
  if (triShapes) {
    fill(245,50,50);
    triangle(tx1, ty1, tx1+40, ty1-40, tx1+80, ty1);
    fill(245,50,50);
    triangle(tx2, ty2, tx2+40, ty2-40, tx2+80, ty2);
    fill(218,44,44);
    triangle(tx2a, ty2a, tx2a+20, ty2a+40, tx2a+40, ty2a);
    fill(201,55,55);
    triangle(tx3, ty3, tx3+20, ty3-40, tx3+40, ty3);
    fill(223,77,77);
    triangle(tx4, ty4, tx4+20, ty4+40, tx4+40, ty4);
    fill(239,111,111);
    triangle(tx5, ty5, tx5+20, ty5-40, tx5+40, ty5);
    fill(223,77,77);
    triangle(tx6, ty6, tx6+20, ty6+40, tx6+40, ty6);  
    fill(201,55,55);
    triangle(tx7, ty7, tx7+20, ty7-40, tx7+40, ty7);
    fill(218,44,44);
    triangle(tx8, ty8, tx8+20, ty8+40, tx8+40, ty8);
    fill(180,35,35);
    triangle(tx9, ty9, tx9+60, ty9+80, tx9+120, ty9);   

    if (triNOW) {
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 1
      tx1 = tx1 + txSpeed;
      ty1 = ty1 - tySpeed;
      tySpeed = tySpeed - gravity;

      // If the object hits the right side, it bounces slightly
      if (tx1 == width-50 || tx1 < 0) {
        txSpeed = txSpeed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty1 < -30) {
        tySpeed = tySpeed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty1 > height-20) {
        ty1 = height-20;
        txSpeed = txSpeed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 8
      tx8 = tx8 - tx8Speed;
      ty8 = ty8 - ty8Speed;
      ty8Speed = ty8Speed - gravity;

      // If the object hits either side, it bounces slightly
      if (tx8 == width-50 || tx8 < 0) {
        tx8Speed = tx8Speed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty8 < -30) {
        ty8Speed = ty8Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty8 > height-20) {
        ty8 = height-20;
        tx8Speed = tx8Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 2
      tx2 = tx2 + tx2Speed;
      ty2 = ty2 - ty2Speed;
      ty2Speed = ty2Speed - gravity;

      // If the object hits either side, it bounces slightly
      if (tx2 == width-25 || tx2 < 25) {
        tx2Speed = tx2Speed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty2 < -30) {
        ty2Speed = ty2Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty2 > height-20) {
        ty2 = height-20;
        tx2Speed = tx2Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 3
      tx3 = tx3 + tx3Speed;
      ty3 = ty3 + ty3Speed;

      // If the object hits either side, it bounces slightly
      if (tx3 == width-100 || tx3 < 0) {
        tx3Speed = tx3Speed/3 * -1;
        ty3 = ty3 + ty3Speed*10;
        ty3Speed = ty3Speed*10 + gravity;
      }

      // If the object rises above height -30, it begins to descend
      if(ty3 < -30) {
        ty3Speed = ty3Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty3 > height-20) {
        ty3 = height-20;
        tx3Speed = tx3Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 7
      tx7 = tx7 - tx7Speed;
      ty7 = ty7 + ty7Speed;

      // If the object hits either side, it bounces slightly
      if (tx7 == width-25 || tx7 < 25) {
        tx7Speed = tx7Speed/2 * -1;
        ty7 = ty7 + ty7Speed;
        ty7Speed = ty7Speed + gravity;
      }

      // If the object rises above height -30, it begins to descend
      if(tx7 < -30) {
        ty7Speed = ty7Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty7 > height-20) {
        ty7 = height-20;
        tx7Speed = tx7Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 2a
      tx2a = tx2a - tx2aSpeed;
      ty2a = ty2a - ty2aSpeed;
      ty2aSpeed = ty2aSpeed - gravity;

      // If the object hits either side, it bounces slightly
      if (tx2a == width-25 || tx2a < 25) {
        tx2aSpeed = tx2aSpeed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty2a < -30) {
        ty2aSpeed = ty2aSpeed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty2a > height-20) {
        ty2a = height-20;
        tx2aSpeed = tx2aSpeed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 4
      tx4 = tx4 + tx4Speed;
      ty4 = ty4 - ty4Speed;
      ty4Speed = ty4Speed - gravity;

      // If the object hits either side, it bounces slightly
      if (tx4 == width-150 || tx4 < 0) {
        tx4Speed = tx4Speed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty4 < -30) {
        ty4Speed = ty4Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty4 > height-20) {
        ty4 = height-20;
        tx4Speed = tx4Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 5
      tx5 = tx5 + tx5Speed;
      ty5 = ty5 - ty5Speed;
      ty5Speed = ty5Speed - gravity;

      // If the object hits either side, it bounces slightly
      if (tx5 == width-25 || tx5 < 25) {
        tx5Speed = tx5Speed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty5 < -30) {
        ty5Speed = ty5Speed/2 * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty5 > height-20) {
        ty5 = height-20;
        tx5Speed = tx5Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 6
      tx6 = tx6 + tx6Speed;
      ty6 = ty6 - ty6Speed;

      // If the object hits either side, it bounces slightly
      if (tx6 == width-170) {
        tx6Speed = tx6Speed/3 * -1;
        ty6Speed = ty6Speed * -1;
        ty6 = ty6 + ty6Speed*4.5;
        ty6Speed = ty6Speed*4.5 + gravity;
      }


      // If the object hits the bottom, it stops
      if (ty6 > height-20) {
        ty6 = height-20;
        tx6Speed = tx6Speed / 2;
      }
      // ^^^^^^^^^^^^^^^^^^^^^^^^^^Tri 9
      tx9 = tx9 + tx9Speed;
      ty9 = ty9 - ty9Speed;
      ty9Speed = ty9Speed - gravity;

      // If the object hits the right side, it bounces slightly
      if (tx9 == width-100 || tx9 < 0) {
        tx9Speed = tx9Speed/3 * -1;
      }

      // If the object rises above height -30, it begins to descend
      if(ty9 < -30) {
        ty9Speed = ty9Speed * -1;
        //      Yspeed = Yspeed * gravity;
      }

      // If the object hits the bottom, it stops
      if (ty9 > height-20) {
        ty9 = height-20;
        tx9Speed = tx9Speed / 2;
      }
    } // END TRI CONDITIONAL
  } // _____________________________________________________________ END if (triShapes)

   // Test if the cursor is over the box 
  if (mouseX > tx9-triangleSize && mouseX < tx9+triangleSize && 
      mouseY > ty9-triangleSize && mouseY < ty9+triangleSize) {
    overTriangle = true;  
    if(locked) { 
      stroke(0); 
      fill(0);
    } 
  } else {
    stroke(153);
    fill(153);
    overTriangle = false;
  }


}//end DRAW

void mousePressed() { 

    if (triShapes == true) {
      triNOW = !triNOW;
    }

  if(mouseX>100 && mouseX<200 && mouseY>0 && mouseY<30) {
    triShapes = !triShapes;
  }

if(overTriangle) { 
    locked = true; 
} else {

  } 
  xOffset = mouseX-tx9; 
  yOffset = mouseY-ty9; 
  } 

  void mouseDragged() {
  if(locked) {
   tx9 = mouseX-xOffset; 
   ty9 = mouseY-yOffset; 
  }

}

void mouseReleased() {
  locked = false;

}
Tagged:

Answers

  • timeanatortimeanator

    Also.. why is the code in my post showing up like this? how can I fix this?

  • kfrajerkfrajer

    Edit your post, select your code and press ctrl+o. Ensure there is an empty line above and below your code. That's it.

    Kf

Sign In or Register to comment.