Interlocked

Versión virtual de los clásicos puzzles de madera tipo blurr:
Visto en FinoFilipino

Por si se resiste la cosa.

GLBasic: Jugando con sprites.

Empezamos a trabajar con gráficos. Vamos a mover un sprite sobre un fondo fijo. Empezamos buscando la imagen de una nave.

Y un fondo apropiado sobre el que moverla:

Reaprovechamos el código para controlar el ratón:

//Declaramos las variables que vamos a usar
GLOBAL mx,my,b1,b2
// Posición inicial
LET mx = 100
LET my = 100

//Cargamos el mapa de fondo (640x480)
LOADBMP "planet.png"

//Cargamos la nave
LOADSPRITE "nave.bmp", 0

//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
MOUSESTATE mx, my, b1, b2

//Dibujamos el sprite
DRAWSPRITE 0, mx, my
SHOWSCREEN
WEND

La nave aparece enmarcada. Para ajustar la transparencia tenemos que hacer dos cosas:

1. Retocar el dibujo de la imagen asignando el color transparente a las áreas correspondientes.
2. Declarar en el programa dicho color como transparente con SETTRANSPARENCY .
   

//Declaramos las variables que vamos a usar
GLOBAL mx,my,b1,b2
// Posición inicial
LET mx = 100
LET my = 100

//Cargamos el mapa de fondo (640x480)
LOADBMP "planet.png"

//Cargamos la nave
SETTRANSPARENCY RGB(255,0,128) //Definimos el color de transparencia
LOADSPRITE "nave.bmp", 0

//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
//Capturamos el estado del ratón
MOUSESTATE mx, my, b1, b2

//Dibujamos el sprite
DRAWSPRITE 0, mx, my
SHOWSCREEN
WEND

GLBasic: Jugando con píxeles y lineas.

Llenamos la pantalla de píxeles con colores aleatorios:

//Vamos a llenar la pantalla de píxeles
// La resolución actual 640x480


//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
//Barremos toda la pantalla
FOR x= 0 TO 640
FOR y=0 TO 480
SETPIXEL x,y,RGB(RND(255), RND(255), RND(255))
NEXT
NEXT

SHOWSCREEN
KEYWAIT
WEND

Ponemos ahora unas cuantas rectas:

//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
//unas 100 lineas en resol. 640x480
FOR x= 0 TO 100
DRAWLINE RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255),RND(255))
NEXT
SHOWSCREEN
KEYWAIT
WEND

Aprovechando la similitud entre las instrucciones que dibujan rectas y rectángulos:

//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
//unas 100 lineas en resol. 640x480
FOR x= 0 TO 100
DRAWRECT RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255),RND(255))
NEXT
SHOWSCREEN
KEYWAIT
WEND

Una de las instrucciones más potentes es POLYVECTOR. Con ella podemos crear un polígono. Empezamos con la instrucción STARTPOLY y añadimos vértices con POLYVECTOR (al menos tres). Finalizamos con ENDPOLY.

//Resolución 640x480

LOADSPRITE "Block.bmp", 0
WHILE TRUE
STARTPOLY 0
POLYVECTOR RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255), RND(255))
POLYVECTOR RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255), RND(255))
POLYVECTOR RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255), RND(255))
POLYVECTOR RND(640), RND(480), RND(640), RND(480), RGB(RND(255), RND(255), RND(255))
ENDPOLY
SHOWSCREEN

MOUSEWAIT
WEND
END

Si no se le proporciona una imagen, realiza un degradado con los colores de cada vértice.

GLBasic: Control del teclado y del ratón.

Un sencillo programa para mover un pequeño texto con los cursores:

//Declaramos las variables que vamos a usar
GLOBAL x,y
// Posición inicial
LET x = 100
LET y = 100
//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
// <-
IF KEY(203) = 1 THEN LET x = x-1
// ->
IF KEY(205) = 1 THEN LET x = x+1
// ^
IF KEY(200) = 1 THEN LET y = y-1
// v
IF KEY(208) = 1 THEN LET y = y+1

PRINT "tecla = "+ INKEY$(),x,y
SHOWSCREEN
WEND

Lo mismo pero moviendo con el ratón:

//Declaramos las variables que vamos a usar
GLOBAL mx,my,b1,b2
// Posición inicial
LET mx = 100
LET my = 100
//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
MOUSESTATE mx, my, b1, b2

PRINT "botón1="+ b1 + "botón2=" + b2,mx,my
SHOWSCREEN
WEND

De propina tocamos el joystick:

/Control del joystick
//Declaramos las variables que vamos a usar
GLOBAL jx,jy,j1,j2,x,y

// Posición inicial
LET x = 100
LET y = 100

//Un bucle infinito, en realidad basta pulsar ESC para salir
WHILE TRUE
JOYSTATE jx, jy, j1, j2
//jx,jy devuelven -1,0 o 1 (cruceta)
//j1,j2 devuelven 128 al ser pulsados
LET x=x+jx
LET y=y+jy

PRINT "botón1="+ j1 + "botón2=" + j2,x,y
SHOWSCREEN
WEND

GLBasic: El primer programa.

