首页 > Unity3D频道 > 【NGUI研究院之Unity插件】 > NGUI研究院之有点坑爹的图文混排(十四)
2014
07-03

NGUI研究院之有点坑爹的图文混排(十四)

最近研究了了一下NGUI的图文混排工具,得出的结论是有点坑爹。。大家看看我的测试步骤,我用的是目前NGUI的最新版本3.6.6 。

当我在 Open BitMapFont Marker 的时候界面上出现Assets/NGUI/Editor/FreeType.dylib is missing 的字样。于是查了一下,大概意思是必须要把FreeType.dylib 文件拷贝在/usr/local/lib/FreeType.dylib路径下面。FreeType.dylib 文件在NGUI/Editor目录下面。

首先打开Finder,然后Command + Shift + G 如下图所示,在输入框里面输入/usr/打开文件夹。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 1

 

接着,如下图所示,把FreeType.dylib 文件拷贝进去,另外如果你的电脑没有local/lib文件夹的话你可以自己手动创建一个。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 2

 

接着在Project视图中鼠标右键选择NGUI -> OpenBitmap Font Maker 如下图所示,Unity弹出Font Maker界面,然后点击Source按钮,在右侧Select a Font界面中选择一个在你项目工程中的字体。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 3

 

Font Maker 界面上有四个选项,Numeric ASCII Latin Custom,我是多么希望它能再有个Dynamic的选项呀,可是丫就是没有。。 这里我们选择Custom自定义。如下图所示,Characters窗口里面的字符,就是预先打包生成的纹理材质。Output下方Atlas选择你需要图文混排的Atlas图集。最后点击Creat the font 就可以了。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 4

 

接着我们需要设置图文混排中图片的Atals,如下图所示,在制作出的UIFont上,选择一个图集,然后在给图集起个名子, 这里我起了一个 MOMO 和 RORO两个名子, 也就是说当文本中出现MOMO 和RORO字符串的时候,将会自动替换成图片。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 5

 

如下图所示,我们的图文混排已经完成了。

 

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 6

 

但是你千万别高兴的太早,我觉得NGUI现在的图文混排不太适合用来做中文版的项目。为什么呢?

1.不支持动态TTF字体的图文混排,凡是参与图文混排的文字都必须打在一个BitMap上面,这是做中文版本无法接收的,因为我们必须要用TTF动态字体。

2.NGUI图文混排的高度计算的有问题。看到了吗?如果你参与图文混排的两个图片大小不一样,如果文字进行换行,高度会计算错误。。

NGUI研究院之有点坑爹的图文混排(十四) - 雨松MOMO程序研究院 - 7

3.比如想第一个文字设置成红色,然后跟着一个图片,然后在跟一个绿色的字,那么它也做不成。。

4.调节文字间的横向和纵向的距离,它也做不成。

想了想目前还是先不要用NGUI的图文混排了,呵呵。

雨松MOMO提醒您:亲,如果您觉得本文不错,快快将这篇文章分享出去吧 。另外请点击网站顶部彩色广告或者捐赠支持本站发展,谢谢!

--

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠如果您愿意花10块钱请我喝一杯咖啡的话,请用手机扫描二维码即可通过支付宝直接向我捐款哦。

  1. 关于最后的第3点“3.比如想第一个文字设置成红色,然后跟着一个图片,然后在跟一个绿色的字,那么它也做不成。。”;我试了,可以哦,如下UILabel中内容(#001表示表情)[00ff00]99#001[-][ff0000]88[-]#001