今天我们来看一下怎么自定义NGUIAtlas,制作属于自己风格的UI。
第一部分:自定义 Atlas
1 . 首先我们要准备一些图标素材,也就是我们的UI素材,将其导入到unity工程中。
2. 全选我们需要用到的UI素材。选择菜单NGUI->Open the Atlas Maker(快捷键 Alt +shift+M)。打开Atlas Maker窗口,如图

我们可以看到,刚才选择的图片素材已经在下面的Sprite窗口中列出来了。

3. 在Create右侧为Atlas起个名称,其余默认即可(这里第二个参数Select可以让我们在现有的Atlas基础上添加新的图片进去)。点击 Create,NGUI会自动为我们完成创建。等待一会完成之后,回到Project视图,可以看到刚才选择的图片的目录下多了三个物体,如图

分别是Atlas的材质球,Atlas,Atlas组合后的图片。
4. 现在我们可以使用自己定义的Atlas了,新建一个UI,然后选择菜单NGUI—>Open the widget wizard,打开widget窗口,把我们刚才新建的Atlas拖到Atlas窗口,然后我们在创建Button等的时候,就可以选择我们自己的UI图片。

第二部分: 自定义Font.

自定义字体常用的有两种方法,第一种方法是导出一些我们需要的文字,单独制作字体。第二种是全部导入整个字体文件,然后动态使用需要的字体。
第一,单独选择使用到的字体。这种方法需要用到一个小软件:bmfont,位图字体生成工具。下载链接http://game.ceeger.com/forum/read.php?tid=619,完全按照默认安装即可。安装完成后打开,界面如图,

这里中间的列表是我们现有字体的文字图集列表。右侧是不同的分类。选择菜单 options,font settings,打开字体设置窗口

在这里设置我们需要的字体,比如我们这里选择的是微软雅黑,编码格式使用默认的Unicode,字体大小设置为32,其他默认即可,点击OK。

然后是选择我们需要的文字,因为在这里列出了所有的雅黑字体的文字,我们有时候不需要这么多,我们就要选择我们需要的文字导出。首先我们打开记事本,输入我们需要的文字。然后保存,在保存的时候注意使用Utf8编码保存

回到bmfont窗口,选择菜单,edit-->Select chars from file(从文件选择字符)。找到我们刚才保存的Txt文件,然后点击打开。bmfont会自动为我们选择我们需要的字符。设置字体输出格式:点击 Options-->Export options打开输出设置窗口,如图

设置输出尺寸为2048,这里的大小根据我们选择的字符多少确定,如果字符数少,可以选择1024或者更少,一般常用中文字体加一块大概四千左 右,2048大小的图片即可完全容纳。设置图像深度为32比特,因为我们需要用到Alpha通道。在Presets选项下选择带有Alpha通道的输出设 置,字体颜色可以选择白色或者黑色,设置Textures为PNG格式,点击OK,回到主界面。

导出字体:选择菜单Options-->Save bitmap font as。打开保存窗口,命名保存,然后打开保存的目录,我们可以看到,我们导出了两个文件,一个带有我们选择文字的Png格式的图片,另一个记录字符信息的fnt格式文件,把它改为txt格式。拷贝导出的两个文件到Unity工程目录下。

我想,我们得先自己建一个Atlas,选择NGUI ->Open the Atlas Maker,先Create一个空洞Atlas,

然后制作字体:选择菜单NGUI-->Open the Font Maker,打开字体制作窗口,如图:

在Type中选择bitmap,将我们刚才导出字体的Txt文本文件拖到Font Data槽中,Texture设置为刚才导出的字符图片,输入字体名称,其余默认,点击Create the font。完成字体的创建。以后我们就可以在任何地方使用我们创建的字体了。这个方法有个缺点就是我们必须事先知道我们所要用到的字符,然后导入制作字 体。假如输入我们没有用到的字符,将无法显示。如何解决这样的问题呢?那就是动态字体啦。

第二种制作字体方法,动态字体。
1. 首先我们导入需要的字体,从Windows/fonts目录下拷贝出我们需要的字体,粘贴到Unity工程目录下。此过程需要一段时间的导入。导入完成后,我们可以看到字体包括两个子文件,一个材质球和一个贴图文件。
2. 制作动态字体,选择菜单NGUI--->Open the Font Maker,打开字体制作窗口,将Type设置为dynamic方式,拖放我们导入的字体文件到 Font TFF下, 设置我们需要的 Font Size。还可以设置字体方式为加粗,斜体等效果。


3. 点击Create the font 完成动态字体创建。此方法创建的字体优点就是可以使用该字体包含的任何文字,不用担心找不到字符的问题。

