Ursina UI Bars Growing Both Ways? Set origin to Anchor Health, Ammo, or Cooldown Bars to One Side

Fix Ursina progress bars that scale in both directions. Learn how origin and anchoring work to make health, ammo, or cooldown bars fill from one side.

Scaling a health, ammo, or cooldown bar in Ursina sounds trivial until it starts growing in both directions at once. If your progress bar expands left and right when you change its scale, the culprit is almost always the same: the object’s origin sits in the center.

Problem overview

You want a bar that reflects a changing value such as bullet regeneration time. The idea is to update the bar’s scale on the x-axis as the timer advances. However, instead of filling from one side, the bar expands symmetrically, which makes the UI look broken.

Minimal example that reproduces the issue

The logic below updates a bar’s width based on a timer. Names are illustrative, but the behavior mirrors the original scenario exactly.

if can_shoot == False and cooldown >= 0.5:
    can_shoot = True
    cooldown = 0

elif can_shoot == True and cooldown >= 0.5:
    cooldown = 0

if can_shoot == True:
    regen_bar.scale_x = 12

if can_shoot == False:
    regen_bar.scale_x = cooldown * 24

Player = Avatar()
regen_bar = Entity(model="quad", position=(-13, -9, -2), scale=(12, 0.5, 1), color="FFFF00")

Here, a boolean flag determines whether shooting is allowed, and a timer gates shooting. The bar’s length is driven by the timer value and reset when ready.

Why the bar grows in two directions

In Ursina, entities use an origin point to decide where scaling pivots. By default, origin=(0, 0, 0), which corresponds to the center of the object. When you scale an object around its center, it grows equally to the left and right. That is why your bar stretches in both directions instead of filling in one direction.

Setting a different origin changes the pivot point. If you place the origin on the left edge, the bar will remain anchored on the left and extend to the right when its scale increases. Similarly, an origin on the right edge makes the bar expand to the left.

Fix: set the origin to a side

Align the bar’s origin with the side you want to keep fixed. Using origin=(-.5, 0, 0) keeps the left side anchored and scales the bar to the right. Using origin=(.5, 0, 0) keeps the right side anchored and scales the bar to the left.

if can_shoot == False and cooldown >= 0.5:
    can_shoot = True
    cooldown = 0

elif can_shoot == True and cooldown >= 0.5:
    cooldown = 0

if can_shoot == True:
    regen_bar.scale_x = 12

if can_shoot == False:
    regen_bar.scale_x = cooldown * 24

Player = Avatar()
regen_bar = Entity(
    model="quad",
    position=(-13, -9, -2),
    scale=(12, 0.5, 1),
    origin=(-.5, 0, 0),  # anchor on the left, grow to the right
    color="FFFF00"
)

Depending on your layout, you may also want to adjust the position.x after changing the origin to keep the bar visually aligned with other UI elements.

Why this matters

UI bars, timers, and progress indicators rely on predictable anchoring. When the origin is centered, scaling mirrors to both sides and breaks the mental model of a bar “filling” from one end. Understanding how origin behaves prevents confusion when building HUD elements and makes it straightforward to position and animate UI consistently.

Takeaways

When a bar scales in two directions in Ursina, the default origin at the center is the reason. Set origin to the left or right edge to keep one side fixed and achieve one-directional growth. If the new pivot shifts visual alignment, tweak the position accordingly. With that, your cooldown, health, or ammo bars will fill exactly the way you intend.