Sprite Editor 图集切片精灵

简介:



切图需求

假设有一张大的UI的图集,我们想把它里面的小图一张一张地切割出来,如果有plist文件,请查阅我的另一篇文章《还原TexturePacker plist 文件 切开各小图片

今天我们使用 Unity4.3或更高版本自带的 Sprite Editor 来导出切片精灵

切图效果

imageimage

image

步骤

1、准备一张大的图集,导入Unity的Asset/Resources/XXX/文件夹下(注意:图集文件一定要放在Resources文件下)

image

2、该图集默认是Texture,我们需要把它的Type修改成Sprite

imageimage

3、接着修改Sprite Mode为Multiple,应用。然后点击 Sprite Editor

image

4、在打开的Sprite Edirot 窗口中把图集切成多个Sprite

imageimage

插件代码

5、编写TestExportSprite.cs,放在Editor目录下

复制代码
using UnityEngine;
using UnityEditor;

public class TestExportSprite
{
    
    [MenuItem("Assets/导出选中图片为单独png")]
    static void ExportSelSprite()
    {
        string resourcesPath = "Assets/Resources/";
        foreach (Object obj in Selection.objects)
        {
            string selectionPath = AssetDatabase.GetAssetPath(obj);

            // 必须最上级是"Assets/Resources/"
            if (selectionPath.StartsWith(resourcesPath))
            {
                string selectionExt = System.IO.Path.GetExtension(selectionPath);
                if (selectionExt.Length == 0)
                {
                    continue;
                }

                // 得到导出路径
                string loadPath = selectionPath.Remove(selectionPath.Length - selectionExt.Length);
                loadPath = loadPath.Substring(resourcesPath.Length);

                // 加载此文件下的所有资源
                Sprite[] sprites = Resources.LoadAll<Sprite>(loadPath);
                if (sprites.Length > 0)
                {
                    // 创建导出文件夹
                    string outPath = Application.dataPath + "/outSprite/" + loadPath;
                    System.IO.Directory.CreateDirectory(outPath);

                    foreach (Sprite sprite in sprites)
                    {
                        // 创建单独的纹理
                        Texture2D tex = new Texture2D((int)sprite.rect.width, (int)sprite.rect.height, sprite.texture.format, false);
                        tex.SetPixels(sprite.texture.GetPixels((int)sprite.rect.xMin, (int)sprite.rect.yMin,
                            (int)sprite.rect.width, (int)sprite.rect.height));
                        tex.Apply();

                        // 写入成PNG文件
                        System.IO.File.WriteAllBytes(outPath + "/" + sprite.name + ".png", tex.EncodeToPNG());
                    }
                    Debug.Log(string.Format("Export {0} to {1}",loadPath,outPath));
                }
            }
        }
        Debug.Log("Export All Sprites Finished");
    }
}
复制代码

5、使用Sprite Editor把图集切割成Sprite之后,修改图集的属性为Advanced,并勾选 Read/Write Enabled 和Transpare

image

否则当你导出切片时会报错

UnityException: Texture 'UIAtlas' is not readable, the texture memory can not be accessed from scripts. You can make the texture readable in the Texture Import Settings.
UnityEngine.Texture2D.GetPixels (Int32 x, Int32 y, Int32 blockWidth, Int32 blockHeight) (at C:/BuildAgent/work/aeedb04a1292f85a/artifacts/EditorGenerated/TextureBindings.cs:259)
TestSaveSprite.SaveSprite () (at Assets/Editor/TestSaveSprite.cs:39)

5、在Resources目录下选中UIAtlas.psd,右键,选择“导出选中图片为单独png

image

 

说明

部分内容参考自:http://blog.csdn.net/akof1314/article/details/38845933


本文转自赵青青博客园博客,原文链接:http://www.cnblogs.com/zhaoqingqing/p/4020667.html,如需转载请自行联系原作者

相关文章
Threejs使用精灵Sprite作为标签,鼠标悬浮精灵上时鼠变小手
Threejs使用精灵Sprite作为标签,鼠标悬浮精灵上时鼠变小手
1603 0
Threejs使用精灵Sprite作为标签,鼠标悬浮精灵上时鼠变小手
|
2月前
|
前端开发
ThreeJs通过canvas和Sprite添加标签
这篇文章介绍了在Three.js中利用Canvas和Sprite实现动态文本标签的方法,使得标签可以跟随模型并在3D空间中始终保持面向摄像机。
95 0
ThreeJs通过canvas和Sprite添加标签
|
2月前
|
存储 JavaScript
ThreeJS创建关键帧动画
这篇文章讲解了如何在Three.js中利用关键帧轨道 (`KeyframeTrack`) 创建动画效果,并提供了详细的步骤和代码示例。
89 0
|
5月前
|
JavaScript
js 滚动鼠标滑轮放大缩小图片
js 滚动鼠标滑轮放大缩小图片
29 0
|
5月前
|
前端开发
css实用技巧——异步加载图片时,在图片完成加载前,鼠标悬浮到占位图片上时显示图片的alt信息
css实用技巧——异步加载图片时,在图片完成加载前,鼠标悬浮到占位图片上时显示图片的alt信息
30 0
|
前端开发 安全 容器
CSS基本知识之复合选择器、元素显示模式、背景图片位置,精灵图(二)
CSS基本知识之复合选择器、元素显示模式、背景图片位置,精灵图
|
前端开发
CSS基本知识之复合选择器、元素显示模式、背景图片位置,精灵图(一)
CSS基本知识之复合选择器、元素显示模式、背景图片位置,精灵图
|
移动开发 前端开发 HTML5
前端 HTML5 Svg 画板(支持视频、图片上涂鸦,支持缩放、修改、颜色、复选...)
前端 HTML5 Svg 画板(支持视频、图片上涂鸦,支持缩放、修改、颜色、复选...)
254 0
html+css实战170-css精灵-背景图的缩放
html+css实战170-css精灵-背景图的缩放
121 0
html+css实战170-css精灵-背景图的缩放
|
Web App开发 缓存 前端开发
用SVG 制作 Sprites的图标系统(二)
我一直是图标字体的大力支持者。很多网站真的需要一个图标系统,图标字体提供了一个该死的精细系统。但是,我认为假设你对 IE 9+ 很好,使用内联 SVG 并且 <use> 引用图标的元素是一个优秀的系统。
229 0