HP/ health bar help pls


#1

My game is coming along well with the tutorial i found http://ursagames.com/shmuptutorial/shmup-tutorial-7-lives-and-scoring/ but this tutorial uses lives and i wanted to use HP instead and i saw the topic on this but if i try to add that it won’t work with my code that already have.


(Zachary Lewis) #2

It can often be good to have conversations with yourself. My conversation would be something like this:

This tutorial will teach me how to make a game with lives, but I want to make a game with hit points instead of lives.

What is different about hit points and lives?

Well, with lives, when you die you lose one. If you can’t lose any more, the game ends. With hit points, instead of dying, you lose hit points. If you can’t lose any more, the game ends.

Why don’t you just give your player, say, 100 lives and call them "hit points?"

I could, but each time the player dies, he resets. I don’t want the player to reset whenever he loses hit points.

So, why don’t you just skip the “player death” part of the code and give the player lots of lives?

Hmm. That could work. Instead of dying, the player would just lose a life and keep going. If the player can’t lose any more lives, the game ends. That’s exactly what I wanted!


(Mike Evmm) #3

Though not out loud preferably. At least not in public.


(Zachary Lewis) #4

You gotta shout it to yourself in a public restroom.


(Hussein Tammam) #6

I find myself doing this way too often… Should I be worried?


(Mike Evmm) #7

It depends. Are you doing it out loud shouting in a public restroom? If so you’re fine.


#8

Ok that makes sense but how do i go about make the actual visual health bar with this code GUI class:

 package  
    {
    	import flash.display.BitmapData;
    	import net.flashpunk.Entity;
    	import net.flashpunk.FP;
    	import net.flashpunk.graphics.Graphiclist;
    	import net.flashpunk.graphics.Image;
    	import net.flashpunk.graphics.Spritemap;
    	import net.flashpunk.graphics.Text;
     
    	public class GUI extends Entity 
    	{
     
    		private var pointsText:Text;
    		private var lives:Vector.<Spritemap> = new Vector.<Spritemap>;
     
    		public function GUI() 
    		{
     
    			var glist:Graphiclist = new Graphiclist();
     
    			var guiBackground:Image = new Image(new BitmapData(560, 20, false, 0x000000));
    			guiBackground.scrollX = 0;
    			guiBackground.scrollY = 0;
    			guiBackground.alpha = 0.5;
    			glist.add(guiBackground);
     
    			pointsText = new Text("Points: 0");
    			pointsText.width = 200;
    			pointsText.x = FP.width - 200;
    			pointsText.y = 2;
    			pointsText.scrollX = 0;
    			pointsText.scrollY = 0;
    			glist.add(pointsText);
     
     
    			for (var i:uint = 0; i < 3; i++) {
    				var life:Spritemap = new Spritemap(Assets.GRAPHIC_LIVES, 16, 16);
    				life.add("idle", [0]);
    				life.add("die", [1, 2, 3 , 4], 6, false);
    				life.play("idle");
    				life.scrollX = 0;
    				life.scrollY = 0;
    				life.y = 2;
    				life.x = 2 + i * 16;
    				lives.push(life);
    				glist.add(life);
    			}
     
    			graphic = glist;
    			layer = GC.LAYER_GUI;
    		}
     
    		public function updateScore():void
    		{
    			pointsText.text = "Points: " + GV.POINTS;
    		}
     
    		public function playerDeath():void
    		{
    			if(GV.HP >= 0 && GV.HP < lives.length) lives[GV.HP].play("die");
    		}
     
    	}
     
    }

#9

Should i just get a development team or something since i’m clearly not good at this and asking for help is ineffective since u guys are busy with ur own stuff


(Jean) #10

Well, truth is that coding isn’t for everyone.

At least, not for the average joe that want to jump directly into game programming, that’s a step further in being a decent coder. And well, just coping around codes will never make you a good coder. Not that I never saw a code online and never copied it, but most of the times we need to LEARN what in name of hell the code actually does. Learning what other codes do makes you have ideas to know how to do what you want.

So, if you aren’t programmer, yeah, you should get at least 1 coder for your project. Or you should try the game engines that have good ELI5 tutorials, like Stencyl and Scirra Construct 2.

But now for your question, your code just draw “hearts” or whatever Assets.GRAPHIC_LIVES is. To make a decent HP bar you need(at least) 2 images: the background of the bar, to draw the start and the limit of it. Normally a red retangle. And the actual HP of the Entity, that is normally a green rectangle drawed over the red one. When the player health changes, the green bar has it’s xscale reduced.