Empezamos con el típico "Hello world":

1) Escribimos en el editor el siguiente código:

// --------------------------------- //
// Project: 001
// Start: Sunday, February 20, 2011
// IDE Version: 8.203


// SETCURRENTDIR("Media") // seperate media and binaries?
// My first program
PRINT "Hello World" , 50,50
SHOWSCREEN
KEYWAIT
END

Las cuatro primeras lineas son comentarios (//) añadidos por el editor. La última indica que todos los archivos multimedia (imágenes, sonidos...) están en un directorio aparte del ejecutable.

La quinta linea es un comentario propio. Y las cuatro siguientes el código en si mismo. Un modesto print con sus correspondientes argumentos (el texto a imprimir y los coordenadas en alta resolución). Actualizamos el buffer para mostrar lo que hemos hecho en pantalla y quedamos a la espera de pulsar una tecla para acabar.


2)Guardamos y compilamos (con F5 o en el menú Compiler/Start) .

3) Obtenemos:

Vale, mucha pantalla para tan poca cosa y muchos Kb, el ejecutable ocupa 951 Kb. Pero no tiene ni librerías ni instaladores. Es de esperar, que a pesar de incluir más código en sucesivos programas, no aumente mucho de tamaño.

GLBasic guarda el entorno en un fichero con el mismo nombre del proyecto y extensión .gbap. Mientras que el código lo guarda con extensión .gbas. Ambos son ficheros de texto (en realidad el gbabp es XML)

GLBasic: Lo más básico.

Veamos un pequeño resumen de lo que tenemos en el lenguaje:

1 General:

• Los comandos se escriben en mayúsculas. En realidad no hay que preocuparse de esto porque el editor lo hace automáticamente, salvo que no reconozca la orden.
• Las instrucciones se separan con punto y coma (;) o salto de linea.
• Los comentarios empiezan por // (el conocido REM, es curioso que no reconozca dicha instrucción).
• GLBasic usa doble buffer para la pantalla. Se dibuja en una zona de la memoria y no se vuelca a pantalla hasta que se usa la orden SHOWSCREEN. Si no ves nada en pantalla busca esta orden en el programa.
• Hay tres tipos de variables (el uso de LET es opcional):

1. Números: Por defecto se manejan los números en coma flotante.
2. Enteros: Se le añada % al nombre de la variable al declararla.
3. Cadenas: Se le añade $ al nombre de la variable al declararla. Al asignarle un valor ,el texto va entrecomillado.
4. También podemos trabajar con matrices. Solo pueden tener cuatro dimensiones como máximo.

2 Control del programa:

• Etiquetas de salto: Terminan en dos puntos (:). Útiles en conjunción con la instrucción GOTO, aunque desaconsejable el uso de esta última en aras de un buen estilo.
  
• Subrutinas: Se definen con la instrucción del menú "Project/New SUB". Se llaman con GOSUB en cualquier parte del programa. El código se la subrutina se ubica al final del programa principal.
• Bucles FOR/NEXT: Pueden ser descendentes.
• Bucles WHILE/WEND: Se cumple hasta que la condición (evaluada al principio) sea falsa.
• Bucles REPEAT/UNTIL: A diferencia del anterior la condición se evalual al final del bucle.
• BREAK/CONTINUE: Usados con condicionales interrumpen o saltan una iteración del bucle.
• SELECT/CASE: Permiten múltiples selecciones.
• IF: el condicional de toda la vida.
• KEYWAIT/MOUSEWAIT: El programa queda a la espera de pulsar una tecla (o botón del ratón).

3 Lectura de teclado, ratón y joystick:

Teclado:

• KEY: Devuelve el código ASCII de la tecla pulsada.
  
• INKEY$:Devuelve la tecla que ha pulsado el usuario.
  
• INPUT: Lee un linea de texto hasta que se pulsa enter.

Ratón:

• MOUSESTATE: Devuelve la localización del ratón y el estado de los botones.
• MOUSEAXIS:Devuelve información sobre alguno de los parámetros del ratón.
  
• SETMOUSE: Fija las coordenadas del ratón. Útil para limitarle el movimiento.

Joystick:

• JOYSTATE: Devuelve la posición del joystick y de los dos botones.
• GETJOY...: Solo para usuarios registrados. Permite acceder hasta a diez joysticks con treinta y dos botones cada uno.

4 Sonido y música:

Sonido (solo está soportado wav-PCM):

• LOADSOUND: Carga un sonido asignándole un identificador que servirá para acceder al sonido durante el resto del programa.
• PLAYSOUND: Toca un sonido.
• STOPSOUND: Para un determinado sonido.
• SOUNDPLAYING: Determina si un determinado sonido está reproduciéndose o ha acabado.
  
• HUSH: Para todos los sonidos.

Música (tenemos algo más de variedad:mp3, wav y midi):

• PLAYMUSIC: A diferencia del sonido, no hay que cargarlo previamente, basta indicarle la ruta del fichero.
• ISMUSICPLAYING: Determina si la música se está reproduciendo o no.
• MUSICVOLUME: Fija el volumen.
• PAUSEMUSIC: Pausa la música.
  
