Attaching multiple lines to separate shapes

edited May 2014 in How To...

Good afternoon to everyone. I trust you're all well on the forum. I was wondering if any of you would be able to help. I would like to have multiple lines attached to each one of my 6 object, the beginning of line would begin at the top of the screen. So when the user clicks on the object it moves, but the lines are still attached to the centre of the object. It makes the lines look like they're being stretched. I've managed to create a set of lines for the first object, however I'm having difficulty creating the next 5. Would any of you be able to help with my problem please. Thanks all.

import ddf.minim.*; 

float numLines;
float spaceLines;


Boolean IsMouseInCircle; 
Boolean IsMousePressed; 
PVector MyCoor[]; 
PVector CircleSize; 
PVector MousePos; 
int CircleNumber;

float diameter[];

boolean isMoving[];

float CircleSpeed_Y[];

int counter;

AudioPlayer [] songs;

Minim minim; 




void setup() { 
  size(1024, 700); 
  frameRate(45);

  minim = new Minim(this); 

  numLines = 13;
  spaceLines = 0;


  CircleNumber = 6;                                       // sets the number of shapes being created //

  songs = new AudioPlayer[CircleNumber];

  songs[0] = minim.loadFile("Drum01.wav");               // Loads all the different sounds and puts them into the 
  songs[1] = minim.loadFile("Drum01.wav");               // correct part of the array
  songs[2] = minim.loadFile("Guitar.wav");              
  songs[3] = minim.loadFile("Bass.wav");
  songs[4] = minim.loadFile("Beats.wav");               
  songs[5] = minim.loadFile("Music.wav");


  MyCoor = new PVector[CircleNumber]; // creates all the variable for the balls//
  diameter = new float[CircleNumber]; // These include the balls coordinates, their size, their speed  
  isMoving = new boolean[CircleNumber]; // and whether they have been clicked allowing them to move //

  CircleSpeed_Y = new float[CircleNumber]; 
  int counter = 0;

  IsMouseInCircle = false;                         //defines the booleans which start as false //
  IsMousePressed = false;

  while (counter < CircleNumber) {
    diameter[counter] = 85;                        // While statement sets up all the variable on the stage//
    float xp = diameter[counter] + counter * 170;  // spreads the balls out evenly across the stage on the X axis //
    float yp = diameter[counter] ;

    CircleSpeed_Y[counter] = 20;
    MyCoor[counter] = new PVector(xp, yp);

    songs[counter] = songs[counter]  ;          // This is where all the different sounds should be be synced with each ball //

    counter = counter + 1;
  }
}

void draw() {

  background(0);                                 // sets the background to white //
  counter = 0;

  int countLines = 0;



  while (countLines < numLines) {

    float addY = spaceLines + countLines * 10;
    line(addY, 0, MyCoor[counter].x, MyCoor[counter].y);
    stroke(255);

    countLines++;
  }


  while (counter < CircleNumber) {

    if (checkMouseInZone(MyCoor[counter], diameter[counter])) {      // this if statement tests the mouse is in the ball //
      if ( IsMousePressed ) {                                          // tests if the mouse clicked within the each ball //


        isMoving[counter] = true;                                      // if the click is within each ball make the boolean true and proceeds with the if statement below //
      }
    }  
    else {
      fill(255, 0, 0);
    }  

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

    if (isMoving[counter]) {                                          // if the isMoving[counter] is true make the balls move //
      //
      MyCoor[counter].y = MyCoor[counter].y + CircleSpeed_Y[counter];//

      fill(0, 255, 0);                                               // Once the ball is moving change the balls colour to Red //

      if (MyCoor[counter].y > height) {                              // Once the ball touches the bottom window reverse the balls speed, which makes it go back up//
        MyCoor[counter].y = height;
        CircleSpeed_Y[counter] = - CircleSpeed_Y[counter]  ;
        println("too far bottom");
        songs[counter].pause();
        songs[counter].rewind();
        songs[counter].play();


      }

      if (MyCoor[counter].y < 0) {                                    // Once the ball touches the top of the window reverse the balls speed, which makes it go back down//
        MyCoor[counter].y = 50;
        CircleSpeed_Y[counter] = -CircleSpeed_Y[counter] ;
        println("too far top");
        songs[counter].pause();
        songs[counter].rewind();
        songs[counter].play();


      }
    }


    pushMatrix();                                                    // pushes the drawflake into the position PVector with
    translate(MyCoor[counter].x, MyCoor[counter].y);                     // the translate function
    drawFlake();                                                      // pulls all the information from the drawflake instantiation 

    popMatrix();   
    fill(255, 255, 0);
        noStroke();                                                  // When the cursor hangs over the stationary shape turn the colour is yellow//

    counter = counter + 1;
  }
}

