UGUI使用BMFont制作美术字体<一>

不多说,先来效果图:

从头开始讲开发流程:

在Unity3d开发过程中,经常需要将美术提供的美术字组合成一个字体库,方便unity中的调用,BMFont则为此提供了不错的功能支持,它的下载地址在这里。它的使用方法网上有很多教程,这里不做解释,如果要使用此工具,要注意的是,这里记得使用xml格式,导出的图片为一张。

导出来的资源有:对应的图片,还有一个以fnt结尾的文件,如果打开此文件可以看到它就是一个xml文件:

在BMFont软件中我们这样操作:Options->Save configuration as...,把这个文件保存下来,它是以bmfc结尾的,保存了在bmfont里面相关的配置属性,其中对应的文字图片还有对应的值在imported icon images中保存,用记事本打开,就可以可到这样的界面:

以我的直觉,BMFont就是根据这样的一个配置文件生成对应的图片和xml文件。现在回到Unity,将BMFont生成的xml和图片分别拖动到1,2位置,点击Generate Font在对应的xml目录下便会生成字体文件和材质球,并且分别已经赋值,将字体拖动到ugui中的字体位置可见:

这样一个工具算是完成了,它的代码在这里,自己也可以进行修改。但是作为懒癌的我,觉得这样极不方便,制作字体时候,每次都要打开bmfont,然后导入unity,再接着将文件拖动到相关位置,还要点击生成字体,简直不能忍受,那么下一篇我们制作一个更加方便的工具。

using System.Collections.Generic;
using System.IO;
using System.Xml;
using UnityEditor;
using UnityEngine;

public class BMFont : EditorWindow
{
    private TextAsset _fontTextAsset;
    private Texture _fontTexture;
    private string _fontsDir;

    [MenuItem("CTools/BMFont", false, 12)]
    private static void BMFontTools()
    {
        BMFont bmFont = new BMFont();
        bmFont.Show();
    }

    private string _getAssetPath(string path)
    {
        string pathTemp = path.Replace("\\", "/");
        pathTemp = pathTemp.Replace(Application.dataPath, "Assets");
        return pathTemp;
    }

    void OnGUI()
    {
        EditorGUILayout.BeginVertical();
        TextAsset taTemp = EditorGUILayout.ObjectField("选择Font文件:", _fontTextAsset, typeof(TextAsset), true) as TextAsset;
        if (taTemp != _fontTextAsset && taTemp != null)
        {
            string assetDir = Directory.GetParent(AssetDatabase.GetAssetPath(taTemp)).FullName;
            assetDir = _getAssetPath(assetDir);
            string imgPath = string.Format("{0}/{1}_0.png", assetDir, taTemp.name);
            _fontTexture = AssetDatabase.LoadAssetAtPath<Texture>(imgPath);
            _fontsDir = string.Format("{0}.fontsettings", Path.Combine(assetDir, taTemp.name));
            if (_fontTexture == null)
            {
                _fontsDir = string.Empty;
                Debug.LogError(string.Format("未发现{0}文件", imgPath));
            }
        }
        _fontTextAsset = taTemp;

        _fontTexture = EditorGUILayout.ObjectField("选择Font图片文件:", _fontTexture, typeof(Texture), true) as Texture;

        GUI.enabled = false;
        _fontsDir = EditorGUILayout.TextField("字体生成路径:", _fontsDir);
        GUI.enabled = true;
        if (GUILayout.Button("Generate Font"))
        {
            if (!string.IsNullOrEmpty(_fontsDir))
            {
                Material mat = AssetDatabase.LoadAssetAtPath<Material>(_fontsDir.Replace(".fontsettings", ".mat"));
                if (mat == null)
                {
                    mat = new Material(Shader.Find("UI/Default Font"));
                    AssetDatabase.CreateAsset(mat, _fontsDir.Replace(".fontsettings", ".mat"));
                }
                if (_fontTexture != null)
                {
                    mat = AssetDatabase.LoadAssetAtPath<Material>(_fontsDir.Replace(".fontsettings", ".mat"));
                    mat.SetTexture("_MainTex", _fontTexture);
                }
                else
                {
                    Debug.LogError("贴图未做配置,请检查配置");
                    return;
                }

                Font font = AssetDatabase.LoadAssetAtPath<Font>(_fontsDir);
                if (font == null)
                {
                    font = new Font();
                    AssetDatabase.CreateAsset(font, _fontsDir);
                }

                _setFontInfo(AssetDatabase.LoadAssetAtPath<Font>(_fontsDir),
                    AssetDatabase.GetAssetPath(_fontTextAsset),
                    _fontTexture);
                font = AssetDatabase.LoadAssetAtPath<Font>(_fontsDir);
                font.material = mat;
            }
            else
            {
                Debug.LogError("创建失败,请检查配置");
            }
        }
        EditorGUILayout.EndVertical();
    }

