7 .-. 2D. Sprites. Hacer un HUD. Barras de Vida.

Hola de nuevo. Vamos allá con nuestro HUD para el juego. Uno de los elementos más habituales en los juegos son las barras de vida o estado. Para esta he optado por un diseño simple de dos barras una de vida y otra de mana tal y como se puede ver en la foto.

Bien, antes de nada decir que la imagen del personaje la he bajado de aquí es free y agradezco a ProductiveDreams.com la gentileza. Bien, ¿como planteamos esto? Es muy sencillo. Por un lado tenemos un PNG que es el círculo rosa, la cara del personaje y las barras "vacías" y por otro un par de pequeñas imágenes que son los "fillers" que van a rellenar la barra. ¿Cómo funciona?

Pues bien la base se pinta todo el tiempo "tal cual" y los fillers que hacen el efecto relleno los pintamos según tengamos más o menos vida. Antes de nada decir que podeis bajar aquí los diseños para que no tengais problemas.

Vamos con el código. En la clase Motor, tenemos que definir dos variables Vida y Mana que será públicas (quiero poder cambiarlas desde Form1)

    Public Vida As Long = 45
    Public Mana As Long = 60

Necesitamos también declarar las texturas para el HUD.

    'HUD

    Dim HUD As Sprite
    Dim TexturaBarraVida As Texture
    Dim TexturaRellenoBarraVida As Texture
    Dim TexturaRellenoBarraMana As Texture

A continuación tenemos que cargar las texturas que emplearemos en el HUDBAR que serán 3, una para el dibujo de base (la cara el círculo y las dos barras vacías) y otras dos para los rellenos o fillers. Esto lo iniciamos en POSCONFIGURARDX dentro de Motor.

            'HUD
            HUD = New Sprite(DP3)
            TexturaBarraVida = TextureLoader.FromFile(DP3, Application.StartupPath & "\3d\HUD\hudbar1.png")
            TexturaRellenoBarraVida = TextureLoader.FromFile(DP3, Application.StartupPath & "\3d\HUD\hudfiller.png")
            TexturaRellenoBarraMana = TextureLoader.FromFile(DP3, Application.StartupPath & "\3d\HUD\hudfiller2.png")

Como veis creo el objeto HUD de tipo Sprite que es el que va a controlar todo el pintado y cargo las tres texturas. Ojo a las rutas de los ficheros.

Ahora solo nos queda crear un Sub PintaHud que controle todo esto, lo vamos a hacer en la propia clase Motor.

    Private Sub PintaHud()
        Try
            Dim i As Long
            HUD.Begin(SpriteFlags.AlphaBlend)
            HUD.Draw2D(TexturaBarraVida, New Point(0, 0), 0, New Point(0, 10), Color.White)
            For i = 1 To Vida
                HUD.Draw2D(TexturaRellenoBarraVida, New Point(0, 0), 0, New Point(i + 15, 55), Color.White)
            Next

            For i = 1 To Mana
                HUD.Draw2D(TexturaRellenoBarraMana, New Point(0, 0), 0, New Point(i + 15, 78), Color.White)
            Next

            HUD.Flush()
            HUD.End()


        Catch ex As Exception
            MessageBox.Show(ex.Message)
        End Try
    End Sub

Bien lo que hacemos es crear la escena de Sprites mediante Begin indicando que queremos emplear AlphaBlend. A continuación dibujamos la base con la cara y los circulos y la barra vacía.

Mediante unos bucles controlo cuantos "Fillers" dibujo desde 1 hasta la cantidad de Vida o de Mana así como la posición en donde quiero dibujarlos. Finalmente con Flush forzamos el volcado de todos los sprites al dispositivo DX y End deja las cosas como estaban antes de llamar a Begin.

Por último para darle algo más de vidilla vamos a Form1 y, en el apartado de control de las teclas, vamos a poner para que podamos aumentar y disminuir la vida y el mana y veamos que funciona. Vamos al evento KeyDown y ahí añadimos estos Case.

                Case Keys.T
                    Engine.Vida -= 5
                    Engine.Mana -= 3
                Case Keys.Y
                    Engine.Vida += 1
                    Engine.Mana += 5