NGUI系列教程四(自定义Atlas,Font)
今天我们来看一下怎么自定义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)的更多相关文章
- (转)NGUI系列教程七(序列帧动画UITexture 和 UIsprit)
NGUI系列教程七(序列帧动画) 今天我给大家讲一下如何使用NGUI做序列帧动画.本节主要包括两方面内容,分别是使用UIspirit和使用UITexture 做序列帧动画.废话不说了,下面开始.还 ...
- NGUI系列教程七(序列帧动画)
今天我给大家讲一下如何使用NGUI做序列帧动画.本节主要包括两方面内容,分别是使用UIspirit和使用UITexture 做序列帧动画.废话不说了,下面开始.还要在啰嗦一句,首先大家要准备一些序列帧 ...
- Android Studio系列教程四--Gradle基础
Android Studio系列教程四--Gradle基础 2014 年 12 月 18 日 DevTools 本文为个人原创,欢迎转载,但请务必在明显位置注明出处!http://stormzhang ...
- Fastify 系列教程四 (求对象、响应对象和插件)
Fastify 系列教程: Fastify 系列教程一 (路由和日志) Fastify 系列教程二 (中间件.钩子函数和装饰器) Fastify 系列教程三 (验证.序列化和生命周期) Fastify ...
- React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发
React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发 2016/09/23 | React Native技术文章 | Sky丶清| 4 条评论 | 1 ...
- CRL快速开发框架系列教程四(删除数据)
本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...
- C#微信公众号开发系列教程四(接收普通消息)
微信公众号开发系列教程一(调试环境部署) 微信公众号开发系列教程一(调试环境部署续:vs远程调试) C#微信公众号开发系列教程二(新手接入指南) C#微信公众号开发系列教程三(消息体签名及加解密) C ...
- NGUI系列教程五(角色信息跟随)
在一些网络游戏中,我们常常可以看到角色的上方显示着角色的名称,等级,血量等信息.它们可以跟随角色移动,并且可以显示和隐藏.今天我们就来学习一下这些功能的实现方法.1. 新建unity工 程,导入NGU ...
- NGUI系列教程三
接下来我们再来看Progress Bar和Slider,对比参数我们可以发现,Progress Bar和slider的明显区别在于slider多一个Thumb选项,这里的Thumb就是我们拖动的时候点 ...
随机推荐
- Route Filters
Route Filters The Controller's Middleware, represents a High-Level processing API, executed by the r ...
- famous javascript library.
https://famo.us/ THE ULTIMATE WEB PLATFORM FOR DEVELOPERS AND DESIGNERS
- mfc非模态对话框
按照我们的之前的做法,先新建工程. 把基本的内容都添加上. 形成这样一个样子: 并且进行试运行,让程序能够完成加法运算. 值的注意的是,静态文本那里要改一下名字,否则无法将成员变量进行添加. 前期准备 ...
- 2.CentOS更换阿里源
第一步:备份本地yum源 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.backup 第二步:下载阿里y ...
- svn服务器的搭建
subversion是优秀的版本管理工具,下面简单介绍svn服务器和客户端的下载.安装.搭建以及使用 一:下载svn服务器和客户端 1:下载地址服务器下载地址:http://subversion.ap ...
- SWT中的布局之-----FormLayout(表格式布局)
表格式(FormLayout类) 表格式布局管理器,通过创建组件各个边的距离来布局组件,和GridLayout一样强大. 用GridLayout与FormLayout都可以实现相同的界面效果,但有时使 ...
- Struts2的工作流程
Struts2如何实现MVC Struts2的参数封装: Struts2的运行原理图:
- update目标在查询返回结果集中的解决方案
示例: students为学生信息表 Score为成绩表 两个表通过学生号关联 要求:将总成绩小于100的学生名称改为‘天才’ sql如下: error提示:update目标不能在查询返回结果集中 ...
- 【Objective-C】2.自定义构造方法和description方法
1.Student.h 1 #import <Foundation/Foundation.h> 2 3 @interface Student : NSObject { 4 int _age ...
- MySQL之select查询、function函数
一.select查询 //查询某张表所有数据 select * from temp; //查询指定列和条件的数据 //查询name和age这两列,age等于22的数据 ; //as对列重命名 //as ...