I also recommend, if you insist to be solo on your project, to watch the videos tutorials here. It’s also nice to enter zach’s vimeo channel so you can look a less badass version of him compared with his photo here on the forum.


#11

@zachwlewis @miguelmurca Ok i listened to you and went back and understood in more depth what the code means and i found a way to add the hp after looking it over i think implemented it into my correctly and it didn’t get an error(the healthbar i added ) but this happened. Code:

  package  
{
	import flash.display.BitmapData;
	import net.flashpunk.Entity;
	import net.flashpunk.FP;
	import net.flashpunk.graphics.Graphiclist;
	import net.flashpunk.graphics.Image;
	import net.flashpunk.graphics.Spritemap;
	import net.flashpunk.graphics.Text;
 
	public class GUI extends Entity 
	{
 
		private var pointsText:Text;
		private var hp:Vector.<Spritemap> = new Vector.<Spritemap>;
 
		public function GUI() 
		{
 
			var glist:Graphiclist = new Graphiclist();
 
			var guiBackground:Image = new Image(new BitmapData(560, 20, false, 0x000000));
			guiBackground.scrollX = 0;
			guiBackground.scrollY = 0;
			guiBackground.alpha = 0.5;
			glist.add(guiBackground);
 
			pointsText = new Text("Points: 0");
			pointsText.width = 200;
			pointsText.x = FP.width - 200;
			pointsText.y = 2;
			pointsText.scrollX = 0;
			pointsText.scrollY = 0;
			glist.add(pointsText);
 
 

			graphic = glist;
			layer = GC.LAYER_GUI;
		}
		private var ent:Entity;
		private var variable:String;
		
		public function Healthbar(x:Number, y:Number, w:Number, h:Number, ent:Entity, variable:String) 
		{
			this.x = x;
			this.y = y;
			setHitbox(w, h);
			this.ent = ent;
			this.variable = variable;
			layer = -10000;
		}
		
		override public function render():void 
		{
			Draw.rect(world.camera.x+x, world.camera.y+y, width, height, 0xFF0000);
			Draw.rect(world.camera.x+x, world.camera.y+y, width*ent[variable], height, 0x00FF00);
		}
	}
    add(new Healthbar(5, 5, 100, 5, getInstance("player"), GV.HP));
		public function updateScore():void
		{
			pointsText.text = "Points: " + GV.POINTS;
		}
 
		public function playerDeath():void
		{
			if(GV.HP >= 0 && GV.HP < hp.length) hp[GV.HP].play("die");
		}
 
	}

Error:C:\Users******\Documents\RGB\src\GUI.as: Error: A file found in a source-path can not have more than one externally visible definition. GUI;updateScore;playerDeath


(Hussein Tammam) #12
		override public function render():void 
	{
		Draw.rect(world.camera.x+x, world.camera.y+y, width, height, 0xFF0000);
		Draw.rect(world.camera.x+x, world.camera.y+y, width*ent[variable], height, 0x00FF00);
	}
}
add(new Healthbar(5, 5, 100, 5, getInstance("player"), GV.HP));
	public function updateScore():void
	{
		pointsText.text = "Points: " + GV.POINTS;
	}

	public function playerDeath():void
	{
		if(GV.HP >= 0 && GV.HP < hp.length) hp[GV.HP].play("die");
	}

The last 2 functions playerDeath and updateScore are outside the class. Look at that curly bracket right before the add(new Healthbar()) <-- And what is that doing in there? :smile:


#13

oh i didn’t even notice that i deleted a curly bracket earlier thought it was extra lol


#14

@zachwlewis @miguelmurca @Hussein_Tammam @DarkHyudrA Ok another problem after i fixed everything and made some tweaks but now all of a sudden it runs with no error but stuff that was working before now doesn’t work (the particle explosion doesn’t work, enemys don’t shoot, the points aren’t counted,hp bar doesn’t go down, the player position is reset every time it collides with an enemy) these are probably small little mistakes i made that i keep missing no matter how many times i look through so can u guys just go through it and tell me where i messed up (and how to fix if u know how) Player Class:

