I'm about to write one of those Translation/Rotation/Scale handles, but honestly i don't know the math behind those GUI thingys.

The thing that i couldn't figure out is how do they appear with a constant size on screen? On the top of my head i would projected the target object position on a plane that is somewhere between the near and the far plane, and draw the gizmo at that point, but that won't work well with the perspective projection(EDIT: or will it?).

Another thing is to project the target object position(objPos) on the screen, and additionally project these points
objPos + (1,0,0); objPos + (0,1,0); objPos + (0,0,1) and determin how X,Y,Z change in screen space and then draw the gizmo in 2D.

Do you guys know a trick on how to implement this esier?

I do something similar to Daixiwen. If you want the gizmo to remain the same size onscreen with a perspective camera you can use the following code to set the scale:

const float gizmoSize = 0.2f;
float scale = gizmoSize * ((camPos - gizmoPos).length() / tanf(cam->getFovY() / 2.0f));

You probably want to clamp the scale between some values that make sense for you. The gizmoSize depends on how large the gizmo mesh is, how large you want it to be etc.

I feel so reatarded right now "tanf(cam->getFovY() / 2.0f)" this is the xScale in the perspective projecton, however I don't understand yet the camera distance part, but will see it in practice as soon as i get home.

Thanks guys!

Any other suggestions are welcome!

EDIT:

float scale = gizmoSize * ((camPos - gizmoPos).length() / tanf(cam->getFovY() / 2.0f));?

That's works pretty amazin thanks! Recommend with 3 hands.

I've worked a bit on these kinds of transform gizmos. The approach I took was to transform the user click to a world-space ray and do 3D collision detection in world space. Things like distance of ray to ring, distance of ray to sphere, ray vs AABB, etc. I would also take a look at how Maya transform tools work, and then figure out the finer details of how things are implemented by observation. I recall the rotation tool in Maya had some quirks that can be fixed in a more intuitive way if you write a tool by-hand yourself.

The thing that i couldn't figure out is how do they appear with a constant size on screen?

A simple thing to do is to draw things in screen space directly.

Overall a good working knowledge of the graphics pipeline and collision detection would be very helpful for implementing these kinds of gizmo tools. You can look into "Essential Mathematics" by Van Verth if you want to learn more math details.

You are looking for what is called 'Direct Manipulation':

http://www.codeproject.com/Articles/35139/Interactive-Techniques-in-Three-dimensional-Scenes

https://www.researchgate.net/publication/244508355_The_design_and_implementation_of_direct_manipulation_in_3D

The first link has a bunch of references. You might need to scan them to find out what is useful for you. I also recommend looking at Maya, Max or UnrealEd and see how their manipulators work. Artists are used to these tools and expect custom tools to behave very similar.

Here the way I use to have the gizmo always big enough on the screen :

const float ScaleFactor = 5.0f;
const float ScreenScale = ( CenterSelection - CameraPos ).Length() / ScaleFactor;