Widget Component Misalignment in RTS UI

Author: Keon Fryson

During this week of development on our RTS project, I ran into an issue where the Widget Component (which displays unit health bars) was not appearing directly above the unit mesh as intended. Instead, it was offset to the side, making it hard for players to tell which health bar belonged to which unit. This misalignment could cause confusion during gameplay, especially in large battles where visual clarity is essential. It was critical to address this to ensure players can quickly read unit health at a glance without having to guess or squint.

After investigating the problem, I discovered that the Widget Component's relative location was incorrectly set in C++. It was positioned along the X axis (to the side of the unit) rather than along the Z axis (above the unit). Additionally, the pivot point of the widget wasn’t centered properly, causing further visual offset.

To fix this, I updated the component initialization in the actor constructor to set the widget’s relative location to something like FVector(0.f, 0.f, 150.f), which places it above the unit. I also adjusted the widget pivot to FVector2D(0.5f, 0.f) so it aligns correctly over the unit’s head. Finally, I confirmed the widget space was set to World and that the rotation faced the player’s camera. These changes resulted in clean, properly aligned health bars that follow their units smoothly. This will improve player experience by making unit status easy to track during gameplay.

Broken

Fixed