package 
{
	import net.flashpunk.Entity;
	import net.flashpunk.graphics.Image;
	import net.flashpunk.utils.Input;
	import net.flashpunk.utils.Key;
	import net.flashpunk.FP;
	
	public class Player extends Entity
	{
		[Embed(source = "../assets/R.png")]
		private const PLAYER:Class;
		
		public var image:Image;
		private var bulletDelay:Number = 0;
		public function Player()
		{
			super(42, 310); //initial x and y
			image = new Image(PLAYER);
			graphic = image;
			setHitbox(20, 20, 0, 0);
			type = "player";
			layer = GC.LAYER_PLAYER;
		}
		
		override public function update():void 
		{
			if (Input.check(Key.LEFT)) { x -= 5; }
			if (Input.check(Key.RIGHT)) { x += 5; }
			if (Input.check(Key.UP)) { y -= 5; }
			if (Input.check(Key.DOWN)) { y += 5; }
			if (x < 32 + FP.camera.x) x = 32 + FP.camera.x;
			if (x > FP.width - 32 + FP.camera.x) x = FP.width - 32 + FP.camera.x;
			if (y < 32) y = 32 ;
			if (y > FP.height - 32) y = FP.height - 32;
			if(image.alpha >= 1) {
				if (collide("enemy", x, y)) {
					x = FP.camera.x + 32;
					y = FP.halfHeight;
					image.alpha = 0;
				}
			} else {
				image.alpha += FP.elapsed;
			}
			if(bulletDelay > 0)  bulletDelay -= FP.elapsed;
             else if (Input.check(Key.SPACE)) {
	          bulletDelay = 0.5;
	          var _bullet:Bullet = FP.world.create(Bullet) as Bullet;
	          _bullet.x = x;
	           _bullet.y = y;
	            _bullet.setMovement(400);
	             FP.world.add(_bullet);
}
            if (collide("enemy", x, y)) {
	           GV.PARTICLE_EMITTER.explosion(x, y);
	           x = FP.camera.x + 32;
	           y = FP.halfHeight;
	           image.alpha = 0;
}
             if(image.alpha >= 1) {
	         var enemyBullet:Ebullet = collide("bulletB", x, y) as Ebullet;
	         if (collide("enemy", x, y) || enemyBullet) {
		     GV.HP-1;
		    if (enemyBullet) {
			enemyBullet.destroy();
		    }
	        }
            } else {
	         image.alpha += FP.elapsed;
            }
			if (collide("enemy", x, y))
			{
				image.color = 0x000000;
			}
			else
			{
				image.color = 0xFF0000;
			}
			
			var b:Ebullet = collide("bulletB", x, y) as Ebullet;

			
			if (b)
			{
				
				b.destroy();
			}
			super.update();
		}
		public function kill():void 
{
	x = FP.camera.x + 32;
	y = FP.halfHeight;
	image.alpha = 0;
	GV.HP--;
	GV.CURRENT_GUI.playerDeath();
	if (GV.HP < 0) FP.world = new GameOver;
}
		public function destroy():void
{
	GV.PARTICLE_EMITTER.explosion(x, y);
	FP.world.recycle(this);
}
	}	
}

World Class:

package 
{
import net.flashpunk.World;
import net.flashpunk.Entity;
import flash.display.BitmapData;
import net.flashpunk.graphics.Image;
import net.flashpunk.utils.Input;
import net.flashpunk.FP;
import net.flashpunk.graphics.Backdrop;
	public class MyWorld extends World
	{
		[Embed(source = "../assets/Binary-6.gif")]
		public static const LVL21_30:Class;
		private var cameraSpeed:Number = 50; 
		private var nextSpawn:Number = 1;
		private var square:Entity;
		public function MyWorld()
		{
			GV.reset();
			add(GV.CURRENT_GUI);
          GV.PLAYER.x = 42;
			GV.PLAYER.y = 310;
			add(GV.PLAYER);
			add(GV.PARTICLE_EMITTER);
			var b:Backdrop = new Backdrop(LVL21_30, true, true);
			b.scrollX = 0.5;
			b.scrollY = 0.5;
            add(new Hbar(5, 5, 100, 5, GV.PLAYER, GV.HP));
			var e:Entity = new Entity;
			e.graphic = b;
			e.layer = GC.LAYER_BACKGROUND;
			add(e);
		}
		override public function update():void
		{
			super.update();
			camera.x += cameraSpeed * FP.elapsed;
			GV.PLAYER.x += cameraSpeed * FP.elapsed;
			nextSpawn -= FP.elapsed;
			if (nextSpawn <= 0) {
				nextSpawn = 1;
				var _enemy:EnemyA = create(EnemyA) as EnemyA;
				_enemy.x = FP.camera.x + FP.width + 100;
				_enemy.y = FP.rand(FP.height);
				add(_enemy);
			}
	}
	}
}

