照例打个广告,欢迎大家去论坛讨论,点击打开论坛
1.UILabel简介
(1)UILabel支持类型
a.图字:是指根据某些工具,将游戏中需要用到的文字渲染到一张纹理上,并附其纹理信息(包括id值,尺寸,间距等)。
b.字库字:是指直接载入ttf等字库文件,根据从ttf文件中读取的数据,生成纹理并渲染。
(2)UILabel基本属性
Font类型:上述介绍的图字和字库字(Bitmap与Dynamic)
Text:文本
Overflow:溢出时选项,包括所发,裁剪,扩充等
Spacing:间距
MaxLines:最大行数
Encoding:是否支持颜色和表情
Gradient:(默认关闭),颜色渐变效果
Effect:特效,包括描边,阴影
(UIWidget属性不在赘述)
2.UILabel绘制
UILabel根据类型不同(图字,字库字),其组织顶点,uv,颜色的方式有所区别,主要区别在于字库字是Unity3d支持的,图字是NGUI实现的,过程大同小异,这次用图字举例,即UIFont(字库字请参考NGUIText.cs)
(本文不详细讨论NGUI中控件是怎样通过组织DrawCall顶点属性并渲染的,留到UIPanel和UIWidget中去分析,这里主要分析一下UILable是怎么组织顶点属性的)
(1)原理
本文以图字模式举例,前面已经介绍过了,图字的原理是将UI中所需要的文字合成到同一张纹理(也可以是多张),并附其每个字符的描述信息,目的在于渲染时可以得到文字的“uv”,根据属性中设置的位置确定其顶点“位置”,然后对其颜色属性的设置,可以确定每个顶点的“颜色”信息,这样,就满足了Shader对于顶点属性的基本要求,即位置,uv,颜色。
对于图字模式来说,其实和2d中常用的SpriteSheet很类似,只不过SpriteSheet中每个元素是Sprite帧,而图字纹理中是每个可能用到的字符。
(2)实现
图字模式的组织顶点属性的方法在
UIFont.Print(stringtext,BetterList<Vector3>verts,BetterList<Vector2>uvs,BetterList<Color32>cols)
(具体请参考源码,这里只给出步骤)
a.对于UILable中属性进行初始化赋值及简单元算,包括顶点属性(位置,uv,颜色),解析(颜色和表情)。
b.遍历文本中的每个字符,组织其顶点属性
c.先获取当前字符的BMSymbol信息(前文提到的字符描述信息)
d.位置:在原位置基础上加上偏移,宽高值(来源于BMSymbol,是生成图字纹理时设置生成的,对于每个字符不同)
e.uv:同上,根据BMSymbol
f.颜色:这个属性是根据在UILabel面板中的设置而来的,即前文设置的GradientBottom和GradientTop,这里需要注意的是每个字符的高度不同,从而导致字符所在矩形的上下边界点颜色并不与设置GradientBottom和GradientTop完全相同,而是根据字符的高度和行高插值出来的!代码如下
3.UILabel中的Gradient
效果如图
设置如第一幅图,GradientBottom设置为纯绿色(0,1.0,0,1.0f),GradientTop设置为纯红色(1.0f,0,0,1.0f)。(PS:只为举例,不代表个人审美)
其实相对于UILable的绘制,添加Gradient属性并不是什么难事,之前的NGUI只支持纯色(但是可变颜色)的文本,添加Gradient属性之后,即对字符的颜色根据字符信息,定位每个字符的颜色变化值(不是精确的属性中设置的纯绿色和纯红色,因为每个字符的高度不同,所以字符最上面和最下面的颜色为纯绿色和纯红色之间的某个值而不同),再由Shader插值出渐变的颜色效果。
分享到:
相关推荐
Unity3D教程:利用NGUI制作超链接 Posted on 2013年02月22日 by U3d / Unity3D 基础教程/被围观 469 次 Unit
Unity开发的朋友,做UI的时候,选择NGUI比GUI更好用。最新版本的unity3d扩展插件:NGUI+Next-Gen+UI3.0.2.unitypackage 解压后运行Unity3D,在菜单Assets中选择自定义导入。 如果无法导入时,请检查导入目录中是否...
查找NGUI中UIlabel的路径,自己写的,要用下载吧。
不过不得不说的是,NGUI有个好处是消耗的DrawCalls比较少,基本就一个,所以如果做手机应用的话,NGUI肯定是比较不错的。之所看NGUI,因为自己本身也
Unity3D插件NGUI中运用Atlas Front和 制作Atlas和Font的步骤 并在unity3d使用
Unity NGUI 滑动列表渐变缩放,偏移,渐变 Demo 博客地址:https://blog.csdn.net/qq_30259857/article/details/79562652
unity3D GUI插件(NGUI+iGUI+EZGUI)
Unity编辑器:基于NGUI的引用检测工具
NGUI Next-Gen UI 3.6.0.unitypackage NGUI Next-Gen UI 3.12.1(u5.6.5).unitypackage NGUI Next-Gen UI 2019.3.0.unitypackage NGUI Next-Gen UI v2018.3.0.unitypackage NGUI Next-Gen UI v2018.3.0c(u2018.3.0)....
Unity3d之NGUI简单计算器入门,可以作为简单的入门学习,具体步骤参照我博客http://blog.csdn.net/wyz365889/article/details/9326473
最新版NGUI3.10.2是严格遵循KISS原则并用C#编写的Unity(适用于专业版和免费版)插件,提供强大的UI系统和事件通知框架。其代码简洁,多数类少于200行代码。这意味着程序员可以很容易地扩展NGUI的功能或调节已有功能...
适用于unity3d2018的 NGUI插件 在Unity 项目中,Project视图下ASSETS文件夹上,右键 【Import Package】-->【Custom Package】,选择刚刚下好的 NGUI3.12.1插件包。然后,全部导入。
Unity3D_NGUI实战教程
NGUI Next-Gen UI v3.12.1 Unity3d 2018版插件资源NGUI
Unity3D NGUI for GUI developing
Unity 3D NGUI实战教程.pdf(大小84.4M),有出现10几M pdf 那才36页,原书有233页
一部分的目录东西太多了 行为控制脚本 鼠标的路线 Unity3D教程:游戏玩家服务器的制作 Unity3D教程:实例化 JS脚本控制逐渐淡出的欢迎界面 Unity3D教程:界面插件NGUI的使用 (2) 脚本控制物体的变换 脚本的运行顺序...
unity3d NGUI最新版 v2.3.4
Unity3D 界面插件 NGUI基础学习,带图详解 1.创建你的界面 2.精灵Sprite 3.SlideSprite 4.拼贴精灵TiledSprite 5.标签 6.按钮 7.滑块 8.复选框 9.输入框 10.2D转3D
版本 3.6.8;;;;配套的NGUI做好的demo;配套的NGUI做好的demo;配套的NGUI做好的demo;配套的NGUI做好的demo;