Páginas

06 abril 2010

Técnicas para pintar imágenes SC2 (2 de 2)

Hay un truco con el que podemos paliar la limitación de colores del screen2, consiguiendo un color más en determinadas zonas de la pantalla. Consiste en utilizar planos de figuras móviles (sprites). Esto es posible gracias a que toda la información de los sprites (gráfica y atributos), se encuentra en la memoria de vídeo (VRAM) y el formato SC2 consiste en un volcado de esta memoria.

Antes tenemos que tener en cuenta una serie de puntos:
  1. Solo podemos utilizar 32 sprites de 8x8 o 16x16 pixels y solo podrán situarse 4 en la misma línea, ya que el quinto se borraría o se mostraría parcialmente. 
  2. Para cada uno de ellos, solo podemos utilizar uno de los 16 colores de la paleta de los MSX.
  3. Tendremos que programar una aplicación para situar los sprites sobre la imagen, para luego guardar el fichero SC2.
En este tutorial, explicaré como desarrollar este efecto, utilizando un PC o MAC en combinación con un MSX (físico o emulado). También se puede hacer perfectamente utilizando aplicaciones nativas. Lo importante es conocer la idea y luego aplicarla con las aplicaciones que más nos gusten.

Dibujando los sprites
Empezaremos por dibujar lo que serán los sprites, sobre nuestra imagen. Para ello recomiendo utilizar un programa gráfico que disponga de capas, ya que nos ayudara a distinguirlos de la imagen principal. Utilizaremos una o más capas y en ellas dibujaremos la forma con el color que necesitemos.

Imagen normal, capa de sprites y combinación de ambas.

Una vez tengamos terminada la composición, necesitaremos tener por un lado la imagen de fondo en formato SC2 y los sprites en formato código Basic.

Obteniendo el fondo en SC2
Para obtener la imagen del fondo en SC2, utilizaremos el Screen Conversor de Jannone. Su manejo es sencillo:
  1. Cargamos nuestra imagen. 
  2. Seleccionamos la paleta de los MSX1, inhabilitamos la opción de "Error Diffusion" y pulsamos el botón "Convert".
  3. Guardamos la imagen SC2, utilizando la opción Save "all dump", y copiamos el código que muestra, a un editor de texto y lo guardamos con extensión ".BAS".


El editor de sprites
Para obtener los datos de los sprites, utilizaremos el TinySprite, también desarrollado por Jannone.

Pintaremos todos los sprites, añadiendo tantos "slots" como sprites necesitemos. Utilizaremos como referencia lo que hemos pintado desde nuestro software de dibujo. Cuando terminemos "Exportaremos" el resultado a Basic. Aconsejo cambiar el numero de linea inicial por uno más alto, para reservar unas líneas para añadir más código que necesitaremos. El resultado se nos mostrará cuando pulsemos el icono representado por una hoja con una rueda dentada. Lo seleccionaremos y lo copiaremos al programa Basic guardado en el punto anterior.



A Programar!
Sobre el programa que disponemos, tendremos que añadir unas lineas, para que se comporte como nosotros necesitamos. Incluyo los fuentes del que he utilizado para este tutorial, el cual os servirá para adaptarlo a vuestras creaciones. De todas formas os detallo algunos puntos para que entendáis su funcionamiento.

Primero añadiremos una línea que asigne el color negro al borde de la pantalla. Esto sera necesario para que la imagen se visualice correctamente ya que el conversor suele aplicar el negro como el color 0 (transparente), de la paleta del MSX.

1 color ,,1

Luego indicaremos el modo de pantalla con el tipo de sprites que vamos a utilizar (0=8x8; 1=8x8 ampliado; 2=16x16; 3=16x16 ampliado).

10 SCREEN 2,2

Quitaremos la linea "30 goto 30" y en su lugar añadiremos una que lance la función que añade los datos gráficos de los sprites en la memoria de vídeo.

30 GOSUB 10010

También sera necesario añadir como última linea de programa, la función de retorno:

10030 RETURN

El siguiente paso sera mostrar los sprites en la posición adecuada. Para ello utilizaremos la instrucción "PUT SPRITE". Antes necesitaremos saber la posición de cada sprite. Desde el programa de dibujo situaremos el cursor en la posición superior izquierda de cada bloque de 16x16 y apuntaremos las coordenadas (en Gimp se muestran a la izquierda de la barra de estado de la ventana principal). Deberemos utilizar la sentencia PUT SPRITE tantas veces como sprites tengamos. Funciona de la siguiente manera:

PUT SPRITE número de plano, (coordenada X, coordenada y), color, número de sprite

Ejemplo:

100 PUT SPRITE 0,(33,23),1,0

Después de esto, guardamos la pantalla (sprites incluidos), con la siguiente sentencia (Nota: el nombre de fichero ha de ser diferente al original, si queremos conservarlo):

180 BSAVE"BENDER_S.SC2",0,&H3FFF,S

Y para finalizar he colocado una línea que espera que pulsemos una tecla para salir:

190 IF INKEY$="" THEN 190
192 END

A continuación podéis ver todo el programa (también se encuentra en el DSK que se puede descargar al final del tutorial):

