This site requires JavaScript, please enable it in your browser!
Greenfoot back
ironphoenix20
ironphoenix20 wrote ...

2017/3/25

HealthBar creation

1
2
3
ironphoenix20 ironphoenix20

2017/3/25

#
Hi, I am trying to create a generic healthbar where each act, the actor loses some healthpoints and the bar gradually turns red (from green). I am trying to code this but I'm unsure how to proceed. I'll provide my code below. For now, the bar stays green when i run it but i want it to gradually change color for each act. Any help or alternative ways to do it would be appreciated. Thanks in advance.
import greenfoot.*;  // (World, Actor, GreenfootImage, Greenfoot and MouseInfo)

/**
 * HealthBar generates and maintains a custom-sized image of a Health Bar
 * in green and red (red being missing HP).
 * 
 * Accepts any size - use Constants.
 * 
 * NOT FINISHED! Forgive my lack of commenting...
 * 
 * @author Jordan Cohen
 * @version 0.0.1 (2012)
 */
public class HealthBar extends Actor
{
    private double hp = 100;
    private double currHp = 100;
    private double damage = 5;
    
    // Declare Instance Variables
    
    private double currPercentHP;
    private int redBarSize;
    private int greenBarSize;

    // Declare Instance Images
    private GreenfootImage bar;
    private GreenfootImage blank;
    
    // Some constants - can be changed to suit size of related objects
    private final int HP_BAR_WIDTH = 150;
    private final int HP_BAR_HEIGHT = 20;
    private final int OFFSET = 36;

    // Declare Instance Objects
    private Actor target;

    // Declare some Color objects
    private Color myGreen = new Color (0, 255, 0);
    private Color myRed = new Color (255, 0, 0);

    /**
     * Main constructor - this is only called by the other Constructors
     * and is not intended to be called directly.
     */
    public HealthBar()
    {
        bar = new GreenfootImage(HP_BAR_WIDTH, HP_BAR_HEIGHT);
        blank = new GreenfootImage(1,1);
        bar.setColor(myGreen);
        bar.fill();
        /*if (currHP == maxHP)
        {*/
            this.setImage(bar);
        }
        /*else
        {
            this.setImage(bar);
        }*/
    

    /**
     * Constructor that takes one int - for objects starting with max hit points.
     * This will set both current and maximum hit points to the same value.
     */
    public HealthBar(int inMaxHP)
    {
        this(); // Calst he Main constructor (above)
        hp = inMaxHP;
        currHp = inMaxHP;
    }

    /**
     * Constructor takes an int for current and max hitpoints and also takes in an
     * Actor, which this HP Bar will follow - Whenever the Actor moves, so will this
     * hp bar. If the Actor is removed from the World, this HP bar will destroy itself.
     * 
     * NOTE: This is the Constructor used in the Bug simulation
     */
    public HealthBar (int inMaxHP, Actor target)
    {
        this(inMaxHP);
        this.target = target;
    }

    /**
     * Constructor that takes in a different value for current and max HP, ideal for
     * when a new health bar is needed for an Actor that doesn't have full HP.
     */
    public HealthBar(int inMaxHP, int inCurrHP)
    {
        this();
        hp = inMaxHP;
        currHp = inCurrHP;
    }

    /**
     * Act - do whatever the HealthBar wants to do. This method is called whenever
     * the 'Act' or 'Run' button gets pressed in the environment.
     */
    public void act() 
    {
        /*if (target.getWorld() != null)
        {
            setLocation (target.getX(), target.getY() - OFFSET);
        }
        else
            getWorld().removeObject(this);*/
        setLocation(200,200);
    }    

