Need help gradually drawing lines

[i2avi]

Hi, I'm working on an assignment and, after a significant amount of googling and reading through my textbook, I can't seem to find a tutorial for anything similar to what I need to do.

My aim is to produce a tool which draws a line on the screen based on certain button selections. There is a text input for the length of the line in pixels, directional buttons in which the line should be slowly drawn, and a colour switcher.

I've already found out how to switch the colour of a 2D graphic based on the button selection, but can't find anywhere how to gradually draw a line (with a GIF image of a pen following along), based on the press of a button with a specific pixel amount - and have the line remain persistent when the next is drawn. Most line drawing tutorials use co-ordinates, which I don't think is what I need.

Can anyone point me in the right direction so that I can learn how to do this?

[NormR1]

how to gradually draw a line

Sounds like you need a Timer to call repaint() with small incremental changes in where the line is to be drawn. The persistence of the line would be effected by drawing over/or redrawing the old line each time together with the extension for the new line.

[i2avi]

Okay to rephrase, for this part of the app I have a set of direction buttons, a text field and a colour selector (which is pretty much done).

I want to learn how to make it so that if I enter 10 into the text field, then press "up", a line is drawn up from the starting point by 10 pixels. Obviously then "left" would draw a line to the left.

I cannot find anything like this on the internet or in my textbook, and so am asking here for some help.

[NormR1]

a line is drawn up from the starting point by 10 pixels

From a x,y point, up is in the -y direction. Right would be in the +x direction.
etc
A pretty basic x,y graph concept. The upper left corner being 0,0

I guess I don't understand what you are trying to do.

[i2avi]

I guess I don't understand what you are trying to do.

I'll try to explain. There is a canvas with a GIF image of a pen on it (which I eventually need to figure out how to import but that's not the issue now).

The controls beneath it are four buttons, up/down/left/right. There's also a text field in which the number of pixels must be input. If "10" is placed in the pixels text field, and I press "up", then the GIF image of the pen moves 10 pixels up, drawing a line in the process. If I then changed the number to "5" and pressed "left", the pen moves 5 pixels left drawing a line along with it.

There's also a colour switcher for the pen but I think that part is pretty simple. I have a drop down menu and believe this will work:

colorChoice = new JComboBox();
      colorChoice.addItem("Black");
      colorChoice.addItem("Blue");
      colorChoice.addItem("Red");
      colorChoice.addItem("Green");      
      buttonBar.add(colorChoice);

private Color getCurrentColor() {
         int currentColor = colorChoice.getSelectedIndex();
         switch (currentColor) {
            case BLACK:
               return Color.black;
            case RED:
               return Color.red;
            case GREEN:
               return Color.green;
            case BLUE:
               return Color.blue;
         }
      }

But yes, I can't find any help for how to get these lines drawn based on those inputs. Any tips would be appreciated!

[NormR1]

Is this what you want to do?
Start at a position, say 100, 100
Draw a 10 pixel line up to 100, 90 (y-=10)
Draw a 20 pixel line to the right to 120, 90 (x+=20)
Draw a 10 pixel line down to 120, 100 (y+=10)

At this point there are 4 points, your code needs to draw lines from the first to the second, from the second to the third, etc.

[i2avi]

Yes, that's an example of what the app needs to do. Bearing in mind the user can press any direction, or have any number of pixels in the text field so the points aren't predefined.

I've been researching for two days and remain clueless. :(

[NormR1]

the points aren't predefined

Thats what variable are for, to hold data that becomes available at execution time.
Given the last position that the line was drawn to, take it and apply the direction and number of pixels and save that at the end of the list of points.
The x,y values of the points could be stored in many places, a large array, a Vector or some other collection type.

[i2avi]

I understand that, but what I can't figure out how to do is, on the push of a button, have a line drawn from point a, in pixels, to point b.

[NormR1]

In the action listener, compute the new point, add it to the list and call repaint()
Shortly thereafer your paint() method will be called and there is where you draw all the lines in the list.