Jump to content

Photo

Custom Tile-Based HP Meter


  • Please log in to reply
6 replies to this topic

#1 kurt91

kurt91

    Follower of Destiny

  • Members
  • Real Name:Kurtis
  • Location:Eastern Washington University

Posted 22 November 2015 - 02:38 AM

I'm trying to figure out how I would script a custom HP meter in my quest. Right now, I have actual counters like in an RPG, but I've found that using actual meters are both easier to see at a quick glance rather than having to do the mental math on how many hits you can take depending on how much HP you have, and take up less room. Since I currently have a bit of a cramped Subscreen, this will help tidy things up and hopefully give me enough room for something else I want to make.

 

I always liked the shape of the health bars in Kingdom Hearts, and I want to do something similar. I figure this means that I'd want to do a tile-based approach rather than just DrawRectangle with a frame around it. (Also because I already have the tile graphics from when I wanted to try and do this without scripting. I've never done anything like this before, but a quick look through the database gave me this script that I'm basing mine off of: http://www.purezc.ne...=scripts&id=112

 

I've gotten a bit confused while reverse-engineering this, and wanted a bit of help. So far, I think I've gotten a good amount of this figured out, having put together the part that determines which graphic to draw depending on current health. I've got two things that I don't understand. First of all, what part of this script determines how many tiles need to be drawn? All I have right now would draw a single tile, limiting Link to 16 HP. Needless to say, the player's going to need more than a single Heart to get through the whole quest.

 

Second, like I said, I'm putting in a Kingdom Hearts-style curve to the HP meter. (For those who've never played the game, it's three quarters of a circle before extending straight outwards like a normal meter) This means that the first three tiles of the meter need to be unique, and the fourth tile being what's copied for the rest of the meter. How would I add this detail to the script?

 

Before I forget, this is what I've figured out so far...

 