1 color ,,1
10 SCREEN 2,2
19 ' carga la imagen sin sprites
20 BLOAD"BENDERSX.SC2",S
30 GOSUB 10010
90 ' visualiza sprites
100 PUT SPRITE 0,(33,23),1,0
101 PUT SPRITE 1,(64,28),15,1
102 PUT SPRITE 2,(18,96),1,2
103 PUT SPRITE 3,(34,96),1,3
104 PUT SPRITE 4,(40,85),14,4
105 PUT SPRITE 5,(137,85),1,5
106 PUT SPRITE 6,(137,101),1,6
107 PUT SPRITE 7,(32,120),14,4
108 PUT SPRITE 8,(146,118),1,7
174 ' guarda la imagen con los sprites
180 BSAVE"BENDER_S.SC2",0,&H3FFF,S
184 ' espera una respuesta del teclado
190 IF INKEY$="" THEN 190
192 END
200 ' --- Slot 0
210 ' color 1
220 DATA &H00,&H00,&H05,&H0A,&H15,&H2A,&H54,&HA8
230 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
240 DATA &H15,&HA8,&H50,&H80,&H00,&H00,&H00,&H00
250 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
260 '
270 ' --- Slot 1
280 ' color 15
290 DATA &HC0,&H30,&H18,&H0C,&H0C,&H00,&H00,&H00
300 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
310 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
320 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
330 '
340 ' --- Slot 2
350 ' color 1
360 DATA &H00,&H00,&H00,&H03,&H0D,&H3A,&HD5,&H00
370 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
380 DATA &H0D,&H3A,&HD5,&HAA,&H55,&HAA,&H54,&H00
390 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
400 '
410 ' --- Slot 3
420 ' color 1
430 DATA &H50,&HA0,&H40,&H80,&H00,&H00,&H00,&H00
440 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
450 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
460 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
470 '
480 ' --- Slot 4
490 ' color 14
500 DATA &H80,&H00,&H00,&H00,&H00,&H00,&H00,&H00
510 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
520 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
530 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
540 '
550 ' --- Slot 5
560 ' color 1
570 DATA &H01,&H00,&H01,&H00,&H01,&H00,&H01,&H00
580 DATA &H01,&H00,&H01,&H00,&H01,&H00,&H01,&H02
590 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
600 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
610 '
620 ' --- Slot 6
630 ' color 1
640 DATA &H00,&H04,&H28,&H50,&HA8,&H50,&H20,&H00
650 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
660 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
670 DATA &H00,&H00,&H00,&H00,&H00,&H00,&H00,&H00
680 ' --- Slot 7
690 ' color 1
700 DATA &H00,&H00,&H00,&H90,&H90,&H95,&H95,&H95
710 DATA &H92,&H90,&HA0,&HC1,&H00,&H00,&H00,&H00
720 DATA &H20,&H54,&H44,&H44,&H44,&H4C,&H54,&H64
730 DATA &HC4,&H44,&H54,&H48,&H80,&H00,&H00,&H00
740 DATA *
10000 REM -- LOAD SPRITES
10010 S=BASE(9)
10020 READ R$: IF R$="*" THEN RETURN ELSE VPOKE S,VAL(R$):S=S+1:GOTO 10020
10030 RETURN

Ahora tendremos que copiar los ficheros SC2 y el BAS, en un disco de MSX o en un fichero de disco (.DSK). Para este último caso, podemos usar la utilidad Disk-Manager de Lex Lechz (Windows).



Y para finalizar lo ejecutamos y ya tenemos nuestra imagen!!!
Nota: Es posible que alguna posición no nos concuerde. En ese caso, tendremos que modificarlas hasta que consigamos que se muestre todo correctamente.

Para ver nuestra imagen final, podemos usar el siguiente listado:

10 color 15,1,1
20 SCREEN 2,2
30 BLOAD"BENDER_S.SC2",S
40 IF INKEY$="" THEN 40
50 END

NOTA: No seria muy complicado hacer un programa para crear un efecto de animación, cambiando el número de sprite de un plano dado. Solo es cuestión de animarse! ;-)

Más información:

8 comentarios:

Gakubuchi dijo...

Genial articulo! Me ha recordado cuando leía la MSX-Club tumbado en el sofá!
Ojalá hubieramos tenido estas herramientas en los años buenos del MSX. Y ojalá las hubieran utilizado más los desarrolladores de software!

Bellotero pop dijo...

Soy Konamito. Te felicito por este excelente artículo. Sabes explicar las cosas de manera que los más negados (como yo) en la materia sientan ganas de ponerse a dibujar en SCREEN 2.

aorante dijo...

Gracias Gakubuchi y Konamito!
Ahora me siento obligado a hacer más artículos!!! ;)
El próximo sobre Screen 5.
PD: A mi me gustaban mucho la MSX-Extra y la MSX-Club. Las conservo todavía en casa! :)

Toni dijo...

menuda currada de post, enhorabuena!

Leyendo esto quizás te interese el post que hice hace un tiempo referente a la animación 2d:

http://pixelsmil.blogspot.com/2010/12/tutorial-aprendiendo-animar-en-2d-en-10.html

Un saludo!

aorante dijo...

Gracias Toni!
Ya vi tu articulo hace tiempo.
Te sigo en Retro Invaders. ;)

Anónimo dijo...

Por favor, como se puede pasarlo a cas. Para ejecutarlo en MSX cinta.

Mariano dijo...

Hola, muy buena la nota. Una pregunta, ¿Para que sirve el parametro &H3FFF en la sentencia BSAVE? ¿Porque no directamente BSAVE"BENDER.SC2",S?

mvac7 dijo...

Hola Mariano. Creo que habrán pasado años de tu pregunta, por lo que pido disculpas por la tardanza, pero ahí va la respuesta por si alguien lee el post y le interesa este tema.

Los parámetros de BSAVE son:

BSAVE "[nombre de dispositivo]nombre de archivo",dirección inicial, dirección final, {dirección de ejecución o S}

En nuestro caso utilizamos la S, para referirnos a la memoria de vídeo.
La forma que tu indicas, creo que no funciona con el Disk Basic v1.