Ir al contenido

publicidad
publicidad

Foto

Barra de vida en XNA


Este tema ha sido archivado. Esto significa que no puedes responder en este tema.
8 respuestas en este tema

#1

Escrito 24 septiembre 2009 - 17:07

Hola, pues me gustaria saber si alguien me puede ayudar en como hacer una barra de vida para un personaje. Mas o menos se como hacerlo el problema es que no se como crear una textura que vaya disminuyendo proporcionalmente al daño que el personaje recibe. Si alguien puede ayudar estaria muy agradecido. :D

  • Ellolo17

  • Zodiark

  • vida restante: 100%
  • Registrado: 16 nov 2006
  • Mensajes: 6.208
#2

Escrito 24 septiembre 2009 - 21:35

Muy facil: Te haces un sprite , da igual el ancho, lo que importa porque se mantiene constante es el alto y si eso te diria que solo un sprite de ancho, a no ser que quieras hacer un degradado.

Pues bien, en el codigo lo reescalas a 100 pixels de ancho. Como solo tiene un pixel de ancho el original no debe de crear ningun efecto raro.

Luego haces que segun la vida del personaje sea mas o menos ancho. Si la vida es 80 que mida 80 pixels de ancho, por ejemplo.

Con eso tienes una barra basica. Luego si quieres mas avanzadas sería mas complicado -un truco para eso es hacerse la barra entera como un gif de 100 fotogramas en el que la animacion sea de la barra llenandose/vaciandose. Luego se hace que si la vida es 80% entonces se cargue el fotograma 80 o el fotograma 100-80, segun si la animacion es de llenado o de vaciado, y puede quedar mas chulo.

Luego si quieres efectos de que la barra se "cae" como en algunos juegos de lucha que la parte perdida cae para abajo, eso es crearte un nuevo sprite con la imagen de la barra , hacerlo del tamaño de la vida perdido -si pierde 10 puntos de vida hacerlo de 10 pixels de ancho-, colocarlo donde estaria la vida y animarlo para que caiga y gire a la vez mientras que su transparencia se asigna segun la altura. Cuando no se use esta colocado abajo, create 4 de ellos y que se vayan colocando segun vayan siendo necesarios.

Espero haberte ayudado con esto.

Un saludo.

  • Ellolo17

  • Zodiark

  • vida restante: 100%
  • Registrado: 16 nov 2006
  • Mensajes: 6.208
#3

Escrito 24 septiembre 2009 - 21:39

Mira, aqui tienes un ejemplo, en muchas paginas web hacen algo similar: Se crea una imagen de un solo pixel que -bueno, en el browser se repite- se alarga hasta donde tu digas.

Imagen Enviada

En este caso es horizontal en vez de vertical. Tu haz una de prueba, vertical, de 1 pixel de ancho por 10 de alto, y haz la prueba de crearte el sprite con esa iamgen y asignarle un ancho de 100 pixeles y mantener el alto. Y si funciona, sigues haciendo eso.

Al menos ese es el estilo que he estado usando en algunos juegos que he hecho.

Un saludo.

EDIT:::::::::::.

Otro ejemplo que se ve mejor: Intenta hacerlo como el del medio, a eso me refiero y tendria que quedar asi. El de abajo no lo tendras a no ser que repitas la imagen 100 veces y eso no se si el XNA te lo permite pero de todos modos es mucho trabajo en comparacion.
Imagen Enviada

#4

Escrito 24 septiembre 2009 - 22:51

Gracias por las respuestas Ellolo. Pero no llego a pillarlo del todo :? No se como a partir de una imagen de un pixel puedo reescalarlo a 100 pixeles, como dices antes. En principio quiero hacer una barra de vida vertical, asi que tus ejemplos me sirven, pero no entiendo muy bien lo de que tengo que reescalarlo. Eso seria como estirarlo o como poner muchas imagenes juntas? Es que me lio ahi. Lo siento por mi ignorancia :-D . Y si me vuelves a reponder me puedes poner un miniejemplo please. Gracias

#5

Escrito 24 septiembre 2009 - 23:08

Gracias por las respuestas Ellolo. Pero no llego a pillarlo del todo :? No se como a partir de una imagen de un pixel puedo reescalarlo a 100 pixeles, como dices antes. En principio quiero hacer una barra de vida vertical, asi que tus ejemplos me sirven, pero no entiendo muy bien lo de que tengo que reescalarlo. Eso seria como estirarlo o como poner muchas imagenes juntas? Es que me lio ahi. Lo siento por mi ignorancia :-D . Y si me vuelves a reponder me puedes poner un miniejemplo please. Gracias


Si hombre, tienes una imagen, con cierto tamaño determinado. Si te das cuenta, en el XNA para dibujar un sprite seria:

[code:1]spriteBatch.Draw(Textura2D, new Rectangle (coordenada x, coordenada y, anchura, altura), color).
[/code]

Bien, pues si quieres de alguna manera variar la anchura por ejemplo, solo deberias hacer que de alguna manera si tu salud por ejemplo es de 80, decirle:

[code:1]spriteBatch.Draw(Textura2D, new Rectangle (coordenada x, coordenada y, 80, altura), color).[/code]

Espero haberte ayudado ;)

#6

Escrito 24 septiembre 2009 - 23:39

aaa ok. Gracias a los dos. Aun asi no cerreis este post por si surgen mas dudas.

PD: Habia leido en algun sitio que se podia crear una textura directamente desde xna sin ninguna imagen previa y habia pensado que quizas eso seria mejor o mas facil de utilizar sabeis como se utiliza?

  • Ellolo17

  • Zodiark

  • vida restante: 100%
  • Registrado: 16 nov 2006
  • Mensajes: 6.208
#7

Escrito 25 septiembre 2009 - 00:10

Eso es mas complicado porque primero tienes que usar un comando para "colorear un cursor" -que todas las lineas que se dibujen desde ese comando tengan el color indicado en el comando- y hacer que dibuje las areas y controlar por codigo que si se recibe un golpe el dibujo se haga mas pequeño. Es un ROLLO. No te lo recomiendo.

Aparte son varios comandos que se hacen en cada renderizado del juego -cambia color, dibuja cuadrado/dibuja linea (no se lo que tiene el XNA sobre eso), dibuja otro cuadrado o cuantas lineas hagan falta para hacer lo que quieres-

Eso esta bien para algunas cosas como los controles de algun helicoptero, puntos de mira, y cosas similares pero para esto no. Aparte de que el resultado es similar al paint.

Mejor usa una imagen y todo eso.

Un saludo.

#8

Escrito 25 septiembre 2009 - 10:02

ok gracias hare caso :D

  • jonaSoft

  • Fledgling

  • vida restante: 100%
  • Registrado: 09 oct 2009
  • Mensajes: 55
#9

Escrito 09 octubre 2009 - 18:50

Hay te dejo un pequeño tutorial de el tema.

http://www.xnadevelo...SoHealthy.shtml


Este tema ha sido archivado. Esto significa que no puedes responder en este tema.
publicidad
publicidad