cursos:z88dk:sprites1

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Ambos lados, revisión anterior Revisión previa
Próxima revisión
Revisión previa
Última revisiónAmbos lados, revisión siguiente
cursos:z88dk:sprites1 [09-08-2007 12:52] sromerocursos:z88dk:sprites1 [24-02-2020 19:19] falvarez
Línea 1: Línea 1:
 +Publicado originalmente en [[https://magazinezx.speccy.org/11/z88dk.html|MagazineZX número 11]]
 +
 ====== Sprites en Z88DK (I) ====== ====== Sprites en Z88DK (I) ======
  
Línea 25: Línea 27:
 Los sprites los podemos representar en papel como una cuadrícula, donde cada casilla de esta cuadrícula será un pixel en la pantalla. Cada pixel podrá estar activado o no, de tal forma que la combinación de pixeles activados/desactivados dentro de esa cuadrícula dará lugar al sprite en la pantalla (como los GDUs en el BASIC del Spectrum). Por ejemplo, la siguiente imagen muestra varios de estos sprites dibujados en una cuadrícula (arriba) y cómo se verían en la pantalla del Spectrum (abajo): Los sprites los podemos representar en papel como una cuadrícula, donde cada casilla de esta cuadrícula será un pixel en la pantalla. Cada pixel podrá estar activado o no, de tal forma que la combinación de pixeles activados/desactivados dentro de esa cuadrícula dará lugar al sprite en la pantalla (como los GDUs en el BASIC del Spectrum). Por ejemplo, la siguiente imagen muestra varios de estos sprites dibujados en una cuadrícula (arriba) y cómo se verían en la pantalla del Spectrum (abajo):
  
 +{{ cursos:z88dk:z88dk6_1.png |Arriba vemos los sprites tal cuál quedarían dibujados sobre una cuadrícula en un papel, y abajo los vemos en la pantalla de nuestro Spectrum}}
  
-Arriba vemos los sprites tal cuál quedarían dibujados sobre una cuadrícula en un papel, y abajo los vemos en la pantalla de nuestro Spectrum 
-Arriba vemos los sprites tal cuál quedarían dibujados sobre una cuadrícula en un papel, y abajo los vemos en la pantalla de nuestro Spectrum 
  
 Los sprites en z88dk pueden ser de cualquier tamaño que queramos. Sin embargo, vamos a empezar por explicar los sprites de tamaño 8x8, como los que acabamos de ver. Como hemos dicho, cada sprite se definirá en z88dk como un array. Las dos primeras posiciones de este array almacenarán la anchura y la altura del sprite respectivamente y, a continuación, el array tendrá tantas posiciones más como filas tenga el sprite. Y el valor de cada una de esas posiciones será una suma, la suma del valor hexadecimal de cada uno de los pixeles activados en dicha fila. Los sprites en z88dk pueden ser de cualquier tamaño que queramos. Sin embargo, vamos a empezar por explicar los sprites de tamaño 8x8, como los que acabamos de ver. Como hemos dicho, cada sprite se definirá en z88dk como un array. Las dos primeras posiciones de este array almacenarán la anchura y la altura del sprite respectivamente y, a continuación, el array tendrá tantas posiciones más como filas tenga el sprite. Y el valor de cada una de esas posiciones será una suma, la suma del valor hexadecimal de cada uno de los pixeles activados en dicha fila.
Línea 33: Línea 34:
 Esto es así por que cada columna de la cuadrícula que define el sprite tendrá asignado un valor hexadecimal. La siguiente imagen muestra los valores hexadecimales asigandos a cada columna para un sprite de 8 columnas. Esto es así por que cada columna de la cuadrícula que define el sprite tendrá asignado un valor hexadecimal. La siguiente imagen muestra los valores hexadecimales asigandos a cada columna para un sprite de 8 columnas.
  
- +{{ cursos:z88dk:z88dk6_2.png |Valor hexadecimal asignado a cada columna para un sprite con ocho columnas}}
-Valor hexadecimal asignado a cada columna para un sprite con ocho columnas +
-Valor hexadecimal asignado a cada columna para un sprite con ocho columnas+
  
 Por ejemplo, si en una fila activamos los pixeles 1, 4, 6, y 8 (comenzando a contar desde la derecha), el valor hexadecimal de esa fila sería 0x01 + 0x08 + 0x20 + 0x80 = 0xA9. La siguiente imagen muestra un ejemplo más elaborado, para uno de los pixeles que hemos visto anteriormente. En dicho ejemplo se muestra el valor para cada fila y se puede ver cómo quedarían las posiciones del array a definir dentro de z88dk (recordemos que las dos primeras posiciones son la anchura y la altura). Por ejemplo, si en una fila activamos los pixeles 1, 4, 6, y 8 (comenzando a contar desde la derecha), el valor hexadecimal de esa fila sería 0x01 + 0x08 + 0x20 + 0x80 = 0xA9. La siguiente imagen muestra un ejemplo más elaborado, para uno de los pixeles que hemos visto anteriormente. En dicho ejemplo se muestra el valor para cada fila y se puede ver cómo quedarían las posiciones del array a definir dentro de z88dk (recordemos que las dos primeras posiciones son la anchura y la altura).
  
- +{{ cursos:z88dk:z88dk6_3.png |Ejemplo de cálculo de los valores hexadecimales correspondientes a un sprite}}
-Ejemplo de cálculo de los valores hexadecimales correspondientes a un sprite +
-Ejemplo de cálculo de los valores hexadecimales correspondientes a un sprite+
  
 ¿Qué ocurre en el caso de querer utilizar pixeles de distinta anchura y/o altura? En el caso de la altura es sencillo, lo único que hay que hacer es añadir o eliminar posiciones del array, ya que como sabemos, cada posición del array se corresponde con la suma de valores hexadecimales de una fila del sprite. En el caso de querer variar el número de columnas, la cosa se complica. ¿Qué ocurre en el caso de querer utilizar pixeles de distinta anchura y/o altura? En el caso de la altura es sencillo, lo único que hay que hacer es añadir o eliminar posiciones del array, ya que como sabemos, cada posición del array se corresponde con la suma de valores hexadecimales de una fila del sprite. En el caso de querer variar el número de columnas, la cosa se complica.
Línea 75: Línea 72:
 Al iniciar el programa nos aparecerá en pantalla algo como lo que se muestra en la siguiente imagen: Al iniciar el programa nos aparecerá en pantalla algo como lo que se muestra en la siguiente imagen:
  
-El editor de sprites de z88dk nada más ejecutarlo +{{ cursos:z88dk:z88dk6_4.png |El editor de sprites de z88dk nada más ejecutarlo}}
-El editor de sprites de z88dk nada más ejecutarlo+
  
 Podemos controlar el programa de una forma muy sencilla. Con los cursores hacia arriba y hacia abajo cambiamos el zoom, con lo que podremos dibujar de una forma más cómoda. Es fácil ver como nada más iniciarse el programa estamos trabajando sobre una rejilla de 8x8, pero no podemos acceder cómodamente a todas las casillas, deberemos hacer uso de la tecla de cursor abajo para disminuir el zoom. Podemos controlar el programa de una forma muy sencilla. Con los cursores hacia arriba y hacia abajo cambiamos el zoom, con lo que podremos dibujar de una forma más cómoda. Es fácil ver como nada más iniciarse el programa estamos trabajando sobre una rejilla de 8x8, pero no podemos acceder cómodamente a todas las casillas, deberemos hacer uso de la tecla de cursor abajo para disminuir el zoom.
Línea 127: Línea 123:
  
 Para dibujar un pixel sí que lo es... pero todavía queda todo un poco cojo y tenemos que verlo en funcionamiento. En el siguiente artículo veremos cómo realizar un sencillo juego con sprites controlados por el jugador moviéndose por la pantalla. Pero un poco de paciencia. Primero, a repasar la notación hexadecimal. Para dibujar un pixel sí que lo es... pero todavía queda todo un poco cojo y tenemos que verlo en funcionamiento. En el siguiente artículo veremos cómo realizar un sencillo juego con sprites controlados por el jugador moviéndose por la pantalla. Pero un poco de paciencia. Primero, a repasar la notación hexadecimal.
 +
  
 ===== Enlaces ===== ===== Enlaces =====
  
-    * [[|http://stikmansoftware.tripod.com/z88dksprite.htmlZ88DK Sprite Editor (Daniel McKinnon)]]+    * [[http://stikmansoftware.tripod.com/z88dksprite.html|Z88DK Sprite Editor]] (de Daniel McKinnon).
  
  • cursos/z88dk/sprites1.txt
  • Última modificación: 24-02-2020 19:24
  • por falvarez