Unity UGUI背包系统(五) 之 物品浮动提示框实现

 时间:2024-10-23 01:51:28

UnityUGUI背包系统(五)之物品浮动提示框实现。本节介绍鼠标移动到GridImage上对应显示浮动物品信息的文本提示框的简单案例,具体如下

工具/原料

Unity

UGUI

UGUI背包系统(五)之物品浮动提示框实现

1、在“KnapsackUI”下添加一个“Text”,并且命名为“ToolTip”,然蒹筻分虞后在“ToolTip”下面添加一个“Imag髫潋啜缅e”作为背景,一个“Text”作为文本显示,“Image”和“Text”都设置为扩展填充,“Text”的文字大小与“ToolTip”一致,“ToolTip”添加“ContentSizeFitter”组件,并设置为“PreferredSize”(目的随文本内容自动调整文本框大小),具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

Unity UGUI背包系统(五) 之 物品浮动提示框实现

Unity UGUI背包系统(五) 之 物品浮动提示框实现

2、在“View”文件夹下,新建一个脚本“ToolTip”,双击打开,编写代码,首先获取UI“ToolTip”上两个“Text”,实现显示、隐藏和设置位置接口与函数,具体代码和代码说明如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

3、“ToolTip”脚本具体粝简肯惧内容如下:usingUnityEngine;usingUnityEngine.UI;publicclassToolTip:MonoBe茑霁酌绡haviour{publicTexttoolTipText;publicTexttoolTipChildText;publicvoidUpdateTolTip(stringcontent){toolTipText.text=content;toolTipChildText.text=content;}publicvoidShow(){this.gameObject.SetActive(true);}publicvoidHide(){this.gameObject.SetActive(false);}publicvoidSetLocationPosition(Vector2position){this.transform.localPosition=position;}}

4、脚本编译正确后,回到Unity界面,把脚本“ToolTip”赋给UI“ToolTip”,并把UI“ToolTip”上的两个“Text”赋值给脚本“ToolTip”,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

5、在“View”文件夹下,新建一个脚本“GridImage”,双击打开或者右键“OpenC#Project”打开脚本,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

6、在打开的脚本“GridImage”上编辑代码,首先继承“IPointerEnter郡哏匙芥Handler,IPointerExitHandler”,然后添瑕铆幌约加两个进入退出UI“GridImage”的委托,接着在进入退出UI“GridImage”时调用对应委托,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

7、“GridImage”脚本擢爻充种的具体内容如下:usingSystem;usingUnityEngine;u霜杼厮贿singUnityEngine.EventSystems;publicclassGridImage:MonoBehaviour,IPointerEnterHandler,IPointerExitHandler{publicstaticAction<Transform>OnEnter;publicstaticActionOnExit;publicvoidOnPointerEnter(PointerEventDataeventData){if(OnEnter!=null){OnEnter(transform);}}publicvoidOnPointerExit(PointerEventDataeventData){if(OnExit!=null){OnExit();}}}

8、脚本编译正确后,回到Unity界面,把脚本“GridImage”赋给预制体“GridImage”,这样对应场景的UI“GridImage”也都会自动添加上该脚本,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

9、打开“KnapsackManager”脚本,添加吐下代码,实现浮动提示框的功能,具体代码和代码说明如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

Unity UGUI背包系统(五) 之 物品浮动提示框实现

Unity UGUI背包系统(五) 之 物品浮动提示框实现

10、脚本编译正确,回到Unity界面,选中UI“ToolTip”,把“Pivot”拖至到外左上角的位置,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

11、运行场景,按下鼠标中键,添加几个物品,把鼠标移动到物品上,就会看到浮动提示框的出现,具体如下图

Unity UGUI背包系统(五) 之 物品浮动提示框实现

12、到此,《UnityUGUI背包系统(五)之物品浮动提示框实现》讲解结束,谢谢

奇迹暖暖第二卷第一章攻略 oppoa37m怎么截屏 如何快手app短剧视频的观看历史记录的入口? 苦瓜怎么处理才不苦? 三国演义的阅读笔记怎么做
热门搜索
哑舍漫画 秀智图片 卡通人物画图片大全 开工图片 书包图片