Dynamically added UI text is not displaying
The UI text that I've added is not rendering on my screen, and I cannot figure out why.
I followed the exact same steps as I'm using to dynamically add a UI image.
In the scene at run time, the RectTransform appears where it should (in the middle of the screen canvas) - but the text that it says has been set in the inspector is not showing.
Here is my code:
private Text SetHealthUiText(Canvas canvas)
{
var uiObject = new GameObject(Unit.Name + "HealthUi");
var rectTransform = uiObject.AddComponent<RectTransform>();
rectTransform.SetParent(canvas.transform);
rectTransform.localScale = Vector3.one;
rectTransform.localPosition = Vector3.zero;
rectTransform.position = Vector3.zero;
rectTransform.anchoredPosition = Vector2.zero;
rectTransform.sizeDelta = new Vector2(50, 50);
var text = uiObject.AddComponent<Text>();
text.font = new Font("Arial");
text.fontSize = 14;
text.color = Color.black;
text.text = "0";
return text;
}
What am I missing?
Answer by lnwhitling · Apr 12, 2020 at 08:19 AM
Ok - I finally got to the bottom of this.
Specifying the font is necessary - and of course I was doing that incorrectly.
The fault in my code was: text.font = new Font("Arial");
It should have been: text.font = (Font)Resources.GetBuiltinResource(typeof(Font), "Arial.ttf");
In the inspector, when I paused the scene, it showed Arial as being the font, so I assumed that this wasn't a problem. Egg on my face.
Answer by streeetwalker · Apr 10, 2020 at 11:46 AM
@lnwhitling, If you see the text you set in the inspector and you are satisfied it is in the location where you should see it, but it does not show on the screen, then it could be the width and height of the Text element is not big enough.
Try increase the width to like 200 and maybe the height. You can fiddle with those values in the inspector while the game is running to find the right values. (or any of the other values if changing the size doesn't fix it. )
Hmm, the object is definitely appearing in the scene. And the inspector is definitely showing expected values. And the rect transform is where I would expect it.
I've changed the width and height of the rect transform substantially (is this what you meant by increasing width and height?), changed the text length, and upped the font size, but no joy.
Is there a possibility that the text is rendering outside of the rect transform?
If a text element's width or height is not big enough to accommodate the string length at a given font size, I have consistently noticed the element doesn't display anything on the screen.
$$anonymous$$ake the font size smaller, and the width larger to see if that is the problem.
You can test it yourself directly in the editor: create a UI text element and put some text into the Text component in the inspector. Then change the size of the width and height until the text disappears. Or leave them the same and increase the font size until it disappears.
Yea - I played around with all that stuff. But because I wasn't correctly specifying the font, it wasn't rendering it.
Having seen it work, I can happily say that I'm going to immediately abandon this in favour of using a Text$$anonymous$$eshPro element ins$$anonymous$$d.