I'm having trouble making a (vertex) shader that scales UI images from the center.

I can scale the image, but the image doesn't stay centered.

Here is a project showing the problem

Here is a direct link to the shader I'm working on

How can I make it scale from the center?

See how the basketballs do not stay centered in their original rects in the below image

See how the basketballs do not stay centered in their original rects Here is some extra info

  • \$\begingroup\$ Can you explain why you need to do this in a shader, rather than simply scaling the UI Image GameObject itself via its RectTransform? \$\endgroup\$ – DMGregory Mar 22 '19 at 18:41
  • \$\begingroup\$ Of course. forum.unity.com/threads/… \$\endgroup\$ – Tread Mar 22 '19 at 20:10
  • \$\begingroup\$ Applying a fractional scale to a UI sprite is not recommended, as it leads to a slight blurring from bilinear filtering. Would you be open to solutions to get the size you want (without mipmapping artifacts) where those solutions do not involve scaling in the shader? If so, I'd recommend editing your post to talk about the root problem you're trying to solve, rather than your attempted solution. \$\endgroup\$ – DMGregory Mar 22 '19 at 20:19
  • \$\begingroup\$ I noticed the slight blurring, and was choosing that over the "smudged" edges caused by mipmaps. Maybe I should make a more fundamental post, though. As for fractional scaling, doesn't something like this already happen when sprites are rendered in general? \$\endgroup\$ – Tread Mar 22 '19 at 20:22
  • \$\begingroup\$ There's no reason you should have to accept either of these artifacts if you're displaying your asset at a fixed known resolution. \$\endgroup\$ – DMGregory Mar 22 '19 at 20:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.