声明: 本文由(zqcyou)原创编译,转载请保留链接: NGUI系列教程四(自定义Atlas,Font)

NGUI系列教程四(自定义Atlas,Font)的更多相关文章

  1. (转)NGUI系列教程七(序列帧动画UITexture 和 UIsprit)

    NGUI系列教程七(序列帧动画)   今天我给大家讲一下如何使用NGUI做序列帧动画.本节主要包括两方面内容,分别是使用UIspirit和使用UITexture 做序列帧动画.废话不说了,下面开始.还 ...

  2. NGUI系列教程七(序列帧动画)

    今天我给大家讲一下如何使用NGUI做序列帧动画.本节主要包括两方面内容,分别是使用UIspirit和使用UITexture 做序列帧动画.废话不说了,下面开始.还要在啰嗦一句,首先大家要准备一些序列帧 ...

  3. Android Studio系列教程四--Gradle基础

    Android Studio系列教程四--Gradle基础 2014 年 12 月 18 日 DevTools 本文为个人原创,欢迎转载,但请务必在明显位置注明出处!http://stormzhang ...

  4. Fastify 系列教程四 (求对象、响应对象和插件)

    Fastify 系列教程: Fastify 系列教程一 (路由和日志) Fastify 系列教程二 (中间件.钩子函数和装饰器) Fastify 系列教程三 (验证.序列化和生命周期) Fastify ...

  5. React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发

    React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发   2016/09/23 |  React Native技术文章 |  Sky丶清|  4 条评论 |  1 ...

  6. CRL快速开发框架系列教程四(删除数据)

    本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...

  7. C#微信公众号开发系列教程四(接收普通消息)

    微信公众号开发系列教程一(调试环境部署) 微信公众号开发系列教程一(调试环境部署续:vs远程调试) C#微信公众号开发系列教程二(新手接入指南) C#微信公众号开发系列教程三(消息体签名及加解密) C ...

  8. NGUI系列教程五(角色信息跟随)

    在一些网络游戏中,我们常常可以看到角色的上方显示着角色的名称,等级,血量等信息.它们可以跟随角色移动,并且可以显示和隐藏.今天我们就来学习一下这些功能的实现方法.1. 新建unity工 程,导入NGU ...

  9. NGUI系列教程三

    接下来我们再来看Progress Bar和Slider,对比参数我们可以发现,Progress Bar和slider的明显区别在于slider多一个Thumb选项,这里的Thumb就是我们拖动的时候点 ...

随机推荐

  1. Android Studio无法启动 打开, Android Studio gradle下载不了

    Google在2013年I/O大会上发布了Android Studio,AndroidStudio是一个基于IntelliJ思想的新的Android开发工具.下面介绍一下Android Studio安 ...

  2. iOS web与js的简单交互

    我们在封装网页的时候经常会遇到需要往网页里面的控件添加数据,但是怎么添加又成了难点.本人最近在开发的时候就遇到这样的事,解决之后,来和大家分享一下. //以必应网站为例 [web loadReques ...

  3. next nextval

    1 KMP算法中next与nextval值的计算 以上两张图代表了next值的求法,本人总结后做如下叙述: 根据公式可知: next[1]=0 next[2]=1 next[3]的求法根据公式可以直接 ...

  4. hadoop学习记录(零)

    这个博客开通快一年了,但是由于种种原因,始终没有能够养成定期更新的习惯. 最近完成了比赛的项目,向除了android开发以外再拓宽一下自己的技能树. 最近购买了<java8函数式编程>和& ...

  5. mysql 按月按周统计

    http://hi.baidu.com/liangjian1024/blog/item/6861541b1416094842a9ad7c.html 表finance有俩个字段如下 date date  ...

  6. 使用GDB调试Android NDK native(C/C++)程序

    使用GDB调试Android NDK native(C/C++)程序 先说明下,这里所谓的ndk native程序跟Android上层java应用没有什么关系,也不需要涉及jni来封装native接口 ...

  7. lambda expand in list

    [(lambda x: x*x)(x) for x in range(10)] Or better yet: [x*x for x in range(10)]

  8. 比较两个序列字典序(lexicographicallySmaller)

    bool lexicographicalSmaller(vector<int> a, vector<int> b) { int n = a.size(); int m = b. ...

  9. [MSDN] 使用 SharePoint 2013 中的 JavaScript 库代码完成基本操作

    MSDN:http://msdn.microsoft.com/zh-cn/library/jj163201.aspx 了解如何编写代码以在 SharePoint 2013 中使用 JavaScript ...

  10. <你不知道的JavaScript>读书笔记

    近几天看了一本不错的 JavaScript 的书,是 Kyle Simpson 写的 <You Don't know JS>.这本书是 Kyle Simpson 在 Github 上的开源 ...