Ios_31_cocos2d_ Texture Packaging (texturepacker)

The Texturepacker tool is designed to package multiple images into a single large picture The purpose is: 1. Save memory space, 2. Reduce the number of texture renders because Android and iOS games are rendered through OpenGL ES, OpenGL ES requires that the texture must be 2 of the size of the n-th square, if not, it expands to the nearest 2 of the n-dimensional dimensions (by filling transparent pixels) most important: texture rendering consumes performance, If you render each of the small images individually, you have to go through three steps: prepare to render, start rendering, end rendering but, if with TP will, all small pictures, synthesize a large picture, you only need to render once (that is, just the big picture: prepare for rendering, start rendering, end rendering ) this will greatly improve performance

For example, there is a 32-bit color map of 260x260 pixels,

It accounts for approximately 270KB (260 x 260 x 32/8 = 270400B) in memory,

However, the size of the texture must be a power of N to 2, subject to the size of the texture.

The system will automatically generate a texture that is closest to the original size (only larger than the original size), with a width height of 2 n power.

Therefore, the system will generate a 512x512 pixel texture,

And, eventually, it consumes 1MB of memory (32/8 x x = 1048576B),

As you can see, the actual memory consumed is 4 times times the amount of memory required for the original image.

The solution is to change the image of this 260x260 pixel to 256x256 pixels, and the system will generate 256x256 pixel textures.

it synthesizes the big picture, supports the following various frames



It was developed by a foreigner named Andreas Loew. Here's his Twitter account, Facebook account .

download it down:
Open the app with the following interface:First, click Add Folder (open a folder with n multiple images)
second, the folder containing all the pictures Zhao Yun selected
three, set the parameters, at this time, the interface is as follows:

the following are the relevant parameter settings:The data Format option supports the following formats:
Data FileName: The target file name of the build
Texture Format:
Image Format:recommended: RGBA4444, which is RGBA, respectively, with 4-bit representation
dithering "dithering" jitter processing??? select: Floydsteinberg???

When algorithm is maxrects:
When algorithm is basic:

When allow rotation is no:
Four, click Publish "Publish", will generate a large PNG and a plist file Note: Save is to save the TP project, generate the TPS file


The contents of the plist file are as follows:Dictionary: Key is a picture name, such as 1.pngThe value is a dictionary with keys: frame, offset, rotated, sourcesize, Sourcecolorrect

<?xml version= "1.0" encoding= "UTF-8"? ><! DOCTYPE plist Public "-//apple computer//dtd plist 1.0//en" "Http://www.apple.com/DTDs/PropertyList-1.0.dtd" >< Plist version= "1.0" > <dict> <key>frames</key> <dict> <key>1.p ng</key> <dict> <key>frame</key> <string>{{2,416},{                 92,107}}</string> <key>offset</key> <string>{-29,-26}</string> <key>rotated</key> <true/> <key>sourcecolorrect</                Key> <string>{{91,56},{92,107}}</string> <key>sourceSize</key>            <string>{332,167}</string> </dict> <key>10.png</key> <dict> <key>frame</key> <string>{{111,414},{184,81}}</string> <key>offset</key> <string>{-3,-29}</string&gt                ;                <key>rotated</key> <false/> <key>sourceColorRect</key> <string>{{71,72},{184,81}}</string> <key>sourceSize</key> &L t;string>{332,167}</string> </dict> <key>2.png</key> <dict&                Gt <key>frame</key> <string>{{2,224},{190,81}}</string> <key>offs                Et</key> <string>{-71,-29}</string> <key>rotated</key> <true/> <key>sourceColorRect</key> <string>{{0,72},{190,81}} </string> <key>sourceSize</key> <string>{332,167}</string> </dict> <key>3.png</key> <dict> &LT;KEY&G T;frame</key> <string>{{297,337},{136,127}}</string> <key>offset<                /key> <string>{-46,-6}</string> <key>rotated</key> <true/> <key>sourceColorRect</key> <string>{{52,26},{136,127}}</            String> <key>sourceSize</key> <string>{332,167}</string> </dict> <key>4.png</key> <dict> &LT;KEY&GT;FRAME&LT;/KEY&G                T <string>{{297,182},{158,153}}</string> <key>offset</key> <string& Gt {-59,7}</string> <key>rotated</key> <false/> <key& GtSourcecolorrect</key> <string>{{28,0},{158,153}}</string> &LT;KEY&GT;SOURC esize</key> <string>{332,167}</string> </dict> &LT;KEY&GT;5.P ng</key> <dict> <key>frame</key> <string>{{85,224}, {188,149}}                </string> <key>offset</key> <string>{-12,5}</string>                <key>rotated</key> <true/> <key>sourceColorRect</key>                <string>{{60,4},{188,149}}</string> <key>sourceSize</key> <string>{332,167}</string> </dict> <key>6.png</key> <                Dict> <key>frame</key> <string>{{2,2},{242,143}}</string> <keY>offset</key> <string>{45,2}</string> <key>rotated</key> <false/> <key>sourceColorRect</key> <string>{{90,10},{ 242,143}}</string> <key>sourceSize</key> <string>{332,167}</strin g> </dict> <key>7.png</key> <dict> <key>f Rame</key> <string>{{246,2},{242,119}}</string> <key>offset</key&                Gt                <string>{45,-10}</string> <key>rotated</key> <false/>                <key>sourceColorRect</key> <string>{{90,34},{242,119}}</string>            <key>sourceSize</key> <string>{332,167}</string> </dict><key>8.png</key> <dict> <key>frame</key> <string >{{246,123},{232,57}}</string> <key>offset</key> <string>{40,-41} </string> <key>rotated</key> <false/> <key>sour Cecolorrect</key> <string>{{90,96},{232,57}}</string> <key>sourcesiz e</key> <string>{332,167}</string> </dict> &LT;KEY&GT;9.PNG&L T;/key> <dict> <key>frame</key> <string>{{2,147},{198,                75}}</string> <key>offset</key> <string>{24,-32}</string> <key>rotated</key> <false/> <key>sourcecolorrect</key&                Gt <sTring>{{91,78},{198,75}}</string> <key>sourceSize</key> <string>{ 332,167}</string> </dict> </dict> <key>metadata</key> <di ct> <key>format</key> <integer>2</integer> <key>realtext            Urefilename</key> <string>zhaoyun.png</string> <key>size</key> <string>{512,512}</string> <key>smartupdate</key> <string> $Texture            Packer:smartupdate:aae1cbd56ecaac00aa0364cad5d7b3d2:1/1$</string> <key>textureFileName</key> <string>zhaoyun.png</string> </dict> </dict></plist>

final synthesized pictures:
plist file list:

Ios_31_cocos2d_ Texture Packaging (texturepacker)