- Home /
Convert RectTransform rect to screen space
I have a RectTransform that is the child of several other RectTransforms. Is there a way for me to convert the child RectTransform's rect property (which is in the local space of the transform) into global screen space (essentially pixel coordinates relative to a corner of the screen)?
Edit: My Canvas is set to Screen Space - Camera and is rendered by the main camera.
Is this what you are looking for?
http://answers.unity3d.com/questions/826851/how-to-get-screen-position-of-a-recttransform-when.html
I have looked at that, but it doesn't seem to work. Here is the code I wrote, please let me know if I should change anything. $$anonymous$$y Canvas is set to Screen Space - Camera and is rendered by the main camera. This script is attached to the RectTransform whose rect I need to find in screen coordinates:
Vector2 screenPos = RectTransformUtility.WorldToScreenPoint(Camera.main, transform.position);
print(screenPos);
However, while my RectTransform is entirely on screen (its pivot point and anchors are on screen too), the script outputs:
(-116.3, -429.3), which is not what I would expect. $$anonymous$$aybe the RectTransform position isn't correct, but I don't know to fix that.
Answer by Malkyne · Dec 13, 2015 at 08:14 PM
Try this out:
public static Rect RectTransformToScreenSpace(RectTransform transform)
{
Vector2 size = Vector2.Scale(transform.rect.size, transform.lossyScale);
return new Rect((Vector2)transform.position - (size * 0.5f), size);
}
This worked flawlessly for what I needed. Thank you
Thanks, great solution. Just one correction in last string (because pivot may not be in the center):
return new Rect((Vector2)transform.position - (size * transform.pivot), size);
This doesn't work if the RectTransform has a negative scale on one axis (i assume the position probably went into the negatives, which it shouldn't have), which was very hard to figure out in my case for why just one of my buttons weren't working. To correct for that, you can use this code to calculate size
(is there really no Vector3.Abs in Unity?)
Vector2.Scale(transform.rect.size, new Vector3(Mathf.Abs(transform.lossyScale.x), Mathf.Abs(transform.lossyScale.y), Mathf.Abs(transform.lossyScale.z)))
@Terrain22 I wouldn't add code to account for a negative scale on the UI, I think it would be much better practice to fix the UI scale as it can lead to a lot of problems down the road, and ones that are hard to troubleshoot if you don't fix it. If you have a really good reason for using negative UI scale I suppose that works, but would definitely correct it otherwise.
I agree, it's probably a better idea to fix the scale in most cases. In my case, i was working on a project i didn't originally create the UI for, and it flipped a sprite using a negative scale - this was easily fixed since it was symmetric so i could just rotate it instead, but in other cases you might need a new sprite that's flipped instead of using the scale to flip it.
Answer by JohannesMP · May 04, 2019 at 10:22 PM
I wanted to draw a bounding box of some UI elements when in editor, regardless of their orientation.
The easiest way I found that completely handles all cases of nesting, rotation, scaling, anchor offsets, etc. was to use RectTransform.GetWorldCorners and manually compute the Bounds:
private static Vector3[] WorldCorners = new Vector3[4];
public static Bounds GetRectTransformBounds(RectTransform transform)
{
transform.GetWorldCorners(WorldCorners);
Bounds bounds = new Bounds(WorldCorners[0], Vector3.zero);
for(int i = 1; i < 4; ++i)
{
bounds.Encapsulate(WorldCorners[i]);
}
return bounds;
}
Since calls that require a Rect typically are defined as existing on the XY plane (such as Gizmos.DrawGUITexture), computing a rect from the bounds is trivial.
Here is an example:
private static Texture2D MakeTexture(float opacity)
{
Texture2D texture = new Texture2D(2, 2, TextureFormat.ARGB32, false, true);
texture.SetPixel(0, 0, new Color(1, 0, 0, opacity));
texture.SetPixel(0, 1, new Color(0, 1, 0, opacity));
texture.SetPixel(1, 0, new Color(0, 0, 1, opacity));
texture.SetPixel(1, 1, new Color(1, 1, 1, opacity));
texture.Apply();
texture.filterMode = FilterMode.Point;
return texture;
}
public float opacity = 0.5f;
private Texture2D tex = null;
private void OnValidate() => tex = MakeTexture(opacity);
private void Awake() => tex = MakeTexture(opacity);
private void OnDrawGizmos()
{
Bounds bounds = GetRectTransformBounds(transform as RectTransform);
Rect screenRect = new Rect(bounds.min, bounds.size);
Gizmos.DrawGUITexture(screenRect, tex);
}
And the result:
Answer by Tobias-Pott · Nov 02, 2016 at 03:28 PM
Although it's been a while since this question was active, I've stumbled across it and came up with an extended solution. Because I needed a similar function but the above solutions didn't take non-default pivots on a RectTransform into account, I've picked up adamonline45's solution and added a position shift by the transforms pivot multiplied by it's screen size. The 1.0 - transform.pivot.y is done due to the flipped y-axis.
public static Rect RectTransformToScreenSpace(RectTransform transform)
{
Vector2 size = Vector2.Scale(transform.rect.size, transform.lossyScale);
Rect rect = new Rect(transform.position.x, Screen.height - transform.position.y, size.x, size.y);
rect.x -= (transform.pivot.x * size.x);
rect.y -= ((1.0f - transform.pivot.y) * size.y);
return rect;
}
I've tested it with some GUI.Box calls in an OnGUI() method, which worked fine as it overdraw the UI button I used as RectTransform.
Answer by IVxIV · Sep 08, 2016 at 08:11 PM
Here's a slightly modified version of the above solution which also accounts for UI anchor positions (in case anyone else comes across this topic like I did):
public static Rect RectTransformToScreenSpace(RectTransform transform)
{
Vector2 size= Vector2.Scale(transform.rect.size, transform.lossyScale);
float x= transform.position.x + transform.anchoredPosition.x;
float y= Screen.height - transform.position.y - transform.anchoredPosition.y;
return new Rect(x, y, size.x, size.y);
}
Answer by Remal · Dec 29, 2019 at 12:08 PM
After many hours, this is what worked for my case:
private static Rect GetScreenPositionFromRect(RectTransform rt, Camera camera)
{
// getting the world corners
var corners = new Vector3[4];
rt.GetWorldCorners(corners);
// getting the screen corners
for (var i = 0; i < corners.Length; i++)
corners[i] = camera.WorldToScreenPoint(corners[i]);
// getting the top left position of the transform
var position = (Vector2) corners[1];
// inverting the y axis values, making the top left corner = 0.
position.y = Screen.height - position.y;
// calculate the siz, width and height, in pixle format
var size = corners[2] - corners[0];
return new Rect(position, size);
}
Your answer
Follow this Question
Related Questions
Transform.rotation is setting local rotatoin 0 Answers
Convert local point in RectTransform to screen space 2 Answers
World Position Of Child Object Shifted After Parenting 1 Answer
Have child ignore parent's tag? 1 Answer
Make a simple tree 1 Answer