# HP/Mana Bar with UMG & C++

**URL:** <https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091>\
**Category:** UI\
**Tags:** hud, unreal-engine, UI, CPP, question, UMG\
**Created:** [May 19, 2015, 8:54am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091 "2015-05-19T08:54:51Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sleicreider](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Sleicreider](https://forums.unrealengine.com/u/Sleicreider)\
**Post date:** [May 19, 2015, 8:54am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/1 "2015-05-19T08:54:51Z")

</div>

Hey,

I want to create a simple mana & hp bar for my character. I know how to do it with HUD/Canvas, but I think UMG is better for UI things right?

My Problem now is, I have no idea how to use UMG. Beside the design oft the mana/hp bar i want to do everything in c++, (progress etc.).

Until now I’ve seen that there is something called a Widget Blueprint, where I can drag & drop a Progress bar and this has to be added to the Viewport, but how do i get this Widget Blueprint from C++ to add it to the viewport?  
I’ve tried using the ConstructorHelpers and get it by it’s path, but somehow it doesn’t work.

Can anyone help or has an better solution to create such an UI?

---

<div class="post-metadata">

**Author:** ![anonymous\_user\_8e2766aa](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_8e2766aa](https://forums.unrealengine.com/u/anonymous_user_8e2766aa)\
**Post date:** [May 19, 2015, 9:59am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/2 "2015-05-19T09:59:22Z")

</div>

Hello,

You can create Health bar using Slate UI Framework in C++ (SCompoundWidget class in particular).

Slate is a custom and platform independent user interface framework that is designed for effective creation of user interfaces for games and custom tools.  
If you like to learn more about Slate, please go here:

> **[Slate Overview](https://docs.unrealengine.com/5.1/en-US/slate-overview-for-unreal-engine/)**
>
> Overview of the cross-platform Slate UI framework.

For an example of health bar implementation, please go here:

> **[How to do simple Health bar using Slate in C++](https://forums.unrealengine.com/showthread.php?15108-How-to-do-simple-Health-bar-using-Slate-in-C)**
>
> Hi, How can I do a Health bar using Slate in C++? I have checked both ShooterGame and StrategyGame, and they use FCanvasTileItem. But I need it to be in Slate because Canvas is rendered behind the Slate widgets I already have, and I need the health...

In addition, if you like to learn more about buttons creation and drawing in HUD, please go here:

> **[A new, community-hosted Unreal Engine Wiki](https://forums.unrealengine.com/t/a-new-community-hosted-unreal-engine-wiki/141494)**
>
> After over a year in maintenance mode, the official Unreal Engine Wiki is now permanently offline. These resources now live on a new community-run Unreal Engine Community Wiki — https://unrealcommunity.wiki/! You will be able to find content from...

Hope this helped!

Have a great day!

---

<div class="post-metadata">

**Author:** ![Sleicreider](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Sleicreider](https://forums.unrealengine.com/u/Sleicreider)\
**Post date:** [May 19, 2015, 10:08am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/3 "2015-05-19T10:08:58Z")

</div>

I already know the second link, with canvas and code its easy to create such a bar, but isn’t UMG better or more preferred for such things?

---

<div class="post-metadata">

**Author:** ![anonymous\_user\_8e2766aa](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_8e2766aa](https://forums.unrealengine.com/u/anonymous_user_8e2766aa)\
**Post date:** [May 19, 2015, 10:57am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/4 "2015-05-19T10:57:00Z")

</div>

UMG is easier to use and has the same functionality as Slate, but in some cases you may need to use Slate since it provides more possibilities for customization.

---

<div class="post-metadata">

**Author:** ![Sleicreider](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Sleicreider](https://forums.unrealengine.com/u/Sleicreider)\
**Post date:** [May 19, 2015, 11:05am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/5 "2015-05-19T11:05:32Z")

</div>

and what about using canvas?

---

<div class="post-metadata">

**Author:** ![anonymous\_user\_8e2766aa](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_8e2766aa](https://forums.unrealengine.com/u/anonymous_user_8e2766aa)\
**Post date:** [May 19, 2015, 11:23am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/6 "2015-05-19T11:23:02Z")

</div>

Canvas is convenient for intermediate stages of development, when you need to implement some approximate test functionality. However, for a final version UMG is more appropriate.

---

<div class="post-metadata">

**Author:** ![Sleicreider](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Sleicreider](https://forums.unrealengine.com/u/Sleicreider)\
**Post date:** [May 19, 2015, 11:24am UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/7 "2015-05-19T11:24:57Z")

</div>

ok thank you for the answer 🙂

---

<div class="post-metadata">

**Author:** ![anonymous\_user\_8e2766aa](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_8e2766aa](https://forums.unrealengine.com/u/anonymous_user_8e2766aa)\
**Post date:** [May 19, 2015, 12:22pm UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/8 "2015-05-19T12:22:17Z")

</div>

You are welcome! Good luck!

---

<div class="post-metadata">

**Author:** ![kitblackheart\_1](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@kitblackheart\_1](https://forums.unrealengine.com/u/kitblackheart_1)\
**Post date:** [May 19, 2015, 2:36pm UTC](https://forums.unrealengine.com/t/hp-mana-bar-with-umg-c/319091/9 "2015-05-19T14:36:54Z")

</div>

UMG is just a more friendly way to implement SLATE Sleicreider, its like using umg but with code, umg was made for designers to be able to make UIs without having to know or use code.

\*However Slate has more possibilities in creation, since it uses code and so you can pretty much do whatever you wish, while umg is more limited.
