# Problem with progress bar image

**URL:** <https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620>\
**Category:** UI\
**Tags:** image, progress-bar, unreal-engine, Widget, question\
**Created:** [December 31, 2020, 7:46pm UTC](https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620 "2020-12-31T19:46:34Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Soleniah](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Soleniah](https://forums.unrealengine.com/u/Soleniah)\
**Post date:** [December 31, 2020, 7:46pm UTC](https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620/1 "2020-12-31T19:46:34Z")

</div>

Hello there. I 've got an image which is importing good . In my widget blueprint as an image is good, but I want it as a progress bar and it 's like square-getting cropped. Any ideas about this issue?  
(Up is image, down is progress bar)

 ![326021-download-1.png](https://d3kjluh73b9h9o.cloudfront.net/original/4X/b/7/2/b72594b92d7a5f535cebd1608e18fa19f5a6ad33.png)

---

<div class="post-metadata">

**Author:** ![ClockworkOcean](https://d1ap1mz92jnks1.cloudfront.net/user_avatar/forums.unrealengine.com/clockworkocean/32/1169999_2.png) [@ClockworkOcean](https://forums.unrealengine.com/u/ClockworkOcean)\
**Post date:** [January 1, 2021, 11:28am UTC](https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620/2 "2021-01-01T11:28:53Z")

</div>

You can’t just give it a picture of a gun. I’m assuming you want the muzzle to get longer when the heath increases? The progress bar needs to be made from a square image that looks like the end of the muzzle.

This vid gives you some idea. There’s no explanation, but you can see he has materials set up to draw the end of the bar:

[![](https://d3kjluh73b9h9o.cloudfront.net/original/4X/9/0/e/90e23bcc1f5148e334a10c42bb86d94609507c65.jpeg "SDF Robo Progress Bars - UMG Tutorial") ](https://www.youtube.com/watch?v=1ZVBnIpnGvc)

---

<div class="post-metadata">

**Author:** ![Soleniah](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Soleniah](https://forums.unrealengine.com/u/Soleniah)\
**Post date:** [January 2, 2021, 2:24pm UTC](https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620/3 "2021-01-02T14:24:09Z")

</div>

Thanks for your answer. I 'll look into it

---

<div class="post-metadata">

**Author:** ![Codingrocks3](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Codingrocks3](https://forums.unrealengine.com/u/Codingrocks3)\
**Post date:** [October 22, 2023, 9:10pm UTC](https://forums.unrealengine.com/t/problem-with-progress-bar-image/476620/4 "2023-10-22T21:10:12Z")

</div>

For anybody who wants to know, setting the Draw As to Image does the trick.