UMG UI: Draw current weapon information

WeaponInfoScreen

In this post I will focus on creating another UMG widget which will:

  • Let me know how much ammo do I have in mag and backpack,
  • Let me know when I’m reloading weapon,
  • Will be implemented as UMG pipeline was created,

In last post I’ve showed how to use events to drive data to UMG, this time I will use UMG bindings to drive data to widgets. It’s less optimised because when binding to functions they will tick all the time but it’s great UMG feature which you should definitely use!


Creating widget.

Create new Widget Blueprint named HUD_WeaponInfo and open it. Try to recreate my hierarchy:

Now in Graph add those variables:

  • CurrentWeaponRef (BP_BaseWeapon actor),
  • isReloading (bool),

Go back to designer and select your TextBlock_AmmoInMag. Create new binding.

bindtofunction

By default function will have name like GetText_0 or something. Rename it to GetText_AmmoInMag. Here’s the function:

gettextammoinmag

Create binding for TextBlock_CurrentAmmo named  GetText_AmmoInBackpack:

gettextammoinbackpack

Create last binding for TextBlock_Reloading named GetText_IsReloading:

gettextisreloading

Basically you can bind almost everything in UMG. This feature is really powerful if you have references for your data.

Now in Event Graph create those functions:

  • SetIsReloading (input bool: newreloading),
    setisreloading
  • SetWeaponRef (input BP_BaseWeapon actor: Current Weapon),
    setweaponref

On event construct we need to play Reloading Animation.

construct

And that’s all for the Widget!


Attaching widget to Character

Open GameplayCharacter and add Widget Component named HUD_WeaponInfo . It should be attached to Camera->FPPMesh->SpringArm as in earlier post. Here’s the widget properties:

  • Location: (X=-12.177326,Y=11.173154,Z=5.743647)
  • Rotation: (Pitch=0.000068,Yaw=89.999947,Roll=89.999947)
  • Scale: (X=0.034050,Y=0.034050,Z=0.034050)
  • WidgetClass: HUD_WeaponInfo,
  • DrawSize: 300 / 100,
  • Collision Presets: No Collision,

Now we need to set CurrentWeaponRef in this widget and update isReloading.


Updating widget

SpawnWeaponsAndAssignToSlots function:

In the end of this function – you can use sequence let’s set current weapon in widget.

SpawnWeaponsAndAssignToSlots

Create new Custom Widget named UpdateHUDWeaponInfo:

updatehudweaponinfo

So we will have one event to update the hud and it will be called from other places.

In Reload Event – after changing GameplayCharacter isReloading bool.

reload_updatehud

In EquipWeapon event:

equipweapon_updatehud

It would be much easier if we will store isReloading in BP_MainWeapon but it will be too much change for me at this point.

Final Effect

One thought on “UMG UI: Draw current weapon information

  1. How do we get the extra ammo to go into the next mag? For example, say I have 10 rounds in a mag, and I only fire off 2 and decide to reload, how to I get those unused bullets added into the max ammo in backpack?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.