#Assistance with UI button/icon animation

1 messages · Page 1 of 1 (latest)

inland talon
#

I'm working on an undertale-styled combat segment for a game I'm making. I have the icons moving up and down and become larger when they are selected by the player, but when the player switches options the UI icons snap to their original position for a split second, and I don't know how to fix this.

#

-- Create the ScreenGui
local screenGui = Instance.new("ScreenGui")
screenGui.Parent = game.Players.LocalPlayer:WaitForChild("PlayerGui")
local HideButtons = 0 -- 0 = show, 1 = hide

local selectionIndex = 1
local options = {"FIGHT", "ACT", "ITEM"}
local optionImages = {
    FIGHT = "http://www.roblox.com/asset/?id=133771545169390", -- Replace with actual asset IDs
    ACT = "http://www.roblox.com/asset/?id=71502386035349",
    ITEM = "http://www.roblox.com/asset/?id=72093908802478"
}

-- Create menu UI
local menuFrame = Instance.new("Frame")
menuFrame.Position = UDim2.new(0.5, -100, 0.75, 0) -- Move upwards
menuFrame.Size = UDim2.new(0, 200, 0, 50)
menuFrame.BackgroundTransparency = 1
menuFrame.Parent = screenGui
menuFrame.ZIndex = 2

-- ImageLabels for options
local buttons = {}
for i, option in ipairs(options) do
    local btn = Instance.new("ImageLabel")
    btn.Size = UDim2.new(0, 50, 0, 50)
    btn.Position = UDim2.new((i-1) * 0.4, 0, 0, 0) -- Adjust spacing
    btn.Image = optionImages[option]
    btn.Parent = menuFrame
    table.insert(buttons, btn)
end

local function updateSelection()
    for i, btn in ipairs(buttons) do
        if i == selectionIndex then
            btn.Size = UDim2.new(0, 75, 0, 75) -- Bigger size for selected
            btn.Position = UDim2.new((i-1) * 0.4, -12.5, -0.02, -12.5) -- Center the enlarged icon equally in all directions
        else
            btn.Size = UDim2.new(0, 50, 0, 50) -- Normal size for others
            btn.Position = UDim2.new((i-1) * 0.4, 0, 0, 0) -- Reset position for normal size
        end
    end
end
#
local function animateIcons()
    local direction = 1
    local amplitude = 0.3 -- Increased amplitude for greater range of motion
    local baseFrequency = 1.5 -- Increased frequency for faster animation
    local time = 0
    while true do
        for i, btn in ipairs(buttons) do
            local offset = amplitude * math.sin(time * baseFrequency)
            local dynamicFrequency = baseFrequency * (1 - math.abs(offset) / amplitude)
            btn.Position = UDim2.new(btn.Position.X.Scale, btn.Position.X.Offset, 0.75 + offset, btn.Position.Y.Offset)
        end
        time = time + 0.1
        task.wait(0.2) -- Faster animation
    end
end

UserInputService.InputBegan:Connect(function(input)
    if input.KeyCode == Enum.KeyCode.Right then
        selectionIndex = (selectionIndex % #options) + 1
        updateSelection()
    elseif input.KeyCode == Enum.KeyCode.Left then
        selectionIndex = (selectionIndex - 2) % #options + 1
        updateSelection()
    end
end)

updateSelection() -- Initial selection update
animateIcons() -- Start the icon animation

#

here is my code (I had to put them in two seperate messages cause of character limits)

inland talon
#

Nevermind, I fixed it!!

drowsy needleBOT
#

studio** You are now Level 2! **studio

dusky sinew