首页 > 代码库 > 使用UILabel呈现图片和不同格式的文字

使用UILabel呈现图片和不同格式的文字

1、可以使用BBCode标记

[b]Bold[/b]                      粗体
[i]italic[/i]                         斜体
[u]underline[/u]               下划线
[s]strikethrough[/s]         删除线
[sub]sub[/sub]               下标
[sup]sup[/sup]               上标
[00ff00]设置颜色[-]           设置显示颜色

[url=http://www.cnblogs.com/mrzivchu/][u]博客[/u][/url] 链接

例如设置颜色:

UILabel的Text内容为:[99ff00]n[-]gui: tools

展示效果则为:

这里主要说一下设置连接:

单单的在UILabel的Text里面写入这个是不够的:[url=http://www.cnblogs.com/mrzivchu/][u]博客[/u][/url] 链接

点击是不会产生效果的,我们还要为此UILabel添加一个Collider和一个脚本

脚本如下:

 

 void OnClick()    {        UILabel lbl = GetComponent<UILabel>();        string url = lbl.GetUrlAtPosition(UICamera.lastWorldPosition);        Application.OpenURL(url);    }

 

脚本中的OnClick方法要想被触发,就必须要添加一个Collider,这个道理我想大家都懂得!

但要注意一点,假如UILabel的Text内容为:请点击[url=http://www.cnblogs.com/mrzivchu/]我的博客[/url]进入,欢迎大家来批评指正!

我只想点击《我的博客》四个字才去打开连接,而不是点击上面的任何字都可以打开连接,假如上面的文字尺寸是700x40,而《我的博客》四个字的尺寸是200x40,这时我们就可以设置Collider的Center和Size属性来设置点击的区域大小以满足我们的需求,可是当我运行程序的时候Center和Size会自动变为700x40,原来UILabel的Widget有个选项Collider,这个auto-adjust to match表示Collider大Size大小自动匹配为UILabel的Size大小,我们只要把这个勾取消即可!

如果你不想使用BBCode,那么UILabel有个选项BBCode,不勾选的话,就表示不使用BBCode

2、使用图片

我们只要在UILabel的Text里面写了:zwh:) 那么就会出现了一个笑脸图片:

 

为什么会这么神奇呢,原因在于你选择的Font,此处我选择的Font是Arimo20

Arimo20有三个关联的文件:

类型依次为:tga,prefab,txt

这时,我们点击prefab文件,在Inspector窗口的UIFont可以看到

其中可以看到我们熟悉的 :) 笑脸标记,我们这时点击笑脸对应的Emotion - Smile ,展现出来的就是那个笑脸图片,而这个笑脸图片是存在Wooden Atlas图集里面的,如果我们想用其他图片的话,我们可以向Wooden Atlas图集里面增加我们需要展现的图片,然后在下面填写一个约定好的标记,类似于 :) 这样的标记,选择我们想要展现的图片,Add即可,图片的尺寸最好是20x20,以保证和文字上下在一条水平线上!

UILabel的Text为:zwh(bird)zwh 

显示为:

因为我的图片是60x60的,所以和文字上下不一样齐了,这也是我为什么建议图片尺寸是20x20的原因了!

另外说一个问题,我也不知道是不是存在的bug

此处我们为UIFont选择的图集是Wooden Atlas,Sprite是Arimo 20,Arimo 20大概对应的是字符格式,如果此时我们点击Sprite,将会弹出Wooden Atlas里面包含的所有sprite精灵,当我们点击Arimo 14或者Arimo 18的话,那么应用此Arimo20的UILabel将会变形:

原本是这样的:,变成了这样:

 

为Sprite选择Arimo20已经还原不会来了,还是会变形!

解决方案:

就是点击UIFont下的Import Data,也就是导入和Arimo20关联的三个类型(tga,prefab,txt)的文件中的txt文件即可!从而使Arimo的字符集格式还原回来!

另外:

UILabel还有一个Symbols选项,他有三个值:None,Normal,Colored,选择None,那么以 :) 这样形式显示的图片将不会展示,选择Normal(默认)将正常展示,选择Colored,那么图片将会被UILabel下的Color Tint所选择的颜色遮盖!其实这个Color Tint是对文字进行着色的,选择Colored那么也就是意味着图片也和文字应用同样的颜色!

 

使用UILabel呈现图片和不同格式的文字