    private void _setFontInfo(Font font, string fontConfig, Texture texture)
    {
        XmlDocument xml = new XmlDocument();
        xml.Load(fontConfig);
        List<CharacterInfo> chtInfoList = new List<CharacterInfo>();
        XmlNode node = xml.SelectSingleNode("font/chars");
        foreach (XmlNode nd in node.ChildNodes)
        {
            XmlElement xe = (XmlElement)nd;
            int x = int.Parse(xe.GetAttribute("x"));
            int y = int.Parse(xe.GetAttribute("y"));
            int width = int.Parse(xe.GetAttribute("width"));
            int height = int.Parse(xe.GetAttribute("height"));
            int advance = int.Parse(xe.GetAttribute("xadvance"));
            CharacterInfo info = new CharacterInfo();
            info.glyphHeight = texture.height;
            info.glyphWidth = texture.width;
            info.index = int.Parse(xe.GetAttribute("id"));
            //这里注意下UV坐标系和从BMFont里得到的信息的坐标系是不一样的哦,前者左下角为(0,0),
            //右上角为(1,1)。而后者则是左上角上角为(0,0),右下角为(图宽,图高)
            info.uvTopLeft = new Vector2((float)x / texture.width, 1 - (float)y / texture.height);
            info.uvTopRight = new Vector2((float)(x + width) / texture.width, 1 - (float)y / texture.height);
            info.uvBottomLeft = new Vector2((float)x / texture.width, 1 - (float)(y + height) / texture.height);
            info.uvBottomRight = new Vector2((float)(x + width) / texture.width, 1 - (float)(y + height) / texture.height);

            info.minX = 0;
            info.minY = -height;
            info.maxX = width;
            info.maxY = 0;

            info.advance = advance;

            chtInfoList.Add(info);
        }
        font.characterInfo = chtInfoList.ToArray();
        AssetDatabase.Refresh();
    }
}

参考:

原文地址:https://www.cnblogs.com/Yellow0-0River/p/9020016.html

时间: 2024-11-07 14:33:02

UGUI使用BMFont制作美术字体<一>的相关文章

Unity3d之-使用BMFont制作美术字体

一.需求 游戏开发中经常遇到需要以美术字(而非字库)做数字显示的情况,通常美术会提供一组包含单个数字(也会有其它字符)的图片,可能是一张整图,也可能是每个数字分开的散图. 在此我以一张整图这种情况为例,来说明美术字体的具体制作流程.整图如下: 二.准备 整个制作过程需要用到三样工具: 字体数据制作工具 图片切割工具 字体生成工具 1.字体数据制作工具 字体数据制作工具名为BMFont,是一个Windows上的可执行软件,下载网址为:http://www.angelcode.com/product

BMFont制作美术字体

生成 Number.fnt.Number_0.png 两个文件,将其拖入Unity 相应位置,继续下一步 箭头所指就是我们要得到的最终目标,在文本处字体使用它就可以了. 在使用 Tools -> BMFont Maker 之前得先完成以下步骤: using UnityEngine;   using UnityEditor;     public class BMFontEditor : EditorWindow   {   [MenuItem("Tools/BMFont Maker&quo

Unity3D中使用BMFont制作图片字体 (NGUI版)

[旧博客转移 - 发布于2015年9月10日 16:07] 有时美术会出这种图片格式的文字,NGUI提供了UIFont来支持BMFont导出的图片字体 BMFont原理其实很简单,首先会把文字小图拼成一张大图(合成一张图上传GPU性能会高一些) 然后生成一份配置,描述了每张小图字符的Unicode编码(这里是10进制),坐标,宽高,偏移量,等等信息 下面说一下制作步骤 BMFont安装:http://pan.baidu.com/s/1jGvTAzc 打开BMFont 选择:Edit/Open I

Unity3d 使用 BMFONT 制作的艺术字体 不能居中 解决方法

文章转自http://blog.csdn.net/huutu 星环游戏 http://www.thisisgame.com.cn 转载请注明 在使用同事用 BMFONT 制作的 字体 时,在 Unity 3d 中发现,不能居中对齐. 在尝试 顶部对齐 中心对齐 底部对齐后发现,这个艺术字 是以 顶部 为锚点的. 所以结果就像上面的图片,我们选择 中心对齐,但是在 Unity3d 中看到却是 顶部 对齐了 文本框 的中心. 因为昨天正好简单学了下 Unity的 Custom Font,所以觉得可以

Unity教程之-UGUI美术字体的制作与使用

文章转载自:http://www.unity.5helpyou.com/3211.html 游戏制作中,经常需要使用各种花哨的文字或者数字,而字体库往往不能达到我们需要的效果,因此需要一种用图片替代文字的功能.ugui使用艺术字也比较简单,下面我们就来介绍下UGUI美术字体的制作与使用,本文使用BMFont作为字体制作工具,简单讲讲如何制作艺术字体:1.让美术提交分块后的文字: 2.打开BMFont工具,找到图片管理(Edit->Open Image Manager): 3.导入字体图片,并与文

Unity 使用BMFont制作字体

参考链接:http://blog.csdn.net/huang9012/article/details/32333913,作者:CSDN huang9012 NGUI版本:3.6.5 要自己制作字体,需要下载软件BMFont,下载BMFont 要制作的字体,这里以GOUDX-EXTRABOLD为例,下载字体 下载后安装,界面是这样的: 接下来开始制作字体: 1.打开Options——Font settings设置字体: 2.在Font Settings界面中设置如下: Font:要制作的字体名称

详解利用ShoeBox制作位图字体

http://childhood.logdown.com/posts/190580/-details-using-shoebox-produce-bitmap-fonts?utm_source=tuicool 1 ShoeBox 简介 ShoeBox官网 ShoeBox是一个基于AdobeAIR实现的免费跨平台的工具.这个工具使用拖放.剪切板的工作流程方式,能够很方便的处理游戏图片.创建位图字体等. 支持引擎 2 功能概括介绍 ShoeBox虽小,五脏俱全.作者做这个工具足见是用了心,如果各位想

基于cocoStudio和BMfont的艺术字体制作

http://blog.csdn.net/u011373759/article/details/44308455 我们在制作游戏的过程中经常要使用各式各样的艺术字体,这些字体让我们的游戏看起来更加美观更加的萌(- -!) 但是很多的新手都不知道这些字体是如何做出来的,这篇文章主要介绍的是基于cocos2dx它的配套UI制作工具cocostudio的艺术字体使用 字体的制作工具使用的是BMfont 下载地址:点击打开链接 首先我们制作我们想要的艺术字体(如果你有美工妹子的话,这应该轮不到你) 然后

unity制作图片字体

参考http://blog.sina.com.cn/s/blog_6768751b0101niao.html http://forum.china.unity3d.com/thread-20425-1-1.html 有时候美术会给出一系列的艺术字,例如数字0,1,2,3,4,5,6,7,8,9,这些字以图片的形式给开发人员,这时候图片的用法怎么用呢? 第一种想到的方法是把图片按字命名,然后以字为key存成字典,获取的时候通过字去获取(如代表数字1的图片命名为1,字典key为1,获取时通过Dict