Hey! I was wondering how to achieve effects like this:
I understand this will use TweenService, but which property of the image do I need to tween?
Thanks!
3 Likes
You would be tweening the Position property of an image based on its TileSize. Grab an image you want to tile, figure out its pixel dimensions. One I’ve made used a 52x52 icon, so I’ll use 52 as an example:
Set the images’ texture to what you want to tile. Set its ScaleType to “Tile” with its TileSize property to {0, 52, 0, 52}.
Set the images’ Size to {1, 52, 1, 52}. This will make it as big as its parents’ frame and 52 pixels larger, which will be necessary. Set the ImageLabel’s Parent’s ClipDescendants to true, so those other 52 pixels are cut off for now.
Now we need to create the effect by tweening the images’ Position to move with an offset of 0 to 52.
Create a LocalScript somewhere, I had it parented to the ImageLabel for example. Create a tween for the ImageLabel wherein you want to change the Position property to UDim2.new(0, -52, 0, -52) (again for my example, values may differ for yours, my offset was negative for the direction I wanted it to move)
Here’s the code described:
local img = script.Parent
local TweenService = game:GetService("TweenService")
TweenService:Create(img, TweenInfo.new(1, Enum.EasingStyle.Linear, Enum.EasingDirection.InOut, -1), {Position = UDim2.new(0, -52, 0, -52)}):Play()
My heirarchy was this script, parented to the ImageLabel, parented to a Frame, parented to ScreenGui. If you want to see it yourself I can upload the .rbxm of what I described, let me know.
23 Likes
I don’t know if I’m stupid, but this doesn’t seem to be working as intended. ._.
how can i make it tween to the other side? mine currently tweens to the left