UGUI-Unity滚动文本设计

9月前作者：可否摆烂分类：Toy博客阅读(43) 违法举报

这篇具有很好参考价值的文章主要介绍了UGUI-Unity滚动文本设计。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

目录

前言

一、设计步骤

1.在Hierarchy窗口右键UI，创建Image

2.在NoteBG下创建Text文本框，并添加文字内容

3.在NoteBG下创建新的Image

4.在TextBG上添加Unity自带的脚本Scroll Rect和Mask

5.在NoteBG下添加滚轮Scrollbar

6.将Scrollbar组件挂载到TextBG组件中Scroll Rect脚本的Vertiacl Scrollbar属性

滑动文本框就实现啦！

前言

滑动文本框是UI设计中常见的一种，在各类型的游戏中都有所涉及。本文介绍了如何在Unity中设计简单的滑动文本框。

一、设计步骤

1.在Hierarchy窗口右键UI，创建Image

Image作为滑动文本框的背景图层，方便起见命名为NoteBG

UGUI-Unity滚动文本设计

2.在NoteBG下创建Text文本框，并添加文字内容

在创建的Text文本框，调整合适的宽度和高度（高度可以超出NoteBG，要把文字完全显示，不然会因为文本框过小导致文字缺失）。在文本框中加入文字，调整到所需要的大小。

3.在NoteBG下创建新的Image

将新的Image取名为TextBG，作为文本框的背景层。宽度最好等于文本框（后续可以进行调整），将Text拖进TextBG

UGUI-Unity滚动文本设计

此时的场景：

UGUI-Unity滚动文本设计

4.在TextBG上添加Unity自带的脚本Scroll Rect和Mask

Scroll Rect脚本控制指定的组件拖动

设置一下参数：

UGUI-Unity滚动文本设计

取消Horizontal的勾选，因为我们只需要上下移动。

此时会发现拖动的文本会超出NoteBG，非常的不美观。所以我们在TextBG上添加Mask脚本，该脚本可以截取超出的部分。

UGUI-Unity滚动文本设计

5.在NoteBG下添加滚轮Scrollbar

将Scrollbar组件放到合适的位置即可（我放到了Text文本的右侧）。找到Scrollbar的属性面板中的Direction属性，将其更改为Bottom to Top。

6.将Scrollbar组件挂载到TextBG组件中Scroll Rect脚本的Vertiacl Scrollbar属性

UGUI-Unity滚动文本设计

该属性的功能就是将文本与滚轮建立关联。文章来源地址https://www.toymoban.com/news/detail-474576.html

滑动文本框就实现啦！

到了这里，关于UGUI-Unity滚动文本设计的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

Unity UGUI的ScrollRect（滚动视图）组件的介绍及使用

ScrollRect（滚动视图）是Unity UGUI中的一个常用组件，用于在UI界面中创建可滚动的区域。通过ScrollRect组件，可以实现在有限的空间内显示大量的内容，并且可以通过滑动手势来浏览内容。 ScrollRect组件通过将内容放置在一个可滚动的矩形区域内，然后通过拖动或滑动手势来改变

2024年02月09日
浏览(48)
Unity UGUI的Scrollbar（滚动条）组件的介绍及使用

Scrollbar组件是Unity中UGUI系统提供的一种UI组件，主要用于在UI界面中提供滚动条功能，使用户可以通过滚动条来查看超出屏幕范围的内容。 Scrollbar组件的工作原理主要是通过改变滚动条的位置来改变关联的内容的显示位置。当用户拖动滚动条时，Scrollbar组件会根据滚动条的位

2024年02月13日
浏览(40)
【Unity-UGUI控件全面解析】| Scrollbar 滚动条组件详解

🎬 博客主页：https://xiaoy.blog.csdn.net 🎥 本文由呆呆敲代码的小Y 原创，首发于 CSDN 🙉 🎄 学习专栏推荐：

2024年02月06日
浏览(39)
【Unity-UGUI控件全面解析】| ScrollView 滚动视图组件详解

🎬 博客主页：https://xiaoy.blog.csdn.net 🎥 本文由呆呆敲代码的小Y 原创，首发于 CSDN 🙉 🎄 学习专栏推荐：Unity系统学习专栏 🌲 游戏制作专栏推荐：

2024年02月06日
浏览(48)
【Unity3D-UGUI系列】（十二）ScrollView 滚动视图组件详解

推荐阅读 CSDN主页 GitHub开源地址 Unity3D插件分享简书地址我的个人博客 QQ群：1040082875 大家好，我是佛系工程师 ☆恬静的小魔龙☆ ，不定时更新Unity开发技巧，觉得有用记得一键三连哦。首先，介绍一个UGUI，NGUI是UGUI的前身，Unity开发团队将NGUI的开发团队收到自己开发团队

2024年02月05日
浏览(49)
Unity UGUI的Text（文本）组件的介绍及使用

UGUI（Unity Graphic User Interface）是Unity引擎的一套用户界面系统，而Text（文本）组件是UGUI中用于在游戏界面中显示文本的组件。该组件可以用于显示游戏中的文字、数字、标签等信息。使用UGUI的Text组件可以在游戏界面中实时显示文字信息，方便玩家了解游戏的状态、交互信息

2024年02月12日
浏览(61)
【Unity-UGUI控件全面解析】| Text文本组件详解

🎬 博客主页：https://xiaoy.blog.csdn.net 🎥 本文由呆呆敲代码的小Y 原创，首发于 CSDN 🙉 🎄 学习专栏推荐：Unity系统学习专栏 🌲 游戏制作专栏推荐：游戏制作 🌲Unity实战100例专栏推荐：Unity 实战100例教程 🏅 欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正！ 📆 未来很长

2024年02月04日
浏览(56)
Unity2D 实现UGUI滚动鼠标滑轮以鼠标位置点为中心缩放图片

先放参考文章： Unity3d UGUI以鼠标位置点为中心缩放图片（含项目源码） https://blog.csdn.net/qq_33789001/article/details/117749837 再放实现效果：说说事情缘由，项目需要用到这个效果，所以上网找了个参考文章，后来不知道为什么失效了，所以想着自己改改，看看是什么毛病。贴原

2024年02月11日
浏览(48)
unity ugui text 超链接和下划线，支持部分富文本格式

unity版本：2021.3.6f1 局限性： 1.测试发现不能使用 size 富文本标签, 2.同一文本不能设置不同颜色的超链接文本其它：代码中注释掉使用innerTextColor的地方，可以使用富文本设置超链接颜色，但是下划线是文本本身颜色项目需要用到该功能，搜索和参考了很多文章，要么不支

2024年02月03日
浏览(42)
Unity 中创建滚动文本

首先创建Image（note）在note下面再创建一个Image（作为背景）为了实现滚动效果，在Image上面添加Scroll Rect这个组件同时选定对象（Content）如果需要制作横向的滚动条，则勾选Horizontal，反之，纵向勾选Vertical 然后添加text文本，根据自身需求调整文字大小将text放在Image下作

2024年02月12日
浏览(36)