Cómo usar Texturepacker para hacer un plist

1. Descargar TexturePacker

Se recomienda utilizar TexturePacker. Basta con utilizar la función gratuita para crear lo que necesitamos. La función de pago no es necesaria por el momento. Dirección de descarga: /texturepacker/

Simplemente descárguelo e instálelo.

2. Úselo gratis

Utilice la tercera opción: "Usar gratis", no usaremos la función paga

3. Agregue una miniatura <. /p>

Simplemente arrastre la imagen pequeña a la ventana de Sprites a la derecha y luego arrastre otras imágenes en secuencia.

Después de arrastrar las imágenes por turno, el software seleccionará automáticamente una imagen vacía. posición para colocar la imagen y registre la posición de la imagen en la imagen. Los lectores atentos pueden encontrar que el software gira automáticamente una imagen para ahorrar espacio. y no es necesario que nos importe al hacer referencia a él en el código, el archivo plist lo registrará, solo necesitamos citar el nombre de la imagen. Finalmente exporta la imagen.

4. Exportar imágenes y archivos plist

Haga clic en Publicar y seleccione la ubicación de exportación del archivo

Finalmente, se generan las imágenes y los archivos plist correspondientes. use Cocos2d para desarrollar juegos...

¿Cómo guardar la ubicación de la imagen en el archivo plist?

El archivo plist es un archivo xml. Podemos abrirlo con Eclipse o Notepad

[html] ver copia simple

marcos

carácter1.png

fotograma

{ {2,2},{68,90}}

desplazamiento

{1,-5}

girado

sourceColorRect

< string>{{15,10},{68,90}}

sourceSize

{96,100}

character2.png

marco

{{72,2},{76,88}}

desplazamiento

{2,-6}

girado

< key>sourceColorRect

{{17,12},{76,88}}

sourceSize

{106,100}

<

/p>

personaje3.png

marco

{{150,2},{76,100}}

desplazamiento

{8,4}

girado

sourceColorRect

{{23,1},{76,100}}

sourceSize

{106,110}

metadatos

formato

2

realTextureFileName

imagen.png

tamaño

{252,94}

smartupdate

$TexturePacker:SmartUpdate:4d9f9052f72b479531d5262ac554d5db:c14790402c7beb896b15e46c664da0c0:aee6d656c46f4f58abed154134950510$ p>

nombre del archivo de textura

imagen.png

No es difícil ver que una corresponde a un valor. Este valor puede ser un área rectangular o una cadena . Según este método, usaremos la primera imagen carácter1.png. para analizar

character1.png: Atributo // El nombre de la imagen pequeña, puede hacer referencia directamente a la imagen a través de este nombre en el código

frame: {{2,2} ,{68,90} } // Las coordenadas de la esquina superior izquierda y la esquina inferior derecha del área donde se encuentra la imagen

desplazamiento: {2,-6}

// Desconocido

rotated: false // Ya sea para rotar, puedes ver que el valor de la tercera imagen es verdadero

sourceColorRect: {{23,1},{76,100} } // Desconocido

sourceSize: {106,110} // Desconocido

Bien, importe las imágenes y los archivos plist a la carpeta de activos para su desarrollo.