Tutorial XNA creazione di una barra energia

Riporto l'articolo scritto per il sito http://www.iprogrammatori.it/articoli/programmazione/art_xna-–-creazione-di-un-barra-come-indicat_1139.aspx

Introduzione
In questo articolo, vedremo come gestire nei nostri video giochi in XNA, una barra che indica il valore di energia.
Potrebbe tornare utile, per esempio per quei giochi in cui si fa uno di autoveicolo, in cui visualizzare una barra che indica il carburante a disposizione o in quei video giochi in cui due lottatori, si colpiscono e quindi diminuisce la propria energia.
Si crea una barra, come illustrato in figura 1.

Figura 1

A questo punto, si crea un nuovo progetto in XNA, nel progetto, nella sezione content, quella relativa alle risorse, aggiungiamo tale immagini.
Dalla finestra di “Esplora Soluzioni” facciamo click con il tasto destro sulla sezione “Content” e dal menu di scelta rapida, selezioniamo la voce “Aggiungi” e successivamente “Elemento esistente”.
Verifichiamo che è presenta la nostra risorsa.

Stesura di codice
Passiamo alla stesura del codice, nella classe “Game1” dichiariamo due variabili a livello di classe, una di tipo Texture2D che permette di gestire la risorsa ed una di tipo intero, per la gestione del valore per indicare la porzione.
Qui di seguito si riporta la dichiarazione di tali dichiarazioni.

//oggetto per l'immagine indicatore di energia

Texture2D BarraEnergia;

//imposto il valore iniziale della barra

int EnergiaCorrente = 100;

Nell’evento “LoadContent”, scriviamo il codice per quanto concerne il caricamento della risorsa.
Qui di seguito si riporta il codice dell’evento “LoadContent”.

protected override void LoadContent()

{

// Create a new SpriteBatch, which can be used to draw textures.

spriteBatch = new SpriteBatch(GraphicsDevice);

//Carico la risorsa immagine

BarraEnergia = Content.Load<Texture2D>("BarraEnergia");

// TODO: use this.Content to load your game content here

}

Nell’evento “Update” si crea un oggetto di tipo “KeyboardState” per gestire il tasto che è stato digitato, nel caso che è la freccia sinistra, si verifica un decremento di un valore, altrimenti aumento di un valore, l’arco dei valori va da 0 a 100.
Qui di seguito si riporta il codice completo dell’evento Update.

protected override void Update(GameTime gameTime)

{

// Allows the game to exit

if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)

this.Exit();

//gestione dei tasti

KeyboardState Tasto = Keyboard.GetState();

//sposto la barra a destra

if (Tasto.IsKeyDown(Keys.Right ) == true)

{

EnergiaCorrente += 1;

}

//Sposto la barra a sinistra

if (Tasto.IsKeyDown(Keys.Left ) == true)

{

EnergiaCorrente -= 1;

}

//limito un valore tra due misure, ossia tra 0 e 100

EnergiaCorrente = (int)MathHelper.Clamp(EnergiaCorrente, 0, 100);

// TODO: Add your update logic here

base.Update(gameTime);

}

A questo punto scriviamo nell’evento “Draw” il codice che permette di disegnare la barra che indica l’energia disponibile, che è di colore rosso, una barra che indica l’energia che manca (griglio), ed il bordo della barra (nera).
Qui di seguito si riporta il codice delle suddette operazioni.

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

spriteBatch.Begin();

//disegno la barra quella relativo al valore negativo

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, BarraEnergia.Width, 44), new Rectangle(0, 45, BarraEnergia.Width, 44), Color.Gray);

//Indica il valore positivo, quanta energia

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, (int)(BarraEnergia.Width * ((double)EnergiaCorrente / 100)), 44), new Rectangle(0, 44, BarraEnergia.Width, 44), Color.Red);

//il bordo del rettangolo

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, BarraEnergia.Width, 46), new Rectangle(0, 0, BarraEnergia.Width, 38), Color.Black);

spriteBatch.End();

base.Draw(gameTime);

}

Riportiamo il codice completo della classe Game1

using System;

using System.Collections.Generic;

using System.Linq;

