sábado, 20 de febrero de 2010

Diseño de la GUI (6). Los sprites.

En el anterior post me centré en las herramientas pero no mostré el diseño final de los sprites. Y aquí los tenéis:

 
Cursor. Se ha reducido el tamaño con relación al diseño inicial.

 
Indicador izquierdo del campo de foco.

Indicador derecho del campo de foco.


Datos de los sprites para Basic y Assembler:
cursor ---------------
1000 REM --- sprites data
1001 DATA 192, 160, 144, 136, 132, 130, 129, 128
1002 DATA 143, 144, 160, 192, 0, 0, 0, 0
1003 DATA 0, 0, 0, 0, 0, 0, 0, 128
1004 DATA 128, 0, 0, 0, 0, 0, 0, 0
1005 DATA 0, 64, 96, 112, 120, 124, 126, 127
1006 DATA 112, 96, 64, 0, 0, 0, 0, 0
1007 DATA 0, 0, 0, 0, 0, 0, 0, 0
1008 DATA 0, 0, 0, 0, 0, 0, 0, 0

; --- sprites data
DB 192, 160, 144, 136, 132, 130, 129, 128
DB 143, 144, 160, 192, 0, 0, 0, 0
DB 0, 0, 0, 0, 0, 0, 0, 128
DB 128, 0, 0, 0, 0, 0, 0, 0
DB 0, 64, 96, 112, 120, 124, 126, 127
DB 112, 96, 64, 0, 0, 0, 0, 0
DB 0, 0, 0, 0, 0, 0, 0, 0
DB 0, 0, 0, 0, 0, 0, 0, 0

foco izq. -------------------
1000 REM --- sprites data
1001 DATA 255, 128, 128, 128, 128, 128, 128, 128
1002 DATA 255, 0, 0, 0, 0, 0, 0, 0
1003 DATA 128, 0, 0, 0, 0, 0, 0, 0
1004 DATA 128, 0, 0, 0, 0, 0, 0, 0

; --- sprites data
DB 255, 128, 128, 128, 128, 128, 128, 128
DB 255, 0, 0, 0, 0, 0, 0, 0
DB 128, 0, 0, 0, 0, 0, 0, 0
DB 128, 0, 0, 0, 0, 0, 0, 0

foco der. -------------------
1000 REM --- sprites data
1001 DATA 255, 0, 0, 0, 0, 0, 0, 0
1002 DATA 255, 0, 0, 0, 0, 0, 0, 0
1003 DATA 128, 128, 128, 128, 128, 128, 128, 128
1004 DATA 128, 0, 0, 0, 0, 0, 0, 0

; --- sprites data
DB 255, 0, 0, 0, 0, 0, 0, 0
DB 255, 0, 0, 0, 0, 0, 0, 0
DB 128, 128, 128, 128, 128, 128, 128, 128
DB 128, 0, 0, 0, 0, 0, 0, 0

martes, 9 de febrero de 2010

Diseño de la GUI (5). Editando los sprites.

Después de dibujarlos, me decidí a pasarlos por un editor de sprites, pero primero voy a comentar las aplicaciones no-nativas que conozco.

img2spr de Andrea (MS-DOS)
Utilizando la consola de sistema, a partir de una imagen (PNG, BMP y TIFF, entre otros), a la salida te proporciona los datos para Basic, Asm y C.

MSX Sprite Draw de Andrea (WEB)
Se trata de una aplicación WEB, desde donde se puede dibujar un sprite con varios colores. Pulsando el botón "Get Sprite" te muestra el código en Basic o Asm, en un recuadro que podremos copiar a un editor de texto. A diferencia de otros editores permite crear sprites de 8x8. Ir a la versión 8x8.

TinySprite de Jannone (WEB)
Es otro editor de sprites de 16x16 desde WEB, pero tiene algunas ventajas sobre el anterior. Tiene bastantes opciones para la edición y permite la creación de mas de un sprites ("slots"). Utiliza el botón derecho del ratón para borrar pixels. Genera código para sprites de MSX1 y 2, en diferentes lenguajes de programación (Basic, Asm, C y Pascal). Tiene un sistema para guardar y leer el set de sprites.


nMSXsprites de Pentacour (MS-DOS)
Con esta utilidad se puede extraer de una imagen en formato PNG, el código assembler de sprites de 16 pixels de ancho. Genera un sprite por cada color y acepta varias figuras separadas por una linea transparente. Proporciona los fuentes para compilarse en otras plataformas como MAC y LINUX.

nMSXtiles de Pentacour (Windows)
Además del editor de tiles, incluye una herramienta para crear sprites de MSX1. Permite la creación de cuatro sets de cuatro sprites de hasta cuatro planos de colores (444! ;D ). Exporta a código Asm.


Para los sprites del PSGed, he utilizado el MSX Sprite Draw de Andrea.

jueves, 4 de febrero de 2010

Diseño de la GUI (4). Tiles y Sprites.

Después de escribir la información sobre el PSG, me he dado cuenta de que hay una carencia en la pantalla del editor. Falta un conmutador para elegir entre un valor fijo de amplitud o variable (envolvente).


Hoy me he dedicado a modificar la pantalla y de paso la he analizado para ver si necesitaba algún cambio más.
Pensando en la forma de señalizar el foco (con sprites), me he percatado de que los colores usados en la pantalla podrían hacer que estos no resaltaran correctamente. Por ese motivo, he cambiado el color de todos los tiles que representan botones, de rojo a magenta y así los sprites se mostrarán en color rojo. Y para finalizar las modificaciones al tileset, distinguiremos los nuevos botones, de los números de las teclas de función, cambiando el color de estos a cían.


