Ability to tween between anchors

Godot Version



Hey, I’m looking to do a fun menu effect when switching between menus. I currently have my pause menu centered (via the V Center Wide anchor) and I was curious if it’s possible to tween it to the left (Left Wide anchor) and then tween it back to the center. Is an effect like this possible?

There’s a built-in tweening function in Godot.

I don’t know the specifics of your needs, but you can use Tweening like so:


Step 1
Create a Tweener.
var tween = create_tween();

Keep in mind that no matter what you do, this tween function will remove itself by the next frame. So this line should be used in functions 99.99% of the time.

Step 2
Specify what object and which of its properties you want to tween.
tween.tween_property(self, "global_position", Vector2.ZERO, 0.5);

In this example, the Node (self) running this code will move (change its global_position) towards [0, 0] (Vector2.ZERO) over 0.5 seconds (the final parameter is how long do you want it to take to achieve the final result).


That’s it really.

Some other things to note about tweening is if you call multiple tween.tween_property(), they’re queued.

So if you were to do…

tween.tween_property(self, "global_position", Vector2.ZERO, 0.5);
tween.tween_property(self, "global_rotation", 180, 0.5);

self would go to [0, 0] THEN rotate itself 180.

But sometimes, you want things to run simultaneously.
In that case, you would call .parallel():

tween.tween_property(self, "global_position", Vector2.ZERO, 0.5);
tween.parallel().tween_property(self, "global_rotation", 180, 0.5);

Obviously, this is just a basic run-down for what you seem to need at the moment, but if you need more advanced uses: Tween — Godot Engine (stable) documentation in English

I’d be shocked if this was possible since anchor system is supposed to be rigid like a grid and has no in-between values. But…

You can fake it by putting the menu inside a margin container and then tweening left-side margin. If it starts in the center then you set the left margin to start at

get_viewport_rect().size.x / 2 - menu.size.x / 2

or something and then tween it down 0.

This works fine for 1 button but can have other issues depending what the overall scene tree looks like.

I did see someone do a menu plugin here in the forums, with menus moving off-screen and back on-screen. Find that and check their source code.