【Unity3D_UGUI速成班】——01. Text
2017-03-20 10:53
134 查看
0. 前言
UGUI是脱胎于NGUI、和Unity3D兼容性更好、并且更好设置和操作的控件,在UI界面设计——尤其是手机端设计中有不可或缺的作用。【UGUI速成班】,旨在带领大家对UGUI有一个快速的了解,并在课程结束之后,能够使用Unity3D中的UGUI模块进行一些基础的UI交互设计,包括图片、进度条、按钮、滚动页面等等,当然由于是俗称,对于部分功能不会过分详细。当中的一些课题,笔者更将在日后附上自己的实用案例,帮助大家提升。好的,接下来让我们进入正题。笔者使用的Unity版本是Unity5.4.2(64bits),但课程中介绍的UGUI功能只要是4.6以后的版本都有,所以大家不用太在意。脚本一律采用C#语言编写。
------------------------------------------------------------------------------------
1. Text
新建一个Unity工程,在Hierarchy下右键==>UI,拓展菜单有13个栏目,点选最上方的Text。那么在Hierarchy栏目下会多出携带了Text的Canvas控件和EventSystem控件。EventSystem是事件响应器,我们暂时不用管他。
Text控件专门呈现UI层级上的文字显示,通常可用于呈现界面主标题和图片、按钮的配字。
此时选中Text控件,在Inspector栏目下查看,可以发现两个值得留意的部分,一是Rect Transform组件,与正常object的Transform组件不同,所以这是UGUI物体的固定组件,在以后的课程中将会详述,当前只要知道设置其中的Width和Height来改变UGUI物体的宽和高就可以了;另一个是Text组件,将是我们的重头戏:Text组件下有Text(红)、Character(黄)和Paragraph(蓝)几个子块,分别对应我们WORD编辑器中的内容、文字属性和段落属性等部分:
(1) New Text用于内容编写,特殊之处在于UGUIText支持富文本编写,本篇末的代码里将会详述。
(2)Character:
① Font是字体,默认字体是Arial,表面上我们没有别的选项,但是在电脑路径中的“控制面板\外观和个性化\字体”下,能找到本机能够显示的所有字体,大家可以选择自己喜欢的字体文件,将之拷贝到工程的Assets文件夹下,这样就能够选用心仪的字体了。
② Font Style是显示格式,粗体、斜体、斜粗体。
③ Font Size是字号,UGUI默认是14号字,最大是300号。
④ Line Spacing是行间距,默认为1.
⑤ Rich Text是对于富文本的权限,如果将之反勾选,原先为Text输好的富文本文字将会一五一十地呈现屏幕。
(3)Paragraph:
① Alignment不解释了
② Horizontal/Vertical Overflow是选择当输入内容超出Text宽/高度时是否自动换行/列。
③ BestFit是个神奇的选项,当被勾选时,下方将会弹出这样一个框来自主设定上下限。
Text内容将会以最合适的大小(上下限之间)来填充你所设定的Text尺寸。但是无论如何都不会超过字体最大值300。Best Fit会根据Horizontal/Vertical Overflow的结果来评估Text框的大小,大家可以试一下。
剩下的部分,除了Raycast Target是允许让这个Text成为射线碰撞体(其实UGUI控件都有这个,以后不介绍了),其余的不解释了,看代码吧,上车!
using UnityEngine; using System.Collections; using UnityEngine.UI;//凡是对UGUI进行编辑的脚本都需要使用这个命名空间。 public class teachText : MonoBehaviour { //Text是UI命名空间下的类,public后拖进一个已经建好的Text控件即可使用。 public Text test1; // Use this for initialization void Start() { } // Update is called once per frame void Update() { //直接在代码里编辑富文本内容! test1.text = "我要成为UGUI的<color=\"red\">绝世高手!</color>"; //设定字号 test1.fontSize = 20; //设定颜色 test1.color = Color.blue; //响应鼠标点击 if (Input.GetMouseButtonDown(0)) { //关闭富文本支持 test1.supportRichText = false; //激活 Best Fit test1.resizeTextForBestFit = true; } } }代码运行前:
运行时:
鼠标左键点击后:
要点:
① 被<color=”red”>…… </color>所框选的内容(红色),不会受到对text内容颜色的整体控制(蓝色)。
② 在代码中<color=”red”>的两个分号前都加了\号,这是因为C#代码中的引号不是常规引号,而是有前置转义字符的\”,只有这样才能将引号纳入C#字符串中。
③ Text变量下的内容、字号、颜色、bestFit、富文本都是可用代码修改的,大家可以做更多的尝试。
相关文章推荐
- 【Unity3D_UGUI速成班】——09. InputField
- 【Unity3D_UGUI速成班】——02.Image
- 【Unity3D_UGUI速成班】——03.Button
- 【Unity3D_UGUI速成班】——07.Scrollbar
- 【Unity3D_UGUI速成班】——08.ScrollRect
- 【Unity3D_UGUI速成班】——04. Canvas 4000
- 【Unity3D_UGUI速成班】——05.Rect Transform
- 【Unity3d】将PSD直接导出成UGUI界面(一)
- Unity3D 使用“Shift+Tab”和“Tab”键 上下切换 UGUI下 Dropdown和inputfield等控件的控制顺序
- Unity3d之UGUI- Image拦截Button响应事件
- 【Unity3D】UGUI自适应屏幕与锚点
- unity3d ugui
- 基于Unity3D(UGUI)的背包系统<三>
- Unity3D ugui 界面状态控制
- Unity3D 05-理解Unity的新GUI系统(UGUI)
- Unity3D 官方文档 UGUI的总览 Canvas和EventSystem的认识
- Unity3D UGUI之自制定时器(二)
- Unity3D中uGUI事件系统简述及使用方法总结
- unity3d Ugui 5.x学习GridLayoutGroup 脚本创建预设并改变外面容器的大小及单例模式
- Htc Vive Sdk(OpenVR),Unity3d 开发,UGUI界面响应