• STOPMUSIC: Para la música.

5 Gráficos en 2D:

Algunas instrucciones generales para la pantalla:

• GETSCREENSIZE: Obtenemos la resolución de la pantalla. Recordemos que la fijamos al iniciar el proyecto.
• SETSCREEN: Cambia el tamaño de la pantalla.
  
• ISFULLSCREEN: Averigua si estamos a pantalla completa o no.
• LIMITFPS: Limita el máximo de frames por segundo.
  

GLBasic usa tres buffers:

1. Primary Surface: Lo que vemos en pantalla.
2. Back buffer: Donde dibujan todos los comandos gráficos. No es visible hasta que se transfiere su contenido con la orden SHOWSCREEN.
3. Offscreen Surface: Donde se almacen el background o fondo.

Para trabajar en ésta última, tenemos tres órdenes:

• LOADBMP: Carga la imagen que le pasamos en la Offscreen Surface.
  
• BLACKSCREEN:Limpia el fondo dejándolo en negro.
  
• USEASBMP:Copia el Back Buffer al Offscreen Surface.

Empecemos con los comandos más simples.Recordemos que se trabaja en un buffer y que no veremos nada hasta usar SHOWSCREEN:

• SETPIXEL: Dibuja un punto.
• GETPIXEL: Obtenemos el color del punto de coordenadas especificadas.
• DRAWLINE: Dibuja una recta.
• DRAWRECT: Dibuja un rectángulo.

Para trabajar con texto tenemos:

• PRINT: Imprime texto/números en la posición que especifiquemos.
• GETFONTSIZE: Devuelve el tamaño de un caracter en la fuente actual.
  
• LOADFONT: Carga un bmp para usarlo como fuente. Ojo a los requisitos del bmp.
• SETFONT: Asigna una fuente cargada con la orden anterior a las instrucciones PRINT e INPUT.
  

Pasamos a los sprites (podemos usar bmp o png a 8 o 24 bis):

• LOADSPRITE: Carga un sprite desde un archivo y le asigna un identificador para posteriores usos.
• SAVESPRITE: Graba el sprite especificado.
  
• DRAWSPRITE: Dibuja el sprite en el Back Buffer.
• ROTOSPRITE: Similar a la anterior pero girando un ángulo.
• ZOOMSPRITE: Similar a DRAWSPRITE pero escalada (admite reflexiones)
• ROTOZOOMSPRITE: ¿Por qué no tener ambas instrucciones en una sola?
  
• STRETCHSPRITE: Similar a ZOOMSPRITE pero especificamos el tamaño final en píxeles en lugar del factor de escalado.
  

Podemos trabajar con animaciones (tiras de sprites):

• LOADANIM: Carga una imagen partiéndola en trozos.
• DRAWANIM: Dibuja el trozo que le indiquemos de una animación.
• SETSPRITEANIM:Ajusta el trozo si quieres usar un sprite con DRAWANIM.

Existen instrucciones similares a las de los sprites (rotar, zoom,...)

Se considera transparente el color R:255,G:0 B:128. Queda bastante más por ver, pero por ahora es suficiente para empezar a trabajar.

Enlaces:

Listado alfabético de instrucciones.
Listado de instrucciones por categorías.

GLBasic

Tras unos años sin aporrear el teclado para hacer algún programita vuelve a picarme el gusanillo. Para ello vamos a empezar con algo simple, por ejemplo Basic. Ni siquiera Visual, solo Basic, aunque adaptado a gráficos con la idea de desarrollar algún juego simplón.

Puede compilar para varias plataformas:Windows, Linux, Mac OS X, Apple iPhone, Apple iPad and iPod Touch, Palm Pre, Pocket PC, GP2X, GP2X Wiz y Pandora Console.

En su momento jugué a "Lost Labyrinth" y erróneamente pensé que había sido desarrollado en este entorno, cuando en realidad usan PureBasic. Otro día le daremos un tiento.

Podemos empezar trasteando en la página oficial (www.glbasic.com) y descargarnos el entorno de desarrollo(www.glbasic.com/files/glbasic_sdk.exe), la versión actual es la 9. Es recomendable ver un pequeño vídeo que nos muestra un primer juego muy simple para hacernos una idea (www.glbasic.com/files/myfirstgame.wmv).

Tras ver el vídeo podemos pasar a los tutoriales:

Índice:

• 01 General
• 02 Editor
• 04 Graphics (2D)
• 05 Input
• 06 Sound+Music
• 07 Network Games
• 08 Graphics (3D)
• 09 Types
• 10 The First Game
• 11 Homework
• 12 Advanced
• 13 The Second Game

No, no se ha perdido. El tutorial 03 simplemente no existe.

Enlaces:
El blog oficial: http://www.glbasic.com/forum/index.php
Un blog en español: litiopixel.blogspot.com
Una intro en la wikipedia : en.wikipedia.org/wiki/GLBasic
Canal en YouTube: www.youtube.com/user/GernotFrisch
La wiki oficial:http://wiki.just-do-i-t.com/index.php?title=GLBasic_Wiki
Un blog en inglés: http://pandorawiki.org/GLBasic_tutorial