Xanimator
"Why does roblox only give us like linear fades with the :Play() function?" - Frayxen
What is Xanimator?
Xanimator is a component that allows you to tween the animation weight of AnimationTracks, this can be used to transition between 2 animations smoothly, allowing you to create more human looking transitions.
Xanimator works by Queueing up the transitions and then stepping them using math.lerp() and TweenService:GetValue().
Here is a video for demonstration:
(Music made by Kuko)
There is more to come but as of now this is all it does.
Why I made this
Over the years while developing projects within the Roblox engine I always struggled working with animations due to the fact they are extremely limited, but mainly the transition part, it’s always linear and this absolutely ruined combat feel for my games and animating every transition by hand is simply inefficient.
Inspired by this post:
Nonlinear transitions between animations - Feature Requests / Engine Features - Developer Forum | Roblox
I had an idea, and after building a prototype proving it was possible I was able to create Xanimator.
How to use
Install the module and drag it into your place of choice, then require it.
local Xanimator = require(path)
Start by creating a new Xanimator component for your existing rig by passing it’s Animator.
local Rig = path
local animator = Xanimator.new(Rig.AnimationController.Animator)
Now load your animations
local Animations = path
local Idle = animator:Load("Idle", Animations.Idle)
local Walk = animator:Load("Walk", Animations.Walk)
Let’s set up the update cycle.
local RunService = game:GetService("RunService")
RunService.PreAnimation:Connect(function(deltaTime: number)
animator:Update(deltaTime)
end)
Awesome now let’s play them and transition between them
-- Start weight at 1
Idle:SetWeight(1)
Idle:Play()
-- Start weight at 0
Walk:SetWeight(0)
Walk:Play()
-- Transition between them
Walk:Blend(1, 1, Enum.EasingStyle.Sine, Enum.EasingDirection.Out)
Idle:Blend(0, 1, Enum.EasingStyle.Sine, Enum.EasingDirection.Out)
If you would like to see it in action there is an example place provided:
Methods
There are 2 components.Xanimator
:Load(name: string, animation: Animation)
Loads animation.
Returns Anim component.
:Remove(name: string)
Removes and destroys animation.
:Update(deltaTime: number)
Updates component, use RunService.PreAnimation to step.
:Destroy()
Destroys Xanimator component.
Anim
:Blend(targetWeight: number, duration: number, style: Enum.EasingStyle, direction: Enum.EasingDirection)
:SetSpeed(speed: number)
:SetWeight(weight: number)
:Play(fadeOutTime: number, fadeOutStyle: Enum.EasingStyle, fadeOutDirection)
:Pause()
:Resume()
:Reverse()
:Stop(fadeOutTime: number, fadeOutStyle: Enum.EasingStyle, fadeOutDirection, speed : number)
Things to note
- Easing styles such as back and elastic do not work since they overshoot.
AdjustWeight()only works on values from [1, 0]. - This resource still has more features to come such as animatin groups to save and manage animation priorities efficiently.
- There might still be some bugs and memory leaks, if you find them report them to me and I will try and fix them as soon as possible.
What did you think
- I will be using this!
- I like this.
- It just needs some improvements.
Credits
Download
Xanimator V3.1.0.rbxm (7.5 KB)
Previous versions
Xanimator V3.0.0.rbxm (8.1 KB)
Xanimator V.2.1.rbxm (6.9 KB)
Xanimator V2.2.0.rbxm (6.8 KB)
Xanimator V2.1.0.rbxm (6.6 KB)
Xanimator V2.0.0.rbxm (8.3 KB)
SmoothAnimator V1.0.0.rbxm (8.4 KB)