using Microsoft.Xna.Framework;

using Microsoft.Xna.Framework.Audio;

using Microsoft.Xna.Framework.Content;

using Microsoft.Xna.Framework.GamerServices;

using Microsoft.Xna.Framework.Graphics;

using Microsoft.Xna.Framework.Input;

using Microsoft.Xna.Framework.Media;

namespace XnaEnergia

{

/// <summary>

/// This is the main type for your game

/// </summary>

public class Game1 : Microsoft.Xna.Framework.Game

{

GraphicsDeviceManager graphics;

SpriteBatch spriteBatch;

//oggetto per l'immagine indicatore di energia

Texture2D BarraEnergia;

//imposto il valore iniziale della barra

int EnergiaCorrente = 100;

public Game1()

{

graphics = new GraphicsDeviceManager(this);

Content.RootDirectory = "Content";

}

/// <summary>

/// Allows the game to perform any initialization it needs to before starting to run.

/// This is where it can query for any required services and load any non-graphic

/// related content. Calling base.Initialize will enumerate through any components

/// and initialize them as well.

/// </summary>

protected override void Initialize()

{

// TODO: Add your initialization logic here

base.Initialize();

}

/// <summary>

/// LoadContent will be called once per game and is the place to load

/// all of your content.

/// </summary>

protected override void LoadContent()

{

// Create a new SpriteBatch, which can be used to draw textures.

spriteBatch = new SpriteBatch(GraphicsDevice);

//Carico la risorsa immagine

BarraEnergia = Content.Load<Texture2D>("BarraEnergia");

// TODO: use this.Content to load your game content here

}

/// <summary>

/// UnloadContent will be called once per game and is the place to unload

/// all content.

/// </summary>

protected override void UnloadContent()

{

// TODO: Unload any non ContentManager content here

}

/// <summary>

/// Allows the game to run logic such as updating the world,

/// checking for collisions, gathering input, and playing audio.

/// </summary>

/// <param name="gameTime">Provides a snapshot of timing values.</param>

protected override void Update(GameTime gameTime)

{

// Allows the game to exit

if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)

this.Exit();

//gestione dei tasti

KeyboardState Tasto = Keyboard.GetState();

//sposto la barra a destra

if (Tasto.IsKeyDown(Keys.Right ) == true)

{

EnergiaCorrente += 1;

}

//Sposto la barra a sinistra

if (Tasto.IsKeyDown(Keys.Left ) == true)

{

EnergiaCorrente -= 1;

}

//limito un valore tra due misure, ossia tra 0 e 100

EnergiaCorrente = (int)MathHelper.Clamp(EnergiaCorrente, 0, 100);

// TODO: Add your update logic here

base.Update(gameTime);

}

/// <summary>

/// This is called when the game should draw itself.

/// </summary>

/// <param name="gameTime">Provides a snapshot of timing values.</param>

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

spriteBatch.Begin();

//disegno la barra quella relativo al valore negativo

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, BarraEnergia.Width, 44), new Rectangle(0, 45, BarraEnergia.Width, 44), Color.Gray);

//Indica il valore positivo, quanta energia

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, (int)(BarraEnergia.Width * ((double)EnergiaCorrente / 100)), 44), new Rectangle(0, 44, BarraEnergia.Width, 44), Color.Red);

//il bordo del rettangolo

spriteBatch.Draw(BarraEnergia, new Rectangle(this.Window.ClientBounds.Width / 2 - BarraEnergia.Width / 2, 30, BarraEnergia.Width, 46), new Rectangle(0, 0, BarraEnergia.Width, 38), Color.Black);

spriteBatch.End();

base.Draw(gameTime);

}

}

}

Conclusioni
Ora non ci resta che testare il nostro programma, facendo click sul pulsante "Start" oppure tramite il tasto “F5”, ogni volta che si digita il pulsante freccia sinistra, la barra rossa, diventerà sempre più corta, mentre con il tasto freccia destra aumenterà.
L'articolo ha voluto fornire una delle tante tecniche per la gestione delle informazioni di un determinata situazione, come può essere un soldato la cui energia diminuisce in base ai colpi subiti oppure altre situazioni di gioco.