Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

Newcomers DBPro Corner / Snap to Grid

Author
Message
Somarl
13
Years of Service
User Offline
Joined: 11th Feb 2011
Location: UK
Posted: 9th Feb 2013 16:40 Edited at: 9th Feb 2013 16:41
Hi with the following code i can now very simply create a grid over any size picture (within reason) which so far works the way i want it to.



There is more i want to add which i will get to like showing what number lies in each grid but i think i may be ok with that.

Now what i want to do is "place" down tiles that are different sizes and have very little idea on how to do this as it depends on the size of the object. I think i need an offset or something for some tiles but not for all.

So if i had a grid like this:



You can see that the red is 3x3 and needs some sort of offset that is the grid square width /2 which seems simple and the 4x4 has a different center that lands in a different place but i dont know the following.

a) how to place it while snapping to the grid with its offset.
b) how to place the 4x4 which offset seems to be different as its middle is not the same
c) how to tell all the square concerned in the array that they are now different (i.e a building is now sat here change from a 0 in the array to a 1). The 3x3 for example needs to affect all the mini tiles in that grid from the center.
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 10th Feb 2013 02:19
This might help you:
http://forum.thegamecreators.com/?m=forum_view&t=187859&b=6


Don't think about the center of your 3x3 or 4x4 tile, just the upper left corner. Snap that point to the grid and the rest of the tiles should follow.


To snap to the grid, take your mouse coordinate and divide it by the grid size.

If you would like to have the object centered on the mouse, you would need to offset the initial value.

To get the grid coordinate of the mouse's current location:


Now, take the number of tiles your object uses and divide it by 2 and subtract that from grid value we already have. So for a 3x3 object:





Complete code:


"You're not going crazy. You're going sane in a crazy world!" ~Tick
Somarl
13
Years of Service
User Offline
Joined: 11th Feb 2011
Location: UK
Posted: 10th Feb 2013 20:28 Edited at: 10th Feb 2013 20:31
This is great, just what i am looking for. I just have one question.

It seems that



this is what makes the mouse appear at the center of the "object" or "box" which for me will be something like a building that will be placed. However the mouse is not in the center and is more offset down and to the right once the box starts moving. Yet the code above makes sense that it would be half the width and height so i dont know why it doesnt keep the mouse mostly in the center. i understand why it wont be all the time because the mouse has to move but it shouldnt be where it is surely it would be only slightly around the center depending on what direction you moved.

Edit: i noticed it works for 3x3 as it seems to center around the center box, but for things like even numbers it centers round the box down and to the right. Rather than the very center of the shape which would be offset to the grid. At least i see what it is doing.
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 11th Feb 2013 00:15
An even number of boxes would be off center because there's no center box to position over the mouse.

"You're not going crazy. You're going sane in a crazy world!" ~Tick
Ortu
DBPro Master
16
Years of Service
User Offline
Joined: 21st Nov 2007
Location: Austin, TX
Posted: 11th Feb 2013 06:03 Edited at: 11th Feb 2013 06:22
you can use modulus to check for odd/even and apply an additional offset of 1/2 tile to the even number objects to maintain the centering.

if the modulus 2 of the boxes is 0 it is even, if it is 1 it is odd.

this gives you 1 grid square worth of space to move the mouse within centered on the object center, equal to the 1 grid square space at the center of an odd number object.

to handle rectangular objects, you will need to check both the x tile count and the y tile count to determine which/both need to get an offset



I've added a drawCenter function which for me makes the centering feel more visually natural, since the mouse can move around in a grid squares worth of space.



Login to post a reply

Server time is: 2024-03-29 10:35:29
Your offset time is: 2024-03-29 10:35:29