int DrawHP = Link->HP; //Amount of Health to draw
        int TileHP = 16 //Each tile represents 16 HP
        
        
        While(Link->HP >= 0){
            DrawHP = Link->HP; //Reset DrawHP
            int TileToDraw = OriginalTile;
            int TileChooser = DrawHP/TileHP; //Determine graphic based on current HP
            
            //Determine Which Tile To Draw
            if(TileChooser >= 1){
                TileToDraw = OriginalTile;
            }
            else if(TileChooser > 0.9375){
                TileToDraw = OriginalTile + 1;
            )
            else if(TileChooser > 0.875){
                TileToDraw = OriginalTile + 2;
            )
            else if(TileChooser > 0.8125){
                   TileToDraw = OriginalTile + 3;
            )
            else if(TileChooser > 0.75){
                   TileToDraw = OriginalTile + 4;
            )
            else if(TileChooser > 0.6875){
                   TileToDraw = OriginalTile + 5;
            )
            else if(TileChooser > 0.625){
                   TileToDraw = OriginalTile + 6;
            )
            else if(TileChooser > 0.5625){
                   TileToDraw = OriginalTile + 7;
            )
            else if(TileChooser > 0.5){
                   TileToDraw = OriginalTile + 8;
            )
            else if(TileChooser > 0.4375){
                   TileToDraw = OriginalTile + 9;
            )
            else if(TileChooser > 0.375){
                   TileToDraw = OriginalTile + 10;
            )
            else if(TileChooser > 0.3125){
                TileToDraw = OriginalTile + 11;
            )
            else if(TileChooser > 0.25){
                TileToDraw = OriginalTile + 12;
            )
            else if(TileChooser > 0.1875){
                   TileToDraw = OriginalTile + 13;
            )
            else if(TileChooser > 0.125){
                TileToDraw = OriginalTile + 14;
            )
            else if(TileChooser > 0.0625){
                TileToDraw = OriginalTile + 15;
            }
            else TileToDraw = OriginalTile + 16;


#2 Lejes

Lejes

    Seeker of Runes

  • Members
  • Location:Flying High Above Monsteropolis

Posted 22 November 2015 - 03:27 AM

You're going to have to explain the parameters of this life bar some more. What fraction of total health do the three quarters of a circle represent, as compared with the bar? And does getting more hearts/max HP change the bar's appearance? I think you would check this in stages.

if (Link->HP >= Link->MaxHP * 0.75 && Link->HP < Link->MaxHP)
{
     tile_circle = EMPTY_CIRCLE + (Link->HP % 16);
}
//draw three quarter circle with tile_circle here

Basically do a check like this for every segment this life bar has. If Link's HP falls below the threshold, the tile would automatically be the empty tile, and automatically the full tile if Link is above the threshold. As long as you set up the tiles in order, you won't need a long chain of if else statements, since you can do the tile offset more concisely with modulo.



#3 grayswandir

grayswandir

    semi-genius

  • Members

Posted 22 November 2015 - 03:47 AM

Here's a quick modification of what I'm using, if you want another point of comparison. I haven't tested it, but the original script I based it off of works fine.

Spoiler

*checks above post* Or you can use modulo, yeah.

 

So, for instance, if you wanted to modify this to draw the special pieces, there's two ways that jump out at me. First, you'd have the for loop start at i = 3, and draw the other hearts before it manually. Or, you could have an if (0 == i) ... set of if statements for the actual draw line, messing with the coordinates and tile used.

 

 

The code you posted isn't really looping properly. Also, it looks like it might've gotten cut off?

 



#4 Alucard648

Alucard648

    Magus

  • Members
  • Location:castle Dracula

Posted 22 November 2015 - 03:51 AM

Just seen the concept of health meter in YouTube video. As far, as I can tell, there is no function to draw partial circle wedges in ZScript, so it`s not possible to draw meters, like explained without crazy workarounds, like setting up huge line of tiles.



#5 kurt91

kurt91

    Follower of Destiny

  • Members
  • Real Name:Kurtis
  • Location:Eastern Washington University

Posted 22 November 2015 - 04:40 AM

I'm sorry, I guess I wasn't very specific in what I was doing. I started writing the post as a way to help keep my thinking straight as I was working on it, and then probably removed too much information to change it into an actual question.

 

I'm basically trying to use a Kingdom Hearts health bar for my quest, mainly because I like the look.

attachment.php?attachmentid=69861&d=1166

In Kingdom Hearts, at the beginning of the game, the life meter (green) would be slightly less than a quarter-circle. As the player gained more max HP, it would wrap around the portrait until it wrapped beneath, and then grow in a straight line to the left until it hit the HP cap.

 

I went through and split the health bar into tiles, assuming that I could do 16x16 segments normally in ZQuest. Each quarter-circle of the green meter is split into 16 tiles, with each tile representing 1 HP, just like a normal life meter piece. There are four unique graphics. Three are the quarter-circle tiles, and the fourth is a straight tile that would be repeated for the rest of the health bar. Like I said, each one of these is made up of 16 "animation frames" to match up with normal life meter pieces.

 

I was using the script I found as a starting point, figuring I only needed to figure out how to set it up to track Link's HP instead of an enemy's, and since it would be on the subscreen, just hard-code the locations for the tiles into place, since they wouldn't ever move. So yeah, I figured this could be done since I had already done the "crazy workaround" number of tiles.

 

Life%20Meter%20GFX_zpsjossxrby.png

The Tile Page I'm using for my Life Meter graphics

 

The code that I posted earlier is indeed cut-off. It's not finished, so it's not tucked inside a full loop with a Waitframe() in it and everything. I'm in the middle of putting it together and I don't think it would even compile as is, even inside a proper loop. I wanted to ask how I would do the next part.

 

So, a quick recap. I have the graphics for what is essentially a group of 16x16 Life Meter Pieces. Other than size, they should be identical in function to the normal ones. (16 frames for each HP increment possible per-heart) The first three "Life Meter Pieces" have unique graphics (quarter-circle pieces), and the fourth just looks like a straight line. If I arrange them properly, they should be able to make the desired shape. I'm using the Boss Meter script to try and figure out how to script a tile-based Life Meter like I want.

 

Under this method, how do I get more than one piece in place and line up with larger Life totals? (If a tile represents up to 16 HP, how do I tell it that the second tile represents 17-32 HP instead of 0-16?) Also, since the original script only needed a single graphic with four "animation frames" to create the life bar, while I need four graphics with 16 "animation frames" to create mine, how do I get it so that my life bar uses the different graphics for the first set of pieces?

 

Am I any clearer now?


Edited by kurt91, 22 November 2015 - 04:42 AM.


#6 Lejes

Lejes

    Seeker of Runes

  • Members
  • Location:Flying High Above Monsteropolis

Posted 22 November 2015 - 05:05 AM

Ah, so it's based on absolute HP amount. I'm not sure the boss HP meter script is a great starting point, then. The first three tiles, at least, would need their own if statements rather than getting drawn in sequence by a loop.
 
if (Link->HP < 16)
{
     first_quarter = TILE_FIRSTQUARTER + (Link->HP % 16);
}
else
{
     first_quarter = TILE_FIRSTQUARTER + 16;
}
//draw first quarter with first_quarter tile here

if (Link->MaxHP > 16)
{
     if (Link->HP < 32)
     {
          second_quarter = TILE_SECONDQUARTER + (Link->HP % 16);
     }
     else
     {
          second_quarter = TILE_SECONDQUARTER + 16;
     }
     //draw second quarter with second_quarter tile here
}
 
The straight bars could be handled similarly, but since they all have the same series of tiles, you could save on lines of code and draw them all with a for loop. This should be simpler than the boss HP thing, because you're adding a new tile to draw for every 16 HP Link has.

#7 kurt91

kurt91

    Follower of Destiny

  • Members
  • Real Name:Kurtis
  • Location:Eastern Washington University

Posted 22 November 2015 - 05:37 AM

I swear, one of these days I'm going to actually remember what "modulo" means instead of having to look it up every time I see the word.

 

Anyways, that looks pretty simple to do. I think I should be able to finish this. Thanks!




1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users