boolean checkMouseInZone(PVector p, float radius) {              //this is my function to check if the mouse is in range of the button

  PVector m = new PVector(mouseX, mouseY);                        // a temporary PVector to store the current mouse position 

  return (m.dist(p) <= radius);                                   // returns true or false
}

void mousePressed() {

  IsMousePressed = true;
}

void mouseReleased() {

  IsMousePressed = false;
}


void drawFlake() {


  noStroke();
  int tickTock = 0;
  pushMatrix();                                                // pushes the current transformation of the below shape creation into the matrix stack//
  while (tickTock < 120) {                                    //creates 120 seperate different triangle and circles.


    ellipse(55, 55, random(1, 28), random(1, 28));         // Generates the 120 circles 250 pixels from the cursor and randomises the shapes ranging from 1 pixel to 150 //
    rotate(frameCount*radians(-25) / 40);                 //with the 120 generated triangles and circles and rotates them around the cursor 

    triangle(25, 55, -10, 34, 9, 9);                      

    tickTock = tickTock +1;
  };
  popMatrix();                                                // restores the prior coordinates system //
};

Answers

  • line 87

    why addy as x-value?

    isn't that the important line or which one?

  • Hi Chrisir.

    Thanks for the quick reply.

    The addy was there just to separate the lines along the top of the window, so they aren't generated on top of one another. The second point for all the lines are attached to the core of the shape MyCoor[counter].x, MyCoor[counter].y.

    My problem is duplicating the whole set and then moving the first point of the lines along, to the top of the window and then the second point being attached to the core of the next shapes.

  • no need for ; after }

    you need to put the sound again

    I made the white lines now

    ;-)

    import ddf.minim.*; 
    
    float numLines;
    float spaceLines;
    
    
    Boolean IsMouseInCircle; 
    Boolean IsMousePressed; 
    PVector MyCoor[]; 
    PVector CircleSize; 
    PVector MousePos; 
    int CircleNumber;
    
    float diameter[];
    
    boolean isMoving[];
    
    float CircleSpeed_Y[];
    
    int counter;
    
    AudioPlayer [] songs;
    
    Minim minim; 
    
    
    
    
    void setup() { 
      size(1024, 700); 
      frameRate(45);
    
      minim = new Minim(this); 
    
      numLines = 13;
      spaceLines = 0;
    
    
      CircleNumber = 6;                                       // sets the number of shapes being created //
    
      songs = new AudioPlayer[CircleNumber];
    
      //  songs[0] = minim.loadFile("Drum01.wav");               // Loads all the different sounds and puts them into the 
      //  songs[1] = minim.loadFile("Drum01.wav");               // correct part of the array
      //  songs[2] = minim.loadFile("Guitar.wav");              
      //  songs[3] = minim.loadFile("Bass.wav");
      //  songs[4] = minim.loadFile("Beats.wav");               
      //  songs[5] = minim.loadFile("Music.wav");
    
    
      MyCoor = new PVector[CircleNumber]; // creates all the variable for the balls//
      diameter = new float[CircleNumber]; // These include the balls coordinates, their size, their speed  
      isMoving = new boolean[CircleNumber]; // and whether they have been clicked allowing them to move //
    
      CircleSpeed_Y = new float[CircleNumber]; 
      int counter = 0;
    
      IsMouseInCircle = false;                         //defines the booleans which start as false //
      IsMousePressed = false;
    
      while (counter < CircleNumber) {
        diameter[counter] = 85;                        // While statement sets up all the variable on the stage//
        float xp = diameter[counter] + counter * 170;  // spreads the balls out evenly across the stage on the X axis //
        float yp = diameter[counter] ;
    
        CircleSpeed_Y[counter] = 20;
        MyCoor[counter] = new PVector(xp, yp);
    
        songs[counter] = songs[counter]  ;          // This is where all the different sounds should be be synced with each ball //
    
        counter = counter + 1;
      }
    }
    
    void draw() {
    
      background(0);                                 // sets the background to white //
      counter = 0;
    
      int countLines = 0;
    
      int k=0;
      for (int i = 0; i < MyCoor.length; i++) {
    
        while (countLines < numLines) {
    
          float addY = spaceLines + countLines * 10 + (170*k);
          stroke(255);
          line(addY, 0, MyCoor[i].x, MyCoor[i].y);      
    
          countLines++;
        } // while
        k++;
        countLines=0;
      }
    
    
      while (counter < CircleNumber) {
    
        if (checkMouseInZone(MyCoor[counter], diameter[counter])) {      // this if statement tests the mouse is in the ball //
          if ( IsMousePressed ) {                                          // tests if the mouse clicked within the each ball //
    
    
            isMoving[counter] = true;                                      // if the click is within each ball make the boolean true and proceeds with the if statement below //
          }
        }  
        else {
          fill(255, 0, 0);
        }  
    
        // ------------------------------------------------------
    
        if (isMoving[counter]) {                                          // if the isMoving[counter] is true make the balls move //
          //
          MyCoor[counter].y = MyCoor[counter].y + CircleSpeed_Y[counter];//
    
          fill(0, 255, 0);                                               // Once the ball is moving change the balls colour to Red //
    
          if (MyCoor[counter].y > height) {                              // Once the ball touches the bottom window reverse the balls speed, which makes it go back up//
            MyCoor[counter].y = height;
            CircleSpeed_Y[counter] = - CircleSpeed_Y[counter]  ;
            println("too far bottom");
            songs[counter].pause();
            songs[counter].rewind();
            songs[counter].play();
          }
    
          if (MyCoor[counter].y < 0) {                                    // Once the ball touches the top of the window reverse the balls speed, which makes it go back down//
            MyCoor[counter].y = 50;
            CircleSpeed_Y[counter] = -CircleSpeed_Y[counter] ;
            println("too far top");
            songs[counter].pause();
            songs[counter].rewind();
            songs[counter].play();
          }
        }
    
    
        pushMatrix();                                                    // pushes the drawflake into the position PVector with
        translate(MyCoor[counter].x, MyCoor[counter].y);                     // the translate function
        drawFlake();                                                      // pulls all the information from the drawflake instantiation 
    
        popMatrix();   
        fill(255, 255, 0);
        noStroke();                                                  // When the cursor hangs over the stationary shape turn the colour is yellow//
    
        counter = counter + 1;
      }
    }
    
    boolean checkMouseInZone(PVector p, float radius) {              //this is my function to check if the mouse is in range of the button
    
      PVector m = new PVector(mouseX, mouseY);                        // a temporary PVector to store the current mouse position 
    
      return (m.dist(p) <= radius);                                   // returns true or false
    }
    
    void mousePressed() {
    
      IsMousePressed = true;
    }
    
    void mouseReleased() {
    
      IsMousePressed = false;
    }
    
    
    void drawFlake() {
    
    
      noStroke();
      int tickTock = 0;
      pushMatrix();                                                // pushes the current transformation of the below shape creation into the matrix stack//
      while (tickTock < 120) {                                    //creates 120 seperate different triangle and circles.
    
    
        ellipse(55, 55, random(1, 28), random(1, 28));         // Generates the 120 circles 250 pixels from the cursor and randomises the shapes ranging from 1 pixel to 150 //
        rotate(frameCount*radians(-25) / 40);                 //with the 120 generated triangles and circles and rotates them around the cursor 
    
        triangle(25, 55, -10, 34, 9, 9);                      
    
        tickTock = tickTock +1;
      }
      popMatrix();                                                // restores the prior coordinates system //
    }
    
Sign In or Register to comment.