首页 > 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
专注移动互联网，Unity3D游戏开发
站内专栏 QQ交谈 腾讯微博 新浪微博
捐 赠写博客不易，如果您想请我喝一杯星巴克的话？就进来看吧!

您可能还会对这些文章感兴趣！

《NGUI研究院之有点坑爹的图文混排（十四）》有 15 条评论

  1. 林 说：
    2018 年 12 月 4 日下午 11:06

    UGUI的图文混排,站里没有有用的…

    回复
  2. zoo 说：
    2018 年 8 月 24 日下午 5:06

    如果在windows情况下，该怎么操作呢？

    回复
  3. 王骥 说：
    2017 年 2 月 20 日上午 1:24

    大神，请问最新版的FontMaker在Mac上还可以用么，我用x86里的FreeType.dylib选ttf直接就crash了，我又换成用brew安装的libtreetype.6.dylib。然而以后crash。这个问题折腾了3个小时又回到原点，求助有什么办法解决

    回复
  4. 飘逸的白羊 说：
    2016 年 5 月 23 日下午 6:06

    给一个freetype64 dylib文件

    回复
  5. _is_me_ 说：
    2015 年 12 月 10 日下午 4:32

    请问这个可以使用动态的图片吗

    回复
  6. 晴天天上下小猪 说：
    2015 年 10 月 29 日下午 6:04

    求范例~我最近在负责聊天系统，字体要求使用Arial，然后输入#12 可以变成动态表情，求教如何根据描述文件 在它的子节点上生成Label 和 Sprite 。

    回复
  7. 君子不站阳台下 说：
    2015 年 9 月 12 日下午 7:13

    打BitMap的时候会报字体不能使用的错，有遇到过的吗

    回复
  8. 梦星魂 说：
    2014 年 9 月 16 日上午 10:11

    MOMO大哥，请问3D粒子效果要怎么放置才可以在NGUI上显示，要求是它要显示在NGUI图片层的上面？

    回复
  9. 天秤座 说：
    2014 年 9 月 4 日上午 10:12

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

    回复
  10. 水果 说：
    2014 年 8 月 7 日下午 5:28

    HTML Engine for NGUI & Unity GUI这个东东做图文混排怎么样？

    回复
  11. 做-自-己-就-好_3743 说：
    2014 年 7 月 9 日下午 11:20

    请教个问题：在场景中，打开了几个界面，我只想让它响应最上面那一层。应该怎么解决啊！BoxCollider那种方法太麻烦了

    回复
  12. Tammy 说：
    2014 年 7 月 4 日下午 2:23

    观望中。。。。。 NGUI研究院之有点坑爹的图文混排（十四） - 雨松MOMO程序研究院 - 1

    回复
  13. 伍默_ 说：
    2014 年 7 月 4 日上午 11:20

    有什么更好的方法么

    回复
  14. 飒飒劉倜傥 说：
    2014 年 7 月 4 日上午 8:54

    这货还真有不少问题要改的

    回复

留下一个回复

你的email不会被公开。