[SOLVED] Spinning UI Stroke Animation

[Youf_Dev]

Hellow Fellow Developers!

I’ve been trying to achieve a UI animation where the outline of a button/frame spins around it. Here is a little video for better understanding:

Credits to @plasma_node for the video found here

I have absolutely no idea how i would manage to do this and would like to learn more about it. I’m not asking for scripts, but rather a little help to get started. I thought about using UIGradient on a UIStroke, but the result is pretty disappointing. Any help would be appreciated.

Thanks in advance!

[BillB1ox (Will)]

This doesn’t look like UIGradent or UIStroke at all. What you got to do is make a Frame get created and change the size and position of it then delay it.

This is too complicated for me to write on a single turn unfortunately.

[i_darkest (darkest)]

You insert a UIGradient inside a UIStroke, what you do afterwards is script a loop that changes the ‘Rotation’ property on the UIGradient.

You have to position your UIGradient ‘Transparency’ property in a way where a chunk of it in the middle is invisible, while the edges are visible. You can edit the NumberSequence to something like this:

This is the effect I got after putting it in a regular ‘Frame’:

[Youf_Dev]

This is exactly what i needed. I appreciate your time and help

[plasma_node]

This is correct, however as shown in my video it is not a perfect solution for non-square objects

[Youf_Dev]

Could you provide more information of how you achieved that effect on non-square objects, if that doesn’t bother you?

[plasma_node]

It’s been ages so I can’t really remember but it’s the same process, just a rectangle. However due to having short and long sides, it will move faster on the long side and shorter on slow side. Some clever code could fix it though c

[plasma_node]

Hold up, I was actually wrong. The rectangle was manually created tweening the position and size of lines (small frames) around the rectangle

[Youf_Dev]

I appreciate the information. it clearly is better to use this method when applying to rectangular UI objects. As for square objects, the UIGradient and UIStroke method is the best option. Thanks again!