user2259774
user2259774

Reputation: 9

Matching graphical gridto 2d array grid

what I am trying to do is find where on my picture of a board game a person clicked and change the value according to it in my 2d array. It's kind of like tic tac toe but bigger and you place the stones on the intersections. So far I was able to get my x and y position of my mouse and check if the user clicked the first top left hand intersection and that works but I was thinking of writing some sort of for loop that will check all of the intersection points.

This is my code for checking the top intersection

if ((x >= 278 && x <= 285) && ( y >= 160 && y <= 175))
    {
        System.out.println("intersection 1 clicked");
    }

So my question is how would I write my for loop to check all of the intersections? Even the logic is just fine if you don't feel like writing code.

Thanks in advance any help is much appreciated.

https://i.sstatic.net/yzPTA.png this is my program running the top left hand stone is my cursor

https://i.sstatic.net/l6UrW.png and this is my code

Upvotes: 0

Views: 392

Answers (2)

DannyMo
DannyMo

Reputation: 11984

I think a for-loop would over-complicate things. You could instead write a few statements to translate between screen space and board space.

Say your screen space is 800px by 600px and you have a 10 x 10 game board represented by a 2-dimensional array: board[10][10]. Let's also say that you start drawing the board at a 10px offset from 0,0 and your board is 500px wide. In this case you know how much screen space each cell on your board occupies:

int boardScreenWidth = 500;
int cellWidth = boardScreenWidth / boardWidth;
           // = 500px / 10 
           // = 50px

Start by ignoring clicks that don't touch the board:

int boardStartX = 10; 
if (mouseX < boardStartX || mouseX >= boardStartX + boardScreenWidth)
  return; // The user clicked somewhere to the left or right of the board

Then, if the click was on the board, you will need to adjust the mouse position based on the board's offset from 0 (so that clicking at x=10px is like clicking at x=0 in terms of the board's position). With this information it becomes easy to translate an x-coordinate in screen space to an index in board:

int mouseX = 320; // user clicked at x=320
mouseX = mouseX - boardStartX; // adjust based on board's position
int boardX = mouseX / cellWidth;
        // = 310 / 50
        // = 6

You could find boardY similarly and then access the cell that was clicked at board[boardX][boardY].

Edit: To get screen coordinates from an index in your board, use the same logic above but solve for mouseX:

int boardX = (mouseX - boardStartX) / cellWidth;
// ==> boardX * cellWidth = mouseX - boardStartX
// ==> (boardX * cellWidth) + boardStartX = mouseX
// or...
int screenX = boardStartX + (boardX * cellWidth);

Note that this is the edge of the cell. The entire cell will span from screenX to screenX + cellWidth. The center of the cell is at screenX + cellWidth / 2

Upvotes: 1

trashgod
trashgod

Reputation: 205805

As shown here, you can calculate the screen coordinate based on the desired grid coordinate. Click and drag to capture a SIZE square of the screen, then mouse over it to see how mouseMoved() works. A similar approach is used in this MapPanel.

image

Upvotes: 2

Related Questions