Line not drawing as it should

#1

Ok, I am newer to processing, but not a complete beginner. I’ve been going through a book to try and build my skills a little better and I just wanted to test myself by drawing a line on a small 200x200 window.

The basic idea is that the line starts at (50,50), then travels to (150,50) before disappearing. As it disappears, a new line is drawn from (150,50) to (150,150), and so on and so forth, until it animates a square in the window.

There’s no purpose to this, other than I just wanted to test myself and work on a bit of animation.

The problem I have is things go wonky from the (150,150) location until it goes back to the beginning. I’m just not seeing my mistake, but, like I said, I’m newer to this. So, here is my code up to this point. Does anyone see anything that I’m missing or making a mistake on? I don’t want answers, but a finger pointing to the right direction would be helpful.

Thanks.

boolean button = false;
short state = 0;

int line_1_x1 = 50;  // starting x position
int line_1_y1 = 50;  // starting y position
int line_1_x2 = 50;  // ending x position
int line_1_y2 = 50;  // ending y position
int line_2_x1 = 0;
int line_2_y1 = 0;
int line_2_x2 = 0;
int line_2_y2 = 0;
int line_3_x1 = 0;
int line_3_y1 = 0;
int line_3_x2 = 0;
int line_3_y2 = 0;
int line_4_x1 = 0;
int line_4_x2 = 0;
int line_4_y1 = 0;
int line_4_y2 = 0;


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

void draw() {
  
  background(255);
  
  // draw the first line
  stroke(0);
  line(line_1_x1, line_1_y1, line_1_x2, line_1_y2);
  line(line_2_x1, line_2_y1, line_2_x2, line_2_y2);
  line(line_3_x1, line_3_y1, line_3_x2, line_3_y2);
  line(line_4_x1, line_3_y1, line_3_x2, line_3_y2);
  
  if (line_1_x1 != 0) {
    if (line_1_x2 < 150) {
      line_1_x2++;
    } else if (line_1_x2 == 150) {
      line_1_x1++;
    }
    if (line_1_x1 == 51) {
      if (!button) {
        state = 1;
        line_2_x1 = 150;
        line_2_y1 = 50;
        line_2_x2 = 150;
        line_2_y2 = 50;
      }
    }
    if (line_1_x1 == 150) {
      line_1_x1 = 0;
      line_1_x2 = 0;
      line_1_y1 = 0;
      line_1_y2 = 0;
    }
  }
  
  if (line_2_y1 != 0) {
    if (line_2_y2 < 150) {
      line_2_y2++;
    } else if (line_2_y2 == 150) {
      line_2_y1++;
    }
    if (line_2_y1 == 51) {
      if (!button) {
        state = 2;
        line_3_x1 = 150;
        line_3_y1 = 150;
        line_3_x2 = 150;
        line_3_y2 = 150;
      }
    }
    if (line_2_y1 == 150) {
      line_2_x1 = 0;
      line_2_x2 = 0;
      line_2_y1 = 0;
      line_2_y2 = 0;
    }
  }
  
  if (line_3_x2 != 0) {
    if (line_3_x1 > 50) {
      line_3_x1--;
    } else if (line_3_x1 == 50) {
      line_3_x2--;
    }
    if (line_3_x2 == 149) {
      if (!button) {
        state = 3;
        line_4_x1 = 50;
        line_4_y1 = 150;
        line_4_x2 = 50;
        line_4_y2 = 150;
      }
    }
    if (line_3_x2 == 50) {
      line_3_x1 = 0;
      line_3_x2 = 0;
      line_3_y1 = 0;
      line_3_y2 = 0;
    }
  }
  
  if (line_4_y1 != 0) {
    if (line_4_y2 > 50) {
      line_4_y2--;
    } else if (line_4_y2 == 50) {
      line_4_y1--;
    }
    if (line_4_y1 == 149) {
      if (!button) {
        state = 0;
        line_1_x1 = 50;
        line_1_y1 = 50;
        line_1_x2 = 50;
        line_1_y2 = 50;
      }
    }
    if (line_4_y1 == 50) {
      line_4_x1 = 0;
      line_4_x2 = 0;
      line_4_y1 = 0;
      line_4_y2 = 0;
    }
  }
  
  println("Line 1: " + line_1_x1 + "-" + line_1_y1 + "-" + line_1_x2 + "-" + line_1_y2);
  println("Line 2: " + line_2_x1 + "-" + line_2_y1 + "-" + line_2_x2 + "-" + line_2_y2);
  println("Line_3: " + line_3_x1 + "-" + line_3_y1 + "-" + line_3_x2 + "-" + line_3_y2);
  println("line_4: " + line_4_x1 + "-" + line_4_y1 + "-" + line_4_x2 + "-" + line_4_y2);
}

void mousePressed() {
  button = !button;
  
  if (!button) {
    state += 1;
    if (state == 4) {
      state = 0;
    }
    if (state == 0) {
      line_1_x1 = 50;
      line_1_y1 = 50;
      line_1_x2 = 50;
      line_1_y2 = 50;
    } else if (state == 1) {
      line_2_x1 = 150;
      line_2_y1 = 50;
      line_2_x2 = 150;
      line_2_y2 = 50;
    } else if (state == 2) {
      line_3_x1 = 150;
      line_3_y1 = 150;
      line_3_x2 = 150;
      line_3_y2 = 150;
    } else if (state == 3) {
      line_4_x1 = 50;
      line_4_y1 = 150;
      line_4_x2 = 50;
      line_4_y2 = 150;
    }
  }
}

I should add, that from my screen output, I can see that the variables are changing as expected, but it’s almost as if something within processing is messing up, OR, it is something to do with memory on my computer.

1 Like
#2

you have an error in your draw code

this

  line(line_1_x1, line_1_y1, line_1_x2, line_1_y2);
  line(line_2_x1, line_2_y1, line_2_x2, line_2_y2);
  line(line_3_x1, line_3_y1, line_3_x2, line_3_y2);
  line(line_4_x1, line_3_y1, line_3_x2, line_3_y2);

should be

  line(line_1_x1, line_1_y1, line_1_x2, line_1_y2);
  line(line_2_x1, line_2_y1, line_2_x2, line_2_y2);
  line(line_3_x1, line_3_y1, line_3_x2, line_3_y2);
  line(line_4_x1, line_4_y1, line_4_x2, line_4_y2);

you just hadn’t put the correct line in

1 Like
#3

wow! Thanks. I think it’s time I stop for the day since I can’t seem to see anymore.

I can’t believe I missed that, but now that I see it, I feel like a complete idiot.

Good lookin’ out!