Help with Animated health bar (percentage based)

Welcome to our brand new Clickteam Community Hub! We hope you will enjoy using the new features, which we will be further expanding in the coming months.

A few features including Passport are unavailable initially whilst we monitor stability of the new platform, we hope to bring these online very soon. Small issues will crop up following the import from our old system, including some message formatting, translation accuracy and other things.

Thank you for your patience whilst we've worked on this and we look forward to more exciting community developments soon!

Clickteam.

    Hey, I'm having some issues with creating an animated health bar.
    Basically what I want to create is a health bar with an undefined amount of lives, like a 'Horizontal bar' or 'Vertical bar' counter. A bar that shows your percentage of health.
    However, I want this health bar to have an animation that plays constantly. It's easier to explain with an illustration so here's an example to show what I mean.

    Please login to see this picture.

    The full health bar has an animation of 6 frames.
    The empty health bar has an animation of 6 frames as well.
    The full health bar should become invisible the more health you lose, from top to bottom.
    This way, a player who has for example 78 max health and a player who has 193 max health can both use the same health bar and still see exactly how much percent health they have left.

    Right now I'm using an Active Object for the frames of the empty health bar, so I actually just need a way to make an animated object that gradually disappears from top to bottom based on the percentage of a counter's current value to its max value. But how can I do this?

    Edited 5 times, last by Adnihil (November 6, 2016 at 6:18 AM).

    It's a bit challenging, since you need an object that can be resized in Y without scaling the image, cropping it instead.

    The Active and Background System Boxes can do this (might be Developer only, can't remember! But looks like you have the Developer version of Fusion 2.5 so should be OK)

    I've done a quick example for you using your images.
    Unfortunately, since they don'y have animations, I've had to us 6 of them and cycle their position so only one is on screen at any one time.
    They form the Empty bar and I use a normal animated Active for the health bar itself.

    Just enter new values for the Current and Max health in the edit boxes.

    Hope it helps!

    Wait, so setting the Background System Box dimensions to something smaller than its starting dimensions cuts off the image? Neat trick. I really hope F3 has a simpler way to apply alpha channels or shapes as "masks" to do things like this.

    Please login to see this link.

    Adnihil & mobichan - You're welcome!

    mobichan - Yep, same goes for the Active System Box too (I just didn't need the button behaviour that Active System Boxes have). Unfortunately it only works from Top Left, which is why it's the Empty part of the health bar that's a System Box.

    You could also display text for the health percentage just above the fill level by setting the text of the System Boxes to the percentage value.

    Yes, it would be nice for Actives to have this feature as well as:
    1. Pattern/tiling of System Box
    2. Offsetting of Active Picture (so you can scroll patterns/tiles)
    3. Flipping of Active Picture (horizontally and vertically so no need to duplicate characters for platform/fighting/etc games)
    4. Change Hot Spot position like Active Picture
    5. Load frames across all exporters (not just windows exe)

    Kevin Ayre Please login to see this link.
    My iOS Apps: Please login to see this link., Please login to see this link. and Please login to see this link.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!

Register Yourself Login