When hovering and leaving the button with my mouse, the script indicates the tween should play
The tween does work and changes LightDirection, but does not play the smooth transition
Here is my code:
local button = script.Parent
local tween = game:GetService("TweenService")
local viewport = button:WaitForChild("ViewportFrame")
local MouseEnterTween = tween:Create(viewport, TweenInfo.new(0.2, Enum.EasingStyle.Sine, Enum.EasingDirection.In), {LightDirection = Vector3.new(-1,-1,-1)})
local MouseLeaveTween = tween:Create(viewport, TweenInfo.new(0.2, Enum.EasingStyle.Sine, Enum.EasingDirection.Out), {LightDirection = Vector3.new(1,1,1)})
button.MouseEnter:Connect(function()
MouseEnterTween:Play()
end)
button.MouseLeave:Connect(function()
MouseLeaveTween:Play()
end)
viewport frames update very diffrently depending on the “Render Quality” setting. Try to change the “Render Quality” setting to max and you will probably see the smooth transition. If “Render Quality” is set to Auto or low then viewport frames update very rarely, i think 1 time per second, so your tween becomes pointless.
The issue is that the two tween targets are collinear, so as the tweens are performed, the actual direction of the light remains the same until progress gets past the midpoint, after which it instantly jumps to face the other direction. This won’t happen with non-collinear endpoints, but you’d ideally want to rotate about the origin rather than linearly interpolate between the points.
Here is an example that interpolates the LightDirection between the endpoints you have defined by specifying the idle endpoint via a CFrame, then rotating about that CFrame’s UpVector until it arrives at the active endpoint.
local RunService = game:GetService("RunService")
local TweenService = game:GetService("TweenService")
local button = script.Parent
local tween = game:GetService("TweenService")
local viewport = button:WaitForChild("ViewportFrame")
local IdleDirection = CFrame.lookAlong(
Vector3.zero,
Vector3.new(-1, -1, -1).Unit,
Vector3.new(-1, 1, 1).Unit)
local RotateAngle = -math.pi
local TweenEasingDirection = Enum.EasingDirection.InOut
local TweenDuration = 0.2
local TweenEasingStyle = Enum.EasingStyle.Sine
local TweenProgress = 0
local TweenTarget = 0
local TweenConnection: RBXScriptConnection?
local function UpdateLightDirection(Delta: number): ()
local Direction = math.sign(TweenTarget - TweenProgress)
TweenProgress = math.clamp(TweenProgress + (Delta / TweenDuration) * Direction, 0, 1)
local Angle = RotateAngle * TweenService:GetValue(TweenProgress, TweenEasingStyle, TweenEasingDirection)
viewport.LightDirection = (IdleDirection * CFrame.Angles(0, Angle, 0)).LookVector
if TweenProgress == TweenTarget and
TweenConnection then
TweenConnection:Disconnect()
TweenConnection = nil
end
end
local function PerformTween(): ()
if TweenProgress ~= TweenTarget and
not TweenConnection then
TweenConnection = RunService.RenderStepped:Connect(UpdateLightDirection)
end
end
button.MouseEnter:Connect(function()
TweenTarget = 1
PerformTween()
end)
button.MouseLeave:Connect(function()
TweenTarget = 0
PerformTween()
end)