UI Gradient Interaction

[CoIorEvent]

1. What do you want to achieve? I am trying to make my interaction UI look a little better when interacting. Right now I have it moving from the bottom to the top, but I want it to go around the entire square, starting in the top left and going to the top right, then going to the top right to the bottom right, etc. (See attached pictures)

2. What is the issue? Normally I could probably just get away with using 4 rectangles on each side, but I don’t think I will be able to do that because this has a UI Gradient which adds to how the UI looks.

3. What solutions have you tried so far? So far I’ve tried rectangles on each side, but that would prevent me from being able to use a UI Gradients, and might not be the best way.

Here’s what my current animation looks like: https://gyazo.com/73501d04bf844480f56ee6c58333099f

Here’s what I want:
https://gyazo.com/51c8c35f9d533839888ec0795289098e
https://gyazo.com/67c5c16b9611ba101e0ad0b2b1fac9ed (Pretty much this, but for a square).

I’m thinking that I might be able to do what the ProximityPrompt does which is 2 frames with UIGradients, as that won’t ruin the style of the UI, but I do not know how to accomplish this.

If you don’t know I can probably try and look at how the Proximity Prompt does it and go from there, although your help is appreciated!

[CoIorEvent]

I was able to copy the ProximityPrompt UI and change the ImageLabel into a square. Now it works perfectly as expected, and still allows for the bottom-top gradient.