TexturePacker怎么⽤?TexturePacker使⽤教程图解TexturePacker是⼀款把若⼲资源图⽚拼接为⼀张⼤图的⼯具。⽹页设计师前台制作css的时候,为了提⾼载⼊速度,往往把很多⼩图拼接成⼀张⼤图,⼀次载⼊,减少I/O,提⾼速度。这个好懂吧。
所以不管怎么样,“拼⼤图”这个流程不可少。⼩编推荐⽤TexturePacker,拼图更专业。
TexturePacker这个词从字⾯来说就是Texture(纹理) + Packer(打包)。当然TexturePacker的功能远远不⽌这些,你还可以⽤它来⽣成程序所需的框架,如Cocos2d,Corona(TM) SDK ,Gideros ,Sparrow ,LibGDX,LimeJS 和Moai等。
TexturePacker(图⽚合成软件) v4.6.1 英⽂免费安装版 64位(附使⽤教程)
类型:图像处理
⼤⼩:33.9MB
语⾔:简体中⽂
时间:2018-01-04
查看详情
texturepacker(图⽚打包⼯具) 3.0.9 安装特别版
类型:图像处理
⼤⼩:43MB
语⾔:简体中⽂
时间:2015-08-31
查看详情
TexturePacker(拼图⼯具) v4.3.1 官⽅免费安装版
类型:图像处理
⼤⼩:24.1MB
语⾔:英⽂软件
时间:2017-11-25
查看详情
CSS sprites是TexturePacker⼀⼤功能,你只要将所有⽹页⼩图⽚添加到TexturePacker,然后设置⽂件导出格式为css,即可快速⽣成⼀张整合后的图⽚和css⽂件,这对⽹页前端设计师来说是不可多得的⾼效率⼯具。
什么是CSS sprites:
先来简单介绍⼀下CSS sprites。众所周知,我们在设计⽹页时,会有很多很多的⽹页⼩元素,例如导航按钮,社交图标,⽹站背景图等等。⼀般情况下,这些图⽚都是单独形式存在的,对于每⼀张图⽚,在⽹页加载时都属于独⽴的http请求。但使⽤CSS sprites,则会将所有的⼩图⽚整合到⼀张图⽚
中,⽹页加载只需要对⼀张图⽚进⾏请求,CSS再通过坐标的形式定位每⼀个⼩图⽚显⽰出来。这样有什么好处呢,最⼤的好处是,⼤⼤减少http请求数,提⾼⽹页加载速度。
TexturePacker神马优点:css怎么创建
TexturePacker有windows版。
TexturePacker有免费功能限制版。(你若要求不太⾼,TexturePacker够你⽤)
TexturePacker⽀持pvr格式。
TexturePacker⽀持命令⾏集成。
TexturePacker的兄弟软件PhysicsEditor同样是很好的物理建模⼯具。
TexturePacker怎么⽤?
1、打开TexturePacker
2、我的图⽚资源存放在F:\_data\vPuzzle\resource.work,如果你喜欢,你可以把整个⽂件夹拖到右边的①区,下图是拖进去以后的模样。
3、但是往往我们不想⼀股脑把所有图⽚合在⼀张超⼤的图中,所以我个⼈⽐较喜欢⼿动添加图⽚,这样便于控制。
4、我添加了⼀些图⽚,并把它们拖到上⾯图右边的区域
5、ok,该保存了。在data file处填⼊你要的plist⽂件路径,在texture format处选择你要的图⽚格式,在texture file填⼊你要⽣成的图⽚路径。(其他还有很多细节的设定,请尝试体验⼏次就明⽩怎么⽤了)另外,最后,点击菜单条的publish按钮,哦了。之后你可以利⽤它着⼿制作⼀款伟⼤的游戏了!
认识TexturePacker的界⾯:
Data Format:导出什么引擎数据,默认cocos2d,下拉列表中有很多,基本常⽤的引擎都⽀持了
Data File :导出⽂件位置(后缀名.plist)
Texture Format:纹理格式,默认png
Image format:图⽚像素格式,默认根据对图⽚质量的需求导出不同的格式
Dithering:抖动,默认NearestNeighbour,(如果图像上⾯有许许多多的“条条”和颜⾊梯度变化)将其修改成FloydSteinberg+Alpha; Scale: 让你可以保存⼀个⽐原始图⽚尺⼨要⼤⼀点、或者⼩⼀点的spritesheet。⽐如,如果你想在spritesheet中加载“@2x"的图⽚(也即为Retina-display设备或者ipad创建的)。但是你同时也想为不⽀持⾼清显⽰的iphone和touch制作spritesheet,这时候只需要设置scale为 1.0,同时勾选autoSD就可以了。也就是说,只需要美⼯提供⾼清显⽰的图⽚,⽤这个软件可以⾃⼰为你⽣成⾼清和普清的图⽚。
Algorithm TexturePacker:⾥⾯⽬前唯⼀⽀持的算法就是MaxRects,即按精灵尺⼨⼤⼩排列,但是这个算法效果⾮常好,因此你不⽤管它。
Border/shape padding: 即在spritesheet⾥⾯,设置精灵与精灵之间的间隔。如果你在你的游戏当中看到精灵的旁边有⼀些“杂图”的时候,你就可以增加这个精灵之间的间隔。
Extrude: 精灵边界的重复像素个数. 这个与间隔是相对应的--如果你在你的精灵的边边上看到⼀些透明的⼩点点,你就可以通过把这个值设设置⼤⼀点。
Trim: 通过移除精灵四周的透明区域使之更好地放在spritesheet中去。不要担⼼,这些透明的区域仅仅是为了使spritesheet⾥⾯的精灵紧凑⼀点。--当你从cocos2d⾥⾯去读取这些精灵的时候,这些透明区域仍然在寻⾥。(因为,有些情况下,你可能需要这些信息来确定精灵的位置)
Shape outlines: 把这个选项打开,那么就能看到精灵的边边。这在调试的时候⾮常有⽤。
AddSprite:添加图⽚Add Folder:根据⽂件夹添加图⽚
Publish:导出资源⽂件(.plist和png)