unity中跟随鼠标浮动的面板,并可以自适应文字内容的大小

我们经常会用到浮动面板的功能,比如鼠标移动到某个物体上,显示这个物体的名字等信息
为此我制作了一个可以根据文本内容自适应内容大小的面板
该面板的结构如下
请添加图片描述

一共有三个物体,InfoText名字不能改其余可以
物体1: RoomInfoPanel由四个关键组件,说明如下

1 Text 用于根据文字大小自适应尺寸,这个文本是透明的,不给用户看,且字号要比真正用于显示的InfoText稍大
2 FloatInfoPanel,用于设置显示的文字,代码如下,可根据需要修改

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

/// <summary>
///房间信息的浮动面板
/// </summary>
public class FloatInfoPanel : MonoBehaviour
{
    /// <summary>
    /// 自身的Text组件,这个Text是完全透明的,用于控制自适应面板大小
    /// </summary>
    private Text textSelf;
    /// <summary>
    /// 显示信息用的文本框
    /// </summary>
    private Text infoText;

    /// <summary>
    /// 设置悬浮显示的监控摄像头信息
    /// </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 面板跟随鼠标移动,挂上即可,代码如下

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

/// <summary>
/// 面板跟随鼠标浮动
/// </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 自适应尺寸
需要注意,锚点要为点状,放在左下角,轴点可根据需要放置,建议靠左,或左下

物体2 BG,面板背景,四边和RoomInfoPanel对齐
物体3 InfoText 给用户看的文字

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值