The panel floating with the mouse in unity can adapt to the size of text content

We often use the function of floating panel , For example, the mouse moves to an object , Display the name of the object and other information
To this end, I made a panel that can adapt the content size according to the text content
The structure of the panel is as follows

There are three objects ,InfoText The name can't be the rest can
object 1： RoomInfoPanel Consists of four key components , The explanation is as follows

1 Text Used to adapt the size according to the text size , This text is transparent , Don't show users , And the font size is larger than that really used for display InfoText A little bigger
2 FloatInfoPanel, Used to set the displayed text , The code is as follows , It can be modified as needed

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

/// <summary>
/// Floating panel for room information 
/// </summary>
public class FloatInfoPanel : MonoBehaviour
{
    
    /// <summary>
    ///  Self Text Components , This Text It's completely transparent , Used to control the adaptive panel size 
    /// </summary>
    private Text textSelf;
    /// <summary>
    ///  Text box for displaying information 
    /// </summary>
    private Text infoText;

    /// <summary>
    ///  Set the surveillance camera information displayed in suspension 
    /// </summary>
    public void SetRoomName(string roomName)
    {
    
        if (textSelf == null)
        {
    
            textSelf = transform.GetComponent<Text>();
            infoText = transform.Find("InfoText").GetComponent<Text>();
        }
        textSelf.text = GameController.Instance.currentRoom_float;
        infoText.text = GameController.Instance.currentRoom_float;
    }
}

3 FloatWithMouse_Panel The panel moves with the mouse , Just hang it up , Surrogate mothers are as follows

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

/// <summary>
///  The panel floats with the mouse 
/// </summary>
public class FloatWithMouse_Panel : MonoBehaviour
{
    
    public float xoffset;
    public float yoffset;
    public float zoffset;

    private void Update()
    {
    
        print(Input.mousePosition);
        transform.position = Input.mousePosition + new Vector3(xoffset,yoffset,zoffset);
    }
}

4ContentSizeFitter Adaptive size
We need to pay attention to , Anchor points should be point shaped , Put it in the lower left corner , The pivot point can prevent , It is recommended to keep to the left , Or lower left

object 2 BG, Panel background , Four sides and RoomInfoPanel alignment
object 3 InfoText Text for users