UGUI研究院之全面理解图集与使用
2016-03-08 16:43
495 查看
UGUI研究院之全面理解图集与使用(三)
雨松MOMO 【UGUI研究院】 围观33982次 139条评论 编辑日期:2014-12-01 字体:大 中 小UGUI的图集打包与工作原理,整整看了一天多,终于看明白了~晕~还是记录一下我研究的成果,也希望大家在下面给我留言我们一起讨论一下。
先说说UGUI的Atlas和NGUI的Atlas的区别,NGUI是必须先打出图集然后才能开始做界面。这一点很烦,因为始终都要去考虑你的UI图集。比如图集会不会超1024 ,图集该如何来规划等等。而UGUI的原理则是,让开发者彻底模糊图集的概念,让开发者不要去关心自己的图集。做界面的时候只用小图,而在最终打包的时候unity才会把你的小图和并在一张大的图集里面。然而这一切一切都是自动完成的,开发者不需要去care它。
如下图所示,Editor->Project Settings 下面有sprite packer的模式。Disabled表示不启用它,Enabled For Builds 表示只有打包的时候才会启用它,Always Enabled 表示永远启用它。 这里的启用它就表示是否将小图自动打成图集。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_2.png)
我的选项是Always
Enabled 。因为开发的时候我们需要清楚的看到现在是几个Draw Call,从而才能优化小图。在最终打包的时候unity会自动构建大的图集,可是我开发的时候就想看图集会占几个Draw Call,这怎么办呢?如下图所示,首先将你的图片拖入unity中,将同一图集的所有图片的packing tag设置成一个名子即可。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_3.png)
注意你的图片不能放在Resources文件夹下面,Resources文件夹下的资源将不会被打入图集,切记(也就是在这里混淆了我很久)。然后在Windows->Sprite Packer 里,点击packer 在这里你就可以预览到你的图集信息。图集的大小还有图集的格式等等很多参数我们都是可以控制的,也可以通过脚本来设置。我在下一篇文章里详细说这个(请期待嘿嘿)。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_4.png)
图集的预览紧紧是让你看看你的图集大概张什么样子。那么我们的图集的这张图片保存在了哪里呢?它保存在和Assets文件夹同级的目录,Libary/AtlasCache里面。你不用管它,也不要删除它,就算你删除了也没用因为只要你打包,它就会生成并且会打到包中。
此时在Hierarchy视图中创建两个Image对象。如下图所示,我们可以清楚的看到此时我的draw call已经被合并成了1 。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_5.png)
这两个图片是我是在Editor模式下预先拖入Hierarchy视图中的,可是如果我想运行时根据图片的名子来动态创建精灵该如何?可是unity根本没有提供加载图集的方法,也没有提供加载图集上某个图片的方法。 因为UGUI就不像让开发者有图集的这个概念,可是我们肯定是要实现这个需求的。。怎么办呢?
第一个设想,先把散=小图打包成图集,然后再把所有散图拷贝在Resources文件夹下,这样运行时就能用Resources.load了。
第二个设想,还是先把小图打成图集,然后把所有小图关联在prefab上,拷贝在Resources文件夹下,这样运行时也能用Resources.load了。到底那个靠谱呢? 给大家看一个图大家就知道答案了。
如下图所示,打成图集的图片如果在放在Resources那么资源就变成双份了。。 所以我们只能把小图关联在Prefab上,把所有的Prefab放在Resources下面,这样就不占用多余的空间了。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_6.png)
好了,现在方法我们已经掌握,那么就开始写工具吧。如下图所示可以按文件夹分,每一个文件夹就是一个图集。然后每一张小图创建一个Prefab,Prefab的名子就起小图的名子,文件关联在Resources下面。
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_7.png)
代码比较简单,我就不注释了。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | [MenuItem("MyMenu/AtlasMaker")] staticprivatevoidMakeAtlas() { stringspriteDir=Application.dataPath+"/Resources/Sprite"; if(!Directory.Exists(spriteDir)){ Directory.CreateDirectory(spriteDir); } DirectoryInforootDirInfo=newDirectoryInfo(Application.dataPath+"/Atlas"); foreach(DirectoryInfodirInfoinrootDirInfo.GetDirectories()){ foreach(FileInfopngFileindirInfo.GetFiles("*.png",SearchOption.AllDirectories)){ stringallPath=pngFile.FullName; stringassetPath=allPath.Substring(allPath.IndexOf("Assets")); Spritesprite=Resources.LoadAssetAtPath<Sprite>(assetPath); GameObjectgo=newGameObject(sprite.name); go.AddComponent<SpriteRenderer>().sprite=sprite; allPath=spriteDir+"/"+sprite.name+".prefab"; stringprefabPath=allPath.Substring(allPath.IndexOf("Assets")); PrefabUtility.CreatePrefab(prefabPath,go); GameObject.DestroyImmediate(go); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | usingUnityEngine; usingSystem.Collections; usingUnityEngine.UI; publicclassUIMain:MonoBehaviour{ voidStart() { CreatImage(loadSprite("image0")); CreatImage(loadSprite("image1")); } privatevoidCreatImage(Spritesprite){ GameObjectgo=newGameObject(sprite.name); go.layer=LayerMask.NameToLayer("UI"); go.transform.parent=transform; go.transform.localScale=Vector3.one; Imageimage=go.AddComponent<Image>(); image.sprite=sprite; image.SetNativeSize(); } privateSpriteloadSprite(stringspriteName){ returnResources.Load<GameObject>("Sprite/"+spriteName).GetComponent<SpriteRenderer>().sprite; } } |
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_8.png)
接下来就是Assetbundle了,如果我们的图集需要在线更新那该怎么办呢? 其实Assetbundle比Resources要更简单一些,无论如何我们要先开始打图集。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | [MenuItem("MyMenu/Build Assetbundle")] staticprivatevoidBuildAssetBundle() { stringdir=Application.dataPath+"/StreamingAssets"; if(!Directory.Exists(dir)){ Directory.CreateDirectory(dir); } DirectoryInforootDirInfo=newDirectoryInfo(Application.dataPath+"/Atlas"); foreach(DirectoryInfodirInfoinrootDirInfo.GetDirectories()){ List<Sprite>assets=newList<Sprite>(); stringpath=dir+"/"+dirInfo.Name+".assetbundle"; foreach(FileInfopngFileindirInfo.GetFiles("*.png",SearchOption.AllDirectories)) { stringallPath=pngFile.FullName; stringassetPath=allPath.Substring(allPath.IndexOf("Assets")); assets.Add(Resources.LoadAssetAtPath<Sprite>(assetPath)); } if(BuildPipeline.BuildAssetBundle(null,assets.ToArray(),path,BuildAssetBundleOptions.UncompressedAssetBundle|BuildAssetBundleOptions.CollectDependencies,GetBuildTarget())){ } } } staticprivateBuildTargetGetBuildTarget() { BuildTargettarget=BuildTarget.WebPlayer; #if UNITY_STANDALONE target=BuildTarget.StandaloneWindows; #elif UNITY_IPHONE target=BuildTarget.iPhone; #elif UNITY_ANDROID target=BuildTarget.Android; #endif returntarget; } |
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_10.png)
然后把UIMain.cs在改一改。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | usingUnityEngine; usingSystem.Collections; usingUnityEngine.UI; publicclassUIMain:MonoBehaviour{ AssetBundleassetbundle=null; voidStart() { CreatImage(loadSprite("image0")); CreatImage(loadSprite("image1")); } privatevoidCreatImage(Spritesprite){ GameObjectgo=newGameObject(sprite.name); go.layer=LayerMask.NameToLayer("UI"); go.transform.parent=transform; go.transform.localScale=Vector3.one; Imageimage=go.AddComponent<Image>(); image.sprite=sprite; image.SetNativeSize(); } privateSpriteloadSprite(stringspriteName){ #if USE_ASSETBUNDLE if(assetbundle==null) assetbundle=AssetBundle.CreateFromFile(Application.streamingAssetsPath+"/Main.assetbundle"); returnassetbundle.Load(spriteName)asSprite; #else returnResources.Load<GameObject>("Sprite/"+spriteName).GetComponent<SpriteRenderer>().sprite; #endif } } |
![](http://www.xuanyusong.com/wp-content/uploads/2014/10/Snip20141024_8.png)
衷心希望有经验的朋友在留言处给我提提意见, 或者大家一起讨论讨论。。 我们共同为把NGUI干掉的目标而奋斗,嘻嘻。
本文固定链接: http://www.xuanyusong.com/archives/3304
转载请注明: 雨松MOMO 2014年10月24日 于 雨松MOMO程序研究院 发表
MOMO与MO嫂提醒您:亲,如果您觉得本文不错,快快将这篇文章分享出去吧 。另外请点击网站顶部彩色广告或者捐赠支持本站发展,谢谢!
相关文章推荐
- STL之三:deque用法详解
- n [Request processing failed; nested exception is com.alibaba.dubbo.rpc.RpcException: Failed to invo
- UISwitch
- 在EasyUI的DataGrid中嵌入Combobox
- UIView
- 133.Which two statements are true regarding subqueries? (Choose two.)
- UIView如何管理它的子视图
- request.getSession(true)和request.getSession(false)的区别
- ios CALayer Core Animation UIView动画封装
- Android studio通过选择不同的Build Variant执行不同的groovy代码
- UGUI 3d坐标转UI坐标
- Ueditor使用以及遇到的问题
- iOS开发--轮播图(无限循环)新玩法--视差轮播--无限循环的新思路(两个UIImageView足矣)
- 广搜 — — ZOJ 1649 Rescue
- data-options的移除验证(easyui validatebox中移除验证)
- AndroidStudio导入项目一直卡在Building gradle project info最快速解决方案
- C#中三层架构UI、BLL、DAL、Model实际操作
- iframe页面改动parent页面的隐藏input部件value值,不能触发change事件。
- chrome显示ue-editor上传的视频问题
- ORA-02266: unique/primary keys in table referenced by enabled foreign keys