    /**
     * update Method:
     * 
     * Expects new current HP
     * 
     * Returns true if HP has changed (needs an update)
     * Returns false if HP has not changed (to avoid excessive processing)
     */
    public void update (int newCurrHP)
    {
        currHp-=damage;
        currPercentHP = (double) currHp / hp;
        greenBarSize = (int) (currPercentHP * HP_BAR_WIDTH);
        redBarSize = HP_BAR_WIDTH - greenBarSize;
        bar.fillRect(0,0,greenBarSize, HP_BAR_HEIGHT);
        bar.fillRect(greenBarSize, 0, redBarSize, HP_BAR_HEIGHT);
        this.setImage(bar);
                //return true;
        
        
        /*// Don't do anything if current HP hasn't changed
        if (newCurrHP != currHP)
        {
            if (newCurrHP == maxHP)
            {
                this.setImage(blank);
                //return false;
            }
            else
            {
                
                // Redraw HP bar w/ appropriate amount of green and red based on
                // current HP divided by max HP
                currHP = newCurrHP;
                currPercentHP = (double) currHP / maxHP;
                greenBarSize = (int) (currPercentHP * HP_BAR_WIDTH);
                redBarSize = HP_BAR_WIDTH - greenBarSize;
                //Troubleshooting code:
                //System.out.println("CurrHP: " + currHP + " curr%HP: " + currPercentHP);
                //System.out.println("GreenBar: " + greenBarSize + " RedBar: " + redBarSize);
                bar.setColor(myGreen);
                bar.fillRect(0,0,greenBarSize, HP_BAR_HEIGHT);
                bar.setColor(myRed);
                bar.fillRect(greenBarSize, 0, redBarSize, HP_BAR_HEIGHT);
                this.setImage(bar);
                //return true;
            }
        }
        //return false;*/
    }


}
ironphoenix20 ironphoenix20

2017/3/25

#
i did use some code from other classes so i may have some variables or methods not being used. i am aware of those.
ironphoenix20 ironphoenix20

2017/3/25

#
and while im not at this point yet, i do need the bar to start glowing/pulsing once it reaches a critical point (less than 20% health left). any ideas on how to do this?
Super_Hippo Super_Hippo

2017/3/25

#
Your are missing code to change the color in the 'update' method. For the pulsing: Add an act method and a timer. When the health is below 20 %, increase the timer field and change the color (or whatever you are trying to do with "pulsing") based on the timer. You may not just use 'bar.setColor(myRed)', but change the values of the color over time based on the timer.
ironphoenix20 ironphoenix20

2017/3/25

#
ok. ill try that.
ironphoenix20 ironphoenix20

2017/3/25

#
actually now im trying to have two parts to my bar. one part (on the left) that decreases in size and turns gradually from green to red and the second part on the right (that increases in size and is grey). originally i thought i could use two different bars and just increase/decrease their size but i cant set two images to the same actor. any ideas on how to do this?
Super_Hippo Super_Hippo

2017/3/25

#
You are already drawing 2 rectangles on one image and then using that image (which is fine). I personally draw one rectangle for the background (grey) and then draw the other (green) rectangle above it.
ironphoenix20 ironphoenix20

2017/3/25

#
im drawing two rectangles? how? im still not sure how to get a green rectangle and a grey rectangle. i currently only have a green rectangle. let me play with the code a little more.
Super_Hippo Super_Hippo

2017/3/25

#
In lines 126 and 127, you draw two rectangles (in the same color).
ironphoenix20 ironphoenix20

2017/3/25

#
ok. but what do the first two numbers in the fillRectangle parameters indicate? i thought they were coordinates but the rectangles not at (0,0).
ironphoenix20 ironphoenix20

2017/3/25

#
is there a place for me to chat with other greenfoot users because i think that would be easier and faster than commenting back and forth.
danpost danpost

2017/3/25

#
ironphoenix20 wrote...
ok. but what do the first two numbers in the fillRectangle parameters indicate? i thought they were coordinates but the rectangles not at (0,0).
You are filling in two rectangles side by side using the same color. So, you end up with a rectangle twice as big, but of one color. You need to change the color (using 'setColor' on the image) before drawing the second rectangle.
ironphoenix20 ironphoenix20

2017/3/25

#
but how do i actually make the bar change color in real time? right now it just stays a green bar when i run the code.
danpost danpost

2017/3/25

#
ironphoenix20 wrote...
but how do i actually make the bar change color in real time? right now it just stays a green bar when i run the code.
You just need to specify what color you want each rectangle to be. Before line 126, set the drawing color to green and after it set the drawing color to red (or gray):
bar.setColor(myGreen);
// line 126
bar.setColor(myRed);
ironphoenix20 ironphoenix20

2017/3/25

#
yes, i get that but how do i actually test if the bar changes color? and i still dont understand what the first two parameters of the fillRect() method are
There are more replies on the next page.
1
2
3