Tweening Added!

Tweening has been added to Monine Engine! While they were added a couple of days before this update was, it's still relatively on time! Technically!

Tweens allow you to change properties over a period of time with certain easing and execution, and can be very useful when used correctly!
Since the documentation is pretty slim at the moment other than the Intellisense summaries, here's a quick guide to get started on using tweens:

Quick Start

When loading a scene or a component, you can create a tween using the TweenHelper. This class allows you to quickly make a tween and have it be processed and updated automatically. Well... almost, but we'll get to that in a moment. For now, here's a simple snippet that modifies the position of an entity in the "BlueDot" variable. Using these configurations, the dot's position would go from (0, 300) to (300, 300) over the span of 3 seconds.

using MonineEngine.Mathematics.Tweening;
// this would be inside of a custom Scene class

public override void Initialize() 
{
    // insert object declarations above...
    
    var tween = TweenHelper.Tween( // create a new tween
        BlueDot.Transform, // the object that contains the value we want to modify
        "Position",  // the name of the member within the object we want to modify. this would have us be modifying "BlueDot.Transform.Position".
        new Vector2(300, 300), // by the end of the tween, what should the value of the member be?
        3, // the duration of the tween in seconds.
        new TweenOptions()
            {
                EaseType = TweenEaseType.BounceOut, // use "BounceOut" easing while tweening
                Method = TweenMethod.OneShot, // execute the tween once, and then dispose of it upon completion.
            }
        );

    tween.Start(); // start the tween!
}

public override void Update(GameTime gameTime)
{
    TweenHelper.Update(Time.deltaTime); // remember to update the tween helper!! without this, tweens will never be updated, and will never do anything.
    
    // you only need to call the update in one script within the scene. doesn't matter where, as long as it's updated!
    // you shouldn't call this multiple times though, or tweens would execute twice as fast! or even 3 times as fast, depending on how many times you execute it!
}

This simple example should already give you a general idea of how tweens work. While simple at heart, they're very powerful when used correctly!

Notes & Tips

When defining the EaseType of the tween, TweenEaseType contains definitions for almost every easing type you would need! It's best to experiment and try each type out yourself and see what fits! easings.net contains all of the types used in Monine, along with examples and comparisons to linear easing! You can find the full list of easing types here. Not the most descriptive documentation, but still could be nice to look at!

TweenMethod defines HOW a tween executes. The list for this is much shorter than TweenEaseType, so that will be provided here:

• OneShot: Executes the tween once, and deletes it upon completion.
• Persist: Plays the tween once, but keeps it attached to the container. This can be used to keep a reference to the tween after it finishes. For example, this could be used to play it again.
• Looping: Plays the tween until stopped, going back to the start and replaying upon completion.
• PingPong: Identical to Looping, but every second execution is in reverse direction. Quite literally like a ping pong ball going back and forth!
• BackwardOneShot: Identical to OneShot, except it executes the tween backwards.
• BackwardPersist: Identical to Persist, except it executes the tween backwards.

You can do much more than the easing and method with TweenOptions! You can define a delay between repeated executions with Looping and PingPong, and also create callbacks for when the tween starts, updates, or finishes! An example of a completely filled out TweenOptions is below:

new TweenOptions()
    {
        EaseType = TweenEaseType.Linear, // use linear easing (basically just no easing at all)
        Method = TweenMethod.PingPong, // execute back and forth until stopped
        Delay = 2f, // wait 2 seconds between each repeated execution
        OnBegin = tween => { Debug.Log($"Tween {nameof(tween)} started!"); }, // log when the tween begins
        OnUpdate = tween => { Debug.Log($"Tween {nameof(tween)} updated!"); }, // log when the tween updates
        OnComplete = tween => { Debug.Log($"Tween {nameof(tween)} completed!"); } // log when the tween completes
    };

It's probably good to note that OnBegin and OnComplete do also count for repeat executions. OnBegin will be called every time an execution begins, and OnComplete will be called every time an execution finishes.

Final Words

As you can see, there are quite a lot of opportunities with tweens! You could make animations, or cutscenes, or smooth menus, or anything that may need movement!

I hope this system let's people make a lot of cool stuff, even if the people using Monine as of now is none.