A tool to help with position and size
by David House · in Torque Game Builder · 04/22/2005 (9:56 am) · 13 replies
I got inspired from the debug button tool from Matt Langley, so I created one that will help figure out position and size for you. When you have a mock up done in your favorite paint program, trying to figure out the T2D coordinates for everything is a pain. With this tool, its a breeze!
I'm considering making this a resource unless someone has already done something similar. Give me some feedback so I know if this is usefull to anyone else.
Here is how it works. Similar to Matt's resource, you just create a GUI file named SizerBox.gui ( don't worry, I'll put all the code in the resource ). Then you add that to your scene, and you get a screen that looks something like this after you click the 'Visible' button:
See the little pink box? Well that is the sizer box. You can see at the top that its currently at position 0,0 with a size of 10x10. Those are the T2D coordinates. Notice that there are buttons to move the box around and size it. Also, you can simply type the position & size in the edit controls and click apply.
So the idea is that you can get the exact position & size of certain elements. In this example, I wanted to get the position and size of the area where all the shells will stack up. So I just moved the box around and resized a bit and I got this:
Now I've got the exact dimensions and position for that area of the screen. Once I'm ready to create a sprite or whatever at that position, I have the exact coords to plug into my script.
You can also hide the buttons by clicking the Hide button( just like Matt's buttons ).
So, will this help anyone? I'm going to use the heck out of it because before I was just drawing my screen on paper and trying to figure out the coords by hand.
Give me some feedback before I post this as a resource. Anything else that could be helpfull to add?
Oh, and thanks Matt for the great resource to base this from!
I'm considering making this a resource unless someone has already done something similar. Give me some feedback so I know if this is usefull to anyone else.
Here is how it works. Similar to Matt's resource, you just create a GUI file named SizerBox.gui ( don't worry, I'll put all the code in the resource ). Then you add that to your scene, and you get a screen that looks something like this after you click the 'Visible' button:
See the little pink box? Well that is the sizer box. You can see at the top that its currently at position 0,0 with a size of 10x10. Those are the T2D coordinates. Notice that there are buttons to move the box around and size it. Also, you can simply type the position & size in the edit controls and click apply.
So the idea is that you can get the exact position & size of certain elements. In this example, I wanted to get the position and size of the area where all the shells will stack up. So I just moved the box around and resized a bit and I got this:
Now I've got the exact dimensions and position for that area of the screen. Once I'm ready to create a sprite or whatever at that position, I have the exact coords to plug into my script.
You can also hide the buttons by clicking the Hide button( just like Matt's buttons ).
So, will this help anyone? I'm going to use the heck out of it because before I was just drawing my screen on paper and trying to figure out the coords by hand.
Give me some feedback before I post this as a resource. Anything else that could be helpfull to add?
Oh, and thanks Matt for the great resource to base this from!
#2
04/22/2005 (10:14 am)
Oooh... lol I've been doing the same (as David Blake)... very good idea, I highly suggest you submit it as a resource :) 
#3
This will save tons of time and aggrevation!
04/22/2005 (10:14 am)
This is awesome! Please put this up as a resource, and give us a temporary download link so we don't have to wait for it to be posted as a resource. This will save tons of time and aggrevation!
#4
SizerBox Code
Let me know if you run into any issues with getting it integrated with your code. Its only just a little more complicated than the Debug buttons. Only thing to watch out for is that is uses the 't2dSceneGraph' to create the sprite. If you have renamed that to something else, just do a search/replace in the SizerBoxGui.gui file.
04/22/2005 (10:43 am)
Wow, that was fast. OK, I have placed a zip file with the code on my webserver. I'll write up a proper resource sometime this weekend and submit it. But for now, just go to the following link and download the zip:SizerBox Code
Let me know if you run into any issues with getting it integrated with your code. Its only just a little more complicated than the Debug buttons. Only thing to watch out for is that is uses the 't2dSceneGraph' to create the sprite. If you have renamed that to something else, just do a search/replace in the SizerBoxGui.gui file.
#5
04/22/2005 (11:17 am)
Does it also work to let you determine local sprite (-1 to 1) coords? If not that would be evenm ore useful.
#6
Here are a couple of screen shots:
This one is when you first show the sizerBox
This one shows the mount point moved to a different position
I also updated the zip file above to include this.
Let me know if this is helpfull or not. Might be helpfull in figuring out mount points to sprites.
04/22/2005 (7:01 pm)
@John, OK, I have a first stab at this. Not sure if this is a great implementation yet, but I think its what you are looking for. What I did was add another node that is mounted to the sizerBox. It starts out at location "0 0". Its a 1 pixel texture, so its going to get sized according to the screen size. I added a whole extra line for the Mount point. Just move it around until you have the spot you want. The edit boxes will show you the x,y in local sprite coordinates.Here are a couple of screen shots:
This one is when you first show the sizerBox
This one shows the mount point moved to a different position
I also updated the zip file above to include this.
Let me know if this is helpfull or not. Might be helpfull in figuring out mount points to sprites.
#7
This is awesome! Is there anyway to load a sprite into the box to be able to see where your placing the sprite coordinates dot in relation to the actual sprite.... But now that I think about it I could also load the sprite and place the box over it and then position the sprite coordinate dot. But would still be nice to be able to load them in first. Im not a coder so Im not sure if this is tuff or not.
04/23/2005 (5:56 am)
@ david This is awesome! Is there anyway to load a sprite into the box to be able to see where your placing the sprite coordinates dot in relation to the actual sprite.... But now that I think about it I could also load the sprite and place the box over it and then position the sprite coordinate dot. But would still be nice to be able to load them in first. Im not a coder so Im not sure if this is tuff or not.
#8
You can find it at www.ramspeed.com. It's nothing to do with me, I just find it a great tool.
04/23/2005 (7:06 am)
There is a vertex plotter available which you could use in addition to Davids handy resource. It's a seperate app, but it will give you local coordinates for sprites. Handy for plotting collision polygons and link/mount points.You can find it at www.ramspeed.com. It's nothing to do with me, I just find it a great tool.
#9
04/23/2005 (7:43 am)
That vertex plotter is all but useless to me because of the way it works. It removes whitespace from the sprites so you end up placing coords in the wrong spots.
#10
04/23/2005 (8:13 am)
@Dale, You can easily load your sprite, then move the box over it and then work on the local sprite coordinates for mounting/particles, etc. But in a way it might be neat to load a sprite inside the box. If I get some time I'll see if it can be improved for that.
#11
The edit box contains the name of the imageMap to change to. The << and >> buttons will let you scroll through the datablocks you have defined. It automatically reads their names in when the GUi is started. Then just hit apply and it will change to that imageMap.
In this screenshot you see the banana sprite and i've moved the mount point to the tip of the banana. Can't get any easier than that!
Anything else?
04/23/2005 (3:01 pm)
OK, try this out for size. I added the capability to change to a different imageMap for the sizerBox. All you have to do is have the datablock defined and you can change to it. Here is the screenshot:The edit box contains the name of the imageMap to change to. The << and >> buttons will let you scroll through the datablocks you have defined. It automatically reads their names in when the GUi is started. Then just hit apply and it will change to that imageMap.
In this screenshot you see the banana sprite and i've moved the mount point to the tip of the banana. Can't get any easier than that!
Anything else?
#12
04/23/2005 (4:00 pm)
Saweet
#13
04/23/2005 (6:22 pm)
David you rock, thats perfect!
Employee David Montgomery-Blake
David MontgomeryBlake