Aprovechando que tenia en mente los sprites, los he dibujado. Serán de 16x16 pixels y en el caso del cursor del ratón, utilizaré dos: uno para el fondo y otro para el contorno de color negro.


Para la señalización del foco en modo teclado, utilizaré dos recuadros abiertos por uno de los extremos, para situarlos en los lados del campo.

(clicar para zoom X2)

En la imagen podemos ver señalizados dos campos (a modo prueba), el conmutador de tono del canal B y el registro de la frecuencia de ruido. Por otro lado se puede observar el sprite del cursor en la barra de la secuencia del canal A.

miércoles, 3 de febrero de 2010

Instrucción SOUND

Empecé a experimentar con el PSG desde un programa BASIC, con la instrucción SOUND. Esta permite escribir directamente a los registros. Es una buena manera de aprender su funcionamiento.

Su formato es el siguiente:

SOUND número de registro, expresión
  • número de registro = Enteros de 0 a 13
  • expresión = Constantes, variables o expresiones dentro del margen determinado para cada registro.

En los registros del 8, 9 y 10, hay que tener en cuenta que para ajustar el volumen tendremos que utilizar un valor del 0 al 15 y para activar la envolvente le aplicaremos el valor 16.

En el registro 7, la mejor manera de tocarlo, es utilizando una expresión binaria:

SOUND 7,&B00110110

Su funcionamiento es: 0 es activar y 1 es desactivar. En el ejemplo anterior estaríamos activando el tono del canal A y la mezcla con este del canal de ruido.

En el ejemplo activaríamos el tono de los tres canales (los tres primeros bits) y el ruido se mezclaría con el tercer canal (bit 5).

En el siguiente ejemplo podemos probar de hacer un sonido similar al de un bassdrum, utilizando un tono grave junto a la señal de ruido y aplicándole la envolvente numero 1 (la que empieza en su amplitud máxima y se reduce a cero).
Si utilizamos envolventes infinitas, podemos parar el sonido, aplicando el valor 63 al registro 7 o ejecutando la instrucción beep.
110 ' frecuencia canal A
120 SOUND 0,10
130 SOUND 1,15
140 ' frecuencia ruido
150 SOUND 6,31
160 ' activacion de canales
170 SOUND 7,&B00110110
180 ' amplitud canal A
190 SOUND 8,16
200 ' periodo de la envolvente
210 SOUND 11,0
220 SOUND 12,15
230 ' tipo de envolvente
240 SOUND 13,1

comando sound PSG MSX, tono+ruido
comando sound PSG MSX, tono

martes, 2 de febrero de 2010

Sobre el AY-3-8910 (PSG)

El AY-3-8910 es un chip de sonido diseñado por General Instrument, que proporciona 3 canales generadores de tonos de onda cuadrada, más un generador pseudo-aleatorio de ruido blanco que se puede mezclar independientemente con cada canal.
Tiene control de amplitud de 16 niveles por canal que se puede sustituir por una envolvente común para todos los canales.

Yamaha fabricó un clon totalmente compatible llamado YM-2149, que fue utilizado en ordenadores como los Atari-ST.

Dispone de 16 registros, dos de los cuales son para puertos de entrada/salida que se utilizan para los joysticks.

Nº registro Función Valor
0 Periodo de Tono del canal A (12 bits)
(0 a 4095)
8 bits
1 4 bits
2 Periodo de Tono del canal B (12 bits)
(0 a 4095)
8 bit
3 4 bit
4 Periodo de Tono del canal C (12 bits)
(0 a 4095)
8 bit
5 4 bit
6 Periodo de ruido (0-31) 5 bits 
7 Mixer. Activación de tono y ruido por canal
B7 B6 B5 B4 B3 B2 B1 B0
B A C B A C B A
I/O Port Activación ruido Activación tono
(0=Activo,1=Inactivo)

8 Amplitud del canal A.
B7 B6 B5 B4 B3 B2 B1 B0
X X X Env. Volumen (0-15)
El bit 4 se utiliza para activar la envolvente.

9 Amplitud del canal B
Idem que el registro 8.

10 Amplitud del canal C
Idem que el registro 8.

11 Periodo de la envolvente (16 bits)
(0 a 65535)
8 bits
12 8 bits
13 Tipo de envolvente.
(El periodo se encuentra marcado en gris)
4 bits


Más información:

    lunes, 1 de febrero de 2010

    Diseño de la GUI (3). Las pantallas.

    Esta mañana me la he pasado acabando las pantallas con la herramienta nMSXtiles de Pentacour. He retocado un poco la de edición y la he traducido al ingles. Mi intención es la de hacerlo multiidioma, pero de momento lo dejo para mas adelante, hasta ver como me desenvuelvo con la programación. También he terminado la de leer y guardar ficheros, la de ayuda y la ventana modal. He tenido que modificar el tileset, para reestructurarlo y añadir nuevos tiles que son necesarios.

    Aquí podéis verlas. Espero vuestras opiniones para poderlas mejorar (si esta dentro de mis posibilidades).

    Pantalla principal de la aplicación.

    Pantalla de carga de ficheros. Contiene una serie de botones para seleccionar la unidad y mostrar el directorio. El uso de carpetas (MSXDOS2), no es seguro que lo soporte.

    Pantalla para guardar ficheros. Similar a la de lectura, pero con un campo de entrada para el nombre del fichero.

    Pantalla de ayuda. Es una área donde se mostrará un texto que se controlará mediante una barra de scroll.


    Ventana Modal. He tenido que crear unos tiles para el contorno y la sombra. Aprovecho la fuente con fondo negro de la barra de menú, para hacer los botones.