开篇&TexturePacker打出图集给UGUI使用

开篇：
前段时间，网上流出了一套手游源码，本想着把服务器端搭一下，给自己认识小伙伴们调试着把这套源码学习一下。于是就买一个阿里云服务器，可是花了几天时间，就是run不起来了啊。还好网上已经有人搭出来了，暂且连上他们的服务器调试吧。哎，还是不说这些糗事了。
那阿里云服务器买都买了，总不能空着把。那就开个网站吧。于是心血来潮的，注册域名，备案，balabala。就是现在这个了。www.shihuanjue.com，个人觉得还是很好记的。以后会把之前写在有道云的笔记梳理一下搬过来吧。我不是大神，有不足的地方还请多多指出。

正文：
UGUI 有自己的 Sprite Packer 机制，就是在开发的时候让开发者没有图集这个概念，用的都是散图，然后在打包的时候引擎根据各个小图的 Packing Tag合并成一个图集，从而来降低drawcall。
设置成统一参数的图集将被合并到一张图集里面。

个人觉得，这东西不可控，合并成啥样也不知道，是否会出现一张大图里面还空着很多地方没用。
我也看了雨松MOMO的关于这些的文章。个人感觉不好用啊。（强调：个人观点）
所以我就在想能不能不用这套机制。
于是尝试用TexturePacker试试。
首先把Edit->Project Setting->Editor : Sprite Packer设置成Disabled。默认是开启的。

准备：
1.下载 texturepacker for unity 的插件，然后把插件导入到unity里面。这个插件什么用， 我会在后面说。
地址：http://www.codeandweb.com/texturepacker/unity
2.网上下载个破解版的texturepacker
准备就绪之后呢。打开texturepacker，把美术给我们的散图导入进去。
然后设置 Data file和Texture file 都是我们unity工程的目录下面的res文件

然后其它参数，大家可以酌情修改，最后导出

转到unity工程可以看到test图片不是一张单独的大图了，它有一张张小图在下面了。
这就是之前导入的插件帮我们做好的事情。

UI不需要 Minmap，所以我把勾打掉了。大小也变小了。多好。

再来看导入unity的另外一个文件。test.tpsheet
这里面保存着每一张小图的在这张图集中的位置。
读取的时候就是要根据这些数据把相对应的小图显示出来。
我把test.tpsheet改成了.txt后缀，然后把开头的没用的信息删除了。

那么接下来就是写代码了

 

using UnityEngine;
using System.Collections;
using System.Collections.Generic;
using UnityEngine.UI;
 
/// <summary>
///贴图类
/// </summary>
public class ImageInfo
{
    public string name;
    public Rect rect;       //配置文件中要替换的精灵的位置区域Rect
    public Vector2 vec2;    //要替换的精灵的pivot
 
    public ImageInfo(string[] str)
    {
        if (str != null)
        {
            this.name = str[0];
            float x, y, w, h;
            x = float.Parse(str[1]);
            y = float.Parse(str[2]);
            w = float.Parse(str[3]);
            h = float.Parse(str[4]);
            this.rect = new Rect(x, y, w, h);
            float pivotX, pivotY;
            pivotX = float.Parse(str[5]);
            pivotY = float.Parse(str[6]);
            this.vec2 = new Vector2(pivotX, pivotY);
        }
    }
}
 
/// <summary>
/// 图集管理类
/// </summary>
public class AtlasMgr
{
    public static Dictionary<string, List<ImageInfo>> imgDic = new Dictionary<string, List<ImageInfo>>();
}
 
 
public class Test : MonoBehaviour
{
    string url = "test";
    public Texture2D mTex;//图集
    public GameObject UIRoot;
    List<Image> images = new List<Image>();
 
    void Start()
    {
        this.LoadData(url);
 
        for (int i = 0; i < AtlasMgr.imgDic[url].Count; i++)
        {
            ImageInfo _temp = AtlasMgr.imgDic[url][i];
            Debug.Log(_temp.name + "|" + _temp.rect + "|" + _temp.vec2);
        }
 
        int count = this.UIRoot.transform.childCount;
        for (int j = 0; j < count; j++)
        {
            this.images.Add(this.UIRoot.transform.Find("Image" + j).GetComponent<Image>());
        }
    }
 
    /// <summary>
    /// 加载图集的配置信息
    /// </summary>
    /// <param name="loadUrl">Load URL.</param>
    private void LoadData(string loadUrl)
    {
        if (!AtlasMgr.imgDic.ContainsKey(loadUrl))
        {
            AtlasMgr.imgDic.Add(loadUrl, new List<ImageInfo>());
        }
 
        TextAsset binAsset = Resources.Load(loadUrl, typeof(TextAsset)) as TextAsset;
        string[] lineArray = binAsset.text.Split(new char[] { '
' });
 
        for (int i = 0; i < lineArray.Length; i++)
        {
            lineArray[i] = lineArray[i].Replace("
", "");
            string[] strArray = lineArray[i].Split(new char[] { ';' });
            ImageInfo imgInfo = new ImageInfo(strArray);
            AtlasMgr.imgDic[loadUrl].Add(imgInfo);
        }
    }
 
    void OnGUI()
    {
        if (GUILayout.Button("换图"))
        {
            for (int i = 0; i < this.images.Count; i++)
            {
                //根据rect，pivot，把mTex图集里面在这个位置的小图显示出来
                this.images[i].sprite = Sprite.Create(this.mTex, AtlasMgr.imgDic["test"][i].rect, AtlasMgr.imgDic["test"][i].vec2);
            }
        }
    }
}

然后新建7个Image进行测试

点击“换图”按钮，是可以根据这些数据显示出一张小图吧。
最后把例子工程也分析出来了，例子总归是例子，只是提供一个思路，项目中要用的话，还是要好好的封装，模块化吧。
例子工程：
链接：http://pan.baidu.com/s/1pJklvz9 密码：arxk
大家如果有其它更好的方式一定要告诉我哦。
第一篇先写个简单的，以后再慢慢好好写吧。就这样吧，拜拜~！

• 本文固定链接: http://www.shihuanjue.com/?p=16
• 转载请注明: 乔 2015年08月03日 于 是幻觉 发表