Enemy Class:

package 
{
	import net.flashpunk.Entity;
	import net.flashpunk.graphics.Image;
	import net.flashpunk.FP;
	public class EnemyA extends Entity 
	{
		private var speedY:Number = 100;
		private var killed:Boolean = false;
		private var shootDelay:Number;
		[Embed(source = "C:/Users/pico/Documents/RGB/assets/BLK.png")] public const ENEMY_A:Class;
		public function EnemyA() {
			graphic = new Image(ENEMY_A);
			x = FP.rand(FP.screen.width);
			y = FP.rand(FP.screen.height);
			type = "enemy";
			setHitbox(20, 20, 0, 0);
			layer = GC.LAYER_ENEMY;
			}
			override public function update():void
		{
			shootDelay = 3;
			if (y < 32 && speedY < 0) speedY *= -1;
			if (y > FP.height - 32 && speedY > 0) speedY *= -1; 
			y += speedY * FP.elapsed;
 
			if (x < FP.camera.x - 100 - width) {
				   destroy();
				FP.world.recycle(this);
			}
			var _bullet:Bullet = (collide("bullet", x, y)) as Bullet;
              if (_bullet) {
	          _bullet.destroy();
	           destroy();
            }
			if (shootDelay > 0) shootDelay -= FP.elapsed;
            else {
	        var newBullet:Ebullet = FP.world.create(Ebullet) as Ebullet;
	        newBullet.x = x - halfWidth;
	        newBullet.y = y;
	        newBullet.setMovement( -100, 0);
	        FP.world.add(newBullet);
	        shootDelay = 2;
}
		}
		
override public function added():void
{
	killed = false;
}
public function destroy():void
{
	if (killed) {
		GV.POINTS += 100;
		GV.CURRENT_GUI.updateScore();
		GV.PARTICLE_EMITTER.explosion(x, y);
	}
	FP.world.recycle(this);
}
	}
	
}

GUI Class:

package  
{
	import flash.display.BitmapData;
	import net.flashpunk.Entity;
	import net.flashpunk.FP;
	import net.flashpunk.graphics.Graphiclist;
	import net.flashpunk.graphics.Image;
	import net.flashpunk.graphics.Spritemap;
	import net.flashpunk.graphics.Text;
	public class GUI extends Entity 
	{
 
		private var pointsText:Text;
		private var hp:Vector.<Spritemap> = new Vector.<Spritemap>;
 
		public function GUI() 
		{
 
			var glist:Graphiclist = new Graphiclist();
 
			var guiBackground:Image = new Image(new BitmapData(560, 20, false, 0x000000));
			guiBackground.scrollX = 0;
			guiBackground.scrollY = 0;
			guiBackground.alpha = 0.5;
			glist.add(guiBackground);
 
			pointsText = new Text("Points: 0");
			pointsText.width = 200;
			pointsText.x = FP.width - 200;
			pointsText.y = 2;
			pointsText.scrollX = 0;
			pointsText.scrollY = 0;
			glist.add(pointsText);
 
 

			graphic = glist;
			layer = GC.LAYER_GUI;
		}
		private var ent:Entity;
		private var variable:String;
		

	
		
		public function updateScore():void
		{
			pointsText.text = "Points: " + GV.POINTS;
		}
 
		public function playerDeath():void
		{
			if(GV.HP >= 0 && GV.HP < hp.length) hp[GV.HP].play("die");
		}
 }
	}

HP Class:

 package 
    {
    	import net.flashpunk.Entity;
    	import net.flashpunk.utils.*;
    public class Hbar extends Entity 
    	{
    		private var ent:Entity;
    		private var variable:int;
    		
    		public function Hbar(x:Number, y:Number, w:Number, h:Number, ent:Entity, variable:int) 
    		{
    			this.x = x;
    			this.y = y;
    			setHitbox(w, h);
    			this.ent = ent;
    			this.variable = variable;
    			layer = -10000;
    		}
    		
    		override public function render():void 
    		{
    			Draw.rect(world.camera.x+x, world.camera.y+y, width, height, 0xFF0000);
    			Draw.rect(world.camera.x+x, world.camera.y+y, width*ent[variable], height, 0x00FF00);
    		}
    	}
    	
    }

Particle Controller Class:

      package  
        {
        	import flash.display.BitmapData;
        	import flash.display.ColorCorrection;
        	import net.flashpunk.Entity;
        	import net.flashpunk.graphics.Emitter;
        	import net.flashpunk.utils.Ease;
            import net.flashpunk.FP;
        	public class ParticleController extends Entity 
        	{
         
        		private var _emitter:Emitter;
                
        		public function ParticleController() 
        		{
        			_emitter = new Emitter(new BitmapData(3, 3, false, 0xFFFFFF), 3, 3);
        			_emitter.newType("explosion", [0]);
        			_emitter.setMotion("explosion", 0, 100, 2, 360, -40, 1, Ease.quadOut);
        			_emitter.setAlpha("explosion", 1, 0.1);
        			graphic = _emitter;
        			layer = GC.LAYER_PARTICLES;
        		}
         
        		public function explosion(_x:Number, _y:Number, particles:int = 20 ):void
        		{
        			for (var i:uint = 0; i < particles; i++) {
        				_emitter.emit("explosion", _x, _y);
        			}
        		}
        	}
        }

Bullet Class:

package
{
	import net.flashpunk.Entity;
	import net.flashpunk.FP;
    import net.flashpunk.graphics.Spritemap;
	public class Bullet extends Entity
	{
		[Embed(source = "../assets/bullet.png")]
		public static const BULLET:Class;
		private var sprites:Spritemap;
		private var moveX:Number = 0;
		private var moveY:Number = 0;
		public function Bullet()
		{
			sprites = new Spritemap(BULLET, 10, 10);
			sprites.add("idle", [0, 1, 2], 12, true);
			sprites.play("idle");
			graphic = sprites;
			setHitbox(10, 10);
			type = "bullet";
			layer = GC.LAYER_BULLETS;
		}
        public function setMovement(_x:Number = 0, _y:Number = 0):void
		{
			moveX = _x;
			moveY = _y;
		}
 
		override public function update():void
		{
			x += moveX * FP.elapsed;
			y += moveY * FP.elapsed;
			if (x > FP.camera.x + FP.width + 50 || x < FP.camera.x - 50 || y < - 50 || y > FP.height + 50) {
				destroy();
			}
		}
		public function destroy():void
		{
			
			FP.world.recycle(this);
		}
	}
}

Enemy Bullet Class:

package
{
	import net.flashpunk.Entity;
	import net.flashpunk.FP;
    import net.flashpunk.graphics.Spritemap;
	public class Ebullet extends Entity
	{[Embed(source = "../assets/Ebullet.png")] public static const EB_1:Class;
		private var _sprites:Spritemap;
		private var moveX:Number = 0;
		private var moveY:Number = 0;
 
	    public function Ebullet()
		{
		    _sprites = new Spritemap(EB_1, 10, 10);
			_sprites.add("idle", [0, 0, 0, 0, 1, 2, 3, 2, 1], 12, true);
			_sprites.play("idle");
			_sprites.centerOO();
			graphic = _sprites;
			type = "bulletB";
			setHitbox(8,8,4,4);
			layer = GC.LAYER_BULLETS;
			
		}
      
		public function setMovement(_x:Number = 0, _y:Number = 0):void
		{
			moveX = _x;
			moveY = _y;
		}
 
		override public function update():void
		{
			x += moveX * FP.elapsed;
			y += moveY * FP.elapsed;
			if (x > FP.camera.x + FP.width + 50 || x < FP.camera.x - 50 || y < - 50 || y > FP.height + 50) {
				destroy();
			}
		}
		public function destroy():void
		{
			
			FP.world.recycle(this);
		}
	}
}

(Mike Evmm) #15

Are you calling super.update() when overriding the update() function?


#16

which class are you referring to?


(Mike Evmm) #17

Your player class seems to be missing it, but I was taking a guess from your description. It’s a common problem in this forum.


#18

yea its there i couldn’t find it in there cuz i accidentally put my enemy bullet class instead of my player class i fixed it (Don’t know how it got that way though. it could have been a mix up when i was added the code and made the code preformatted idk )


#19

I don’t mean to be pushy cuz i know u guys have your own stuff to do but if u can please respond ASAP i am trying to finish this game before school starts(Which is in a few days btw) :bow: :pray:


(Mike Evmm) #20

I don’t understand, have you put super.update() back again?


#21

yes its in there it was there the whole time.