How would I go about adding a tooltip to a Unity UI Image?

Question

I'm going to try out the community here once more, I haven't had very good look in the past with getting help.

I'm iterating through a series of List() and I'm creating a bar graph and a line graph based on those values, Later I'll replace the List with a file which it retrieves the values from. I'm having a problem though with creating a tooltip. I know how to add them to buttons created under OnGui() but that's about it. I've spent the past 2 days trying to figure this out and I'm just not sure how to go about making the bar images and dot's show up under public void OnPointerEnter(PointerEventData eventData) {} and OnPointerExit() I know that print(eventData.pointerCurrentRaycast.ToString()); will display the item I'm hovering over and it seems to work fine for everything except the GameObjects that are created by my script:

        private GameObject CreateBar(Vector2 graphPos, float barWidth)
    {
        GameObject gameObject = new GameObject("bar", typeof(Image));
        gameObject.transform.SetParent(graphContainer, false);
        gameObject.GetComponent<Image>().color = barColor;
        RectTransform rectTransform = gameObject.GetComponent<RectTransform>();
        rectTransform.anchoredPosition = new Vector2(graphPos.x, 0f);
        rectTransform.sizeDelta = new Vector2(barWidth * barWidthMultiplier, graphPos.y);
        rectTransform.anchorMax = new Vector2(0, 0);
        rectTransform.anchorMin = new Vector2(0, 0);
        rectTransform.pivot = new Vector2(.5f, 0f);

        return gameObject;
    }

If anyone could give me a hand on how to make this show up under eventData I can figure the rest out from there. Or if you have a better method you wouldn't mind sharing I would appreciate that.

Answer 1

Here is an easy solution for how you get it styled right and working without any need to write extra code.

1. create the Image/ Tooltip you want as a child of your element that should have the tooltip.
2. disable the element
3. attach a Event Trigger component to your ui element that should have the tooltip
4. add new event type: PointerEnter
5. select your component that should be displayed and the bool enabled, click the checkbox
6. add new event type: PointerExit, should be prefilled with the same values as from PointerEnter, just deselect now the checkbox

While this does not generate the toolbox via code, you have a lot more control and possibility to fine tune it.