How to draw a line?

[RandomCoder]

I'm starting to struggle with the Icon Editor application

I've created a 32x32 grid on the Form which is going to be used to create the icon and each section of the grid is 5x5 pixels.

Now I am wanting to create a line tool that will allow the user to select the start and end point then draw a line between.
This was simple enough to implement except that I have a slight problem... I want each section of the grid that the line touches to be filled.

How can I achieve this?
Has anyone any ideas?

This is what I have so far....

Sub Globals
 Dim Type(Name,Colour,Size) Tool
 Dim Palette(256)
 X1="": Y1="": MouseDown=False
End Sub

Sub Designer_MouseDown (X,Y)
 ...
 Select Tool.Name
  Case "Pen"
   ...
  Case "Sucker"
   ...
  Case "Line"
    [COLOR="Red"]X1=Int(X/5)*5: Y1=Int(Y/5)*5[/COLOR]
  End Select
 ...
 ...
End Sub

Sub Designer_MouseUp (X,Y)
 If MouseDown=True AND Tool.Name="Line" Then
[COLOR="red"]   X2=Int(X/5)*5: If X2>Designer.Width-10 Then X2=Designer.Width-10
   Y2=Int(Y/5)*5: If Y2>165 Then Y2=165
   Designer.Line(X1,Y1,X2,Y2,Tool.Colour)[/COLOR]
 End If
 MouseDown=False
 ...
End Sub

Maybe I am approaching the problem in completely the wrong way, any suggestions would be greatly appreciated.

Thanks,
RandomCoder.

 

[LineCutter]

The line you are drawing is going to be 5 pixels wide. You know the difference in X & Y coordinates.
Find the extremes of the cells you are connecting (depends on the orientation of the line, but you only need the "outside" two). Step through in jumps of 1 real pixel & flag/fill the cells you need.

Incidentally, I think you may be in for trouble if you connect a "vertical" line from top to bottom, with a 1 "box" step to one side. Your current strategy will give you a 2 pixel line, top to bottom.
I think you want to join the cell centres, moving from X1,Y1 to X2,Y2 in SQRT([(X2-X1)*(X2-X1)]+[(Y2-Y1)*(Y2-Y1)])/5 real pixel steps (Pythagorus). Flag the cell you are in, using whatever grid record system you have established.

1. Find the centre of the cell containing X1,Y1
2. Find the centre of the cell containing X2,Y2
3. Find X2-X1 & Y2-Y1
4. Calculate the number of steps you need to get from X1,Y1 to X2,Y2 stopping in each cell along the way
5. Iterate though the steps, check the coordinates & flag the cell
6. Act on the cells you've flagged, if you've not done it along the way.

 

[RandomCoder]

LineCutter,

Thank you for your response.

I think that I might be tackiling the problem in completely the wrong way.
My App draws the grid on the Forelayer using FLine, as shown in the code below.

Sub DrawGrid
 Designer.ForeLayer=True
 Designer.Fline(Designer.Width-170,10,Designer.Width-10,165,cBlack,B)
 For Row=0 To 15
  Designer.Fline(Designer.Width-170,10+(10*Row),Designer.Width-10,15+(10*Row),cBlack,B)
 Next
 For Col=0 To 15
  Designer.Fline(Designer.Width-165+(10*Col),10,Designer.Width-160+(10*Col),165,cBlack,B)
 Next
 Designer.Line(Designer.Width-170,10,Designer.Width-10,165,cWhite,BF)
 Designer.FLine(10,10,Designer.Width-170,165,cBlack,B)
End Sub

I have no recording system that will allow me to 'flag' the parts of the grid a line passes through.
It was my intention to draw the line and then locate each part of the grid that contained the line and fill the entire 5x5 square.
I've managed to draw the line wherever the user wants it but fallen over when it comes to trying to determine which parts to fill.

Do I need to use an array or matrix kind of approach?
How does MS Paint Brush calculate a line, my program will be very simple in that the uses a mousedown event for the start position and the end position will be set by the point that the mouseup event is fired. I'd love to be able to show and update the position of the line as it is being drawn but this is beyond my ability I think.

Is it time to go back to the drawing-board (pardon the pun) and start again :sign0148:

Regards,
RandomCoder

 

[LineCutter]

I guess that the mechanism for drawing a line is determined by how you store the result, which in itself is determined by how you are going to get the data to save as an icon.
I'd assumed a 32x32 array of pixels, drawn to a hidden image & then saved.