Graphics: Proofs of Concepts!!

It's about a sense of scale. Thus far, I've been using sets of numbers, but really that was just a prerequisite to thinking in pictures and diagrams.
I explained the problem of moving a square on a grid and checking if it was colliding with a wall to an acquaintance (I've decided we are not friends, not yet)
He said that it seems quite simple, 'you just check the x & y and see if they overlap'. Everything is so simple from a distance.

I haven't used x and y coordinates. This is because I would have to write int[x][y]- that is to say, columns of elements,
whereas mentally I conceptualize it as highlighted rows of elements (int[y][x]).
*A* solution to this would just be to write it as int[row][x], but you know it's not the same legibility as (x,y). I don't want to use a pair of co-ordinates anyway-
*two* if statements? Too much.
To reconcile this difference, I have decided to use grids of 10*10, indexed 00 ~ 99. This means that the tens column represents a row.
It's better to have 1 two digit number rather than 2 one digit numbers so that there's less if statements.
To take apart this number ('i' for this example) into its ones and tens columns, use:

x = i % 10
row = (int)(i/10)


Anyway, this post was about diagrams. How do you draw a grid? You could draw it with lines or rectangles.

I'll be using lines. There are vertical and horizontal lines. The grid begins with a line to the left of a square, and ends with a line to the right of a square.
Therefore, the number of lines will always be the number of squares + 1.

There's a horizontal number and vertical number of grid spaces, every grid space (space between lines) shall be a square, so there's a single arg. for size . I'm thinking 25(*25).
A final variable in drawing a grid would be the space between squares. Dotted lines.
drawGrid(2,2,1,0)
Begin at the top right corner (x1,y1). Place a second point at the top right end of the grid.
This is calculated by line + square + line + square + line.. or line+line+line + square + square.. or (horizontalsquares + 1)*line + (horizontalsquares)*square

Or actually, given drawGrid(0,0,2,2,1,1) (x,y,#horizontalsquares,#verticalsquares,squaresize,squaregap) x1 = 0; y1 = 0; x2 = 0 y2 = 0; x2 += line square line gap line square line gap line square line = line line line line square square gap #gaps = #horizontalsquares - 1 x2 += (horizontalsquares*2)*line) + horizontalsquares*space + (horizontalsquares-1)*gap x2 += line + square + line - draw x2 += gap - don't draw x2 += line + square + line increment #lines draw lines but not squares or gaps 0,0 -> 0,1,2,3 -> 3,0 -> 4,0 -> 7,0