Animating ui size/position breaks the scaling

Godot Version

v4.5.1

Question

I’m having trouble with animation the size/position of UI elements. Here’s a gif of the animation I made, running at 1080p:

bfsscope-ezgif.com-optimize

It works fine at 1080p, since that’s the default viewport resolution and the one the animation was built for, but changing the viewport size at all causes the animation to still play with the 1080p values, causing the scope assets to be sized and centered incorrectly. I think it’s just grabbing the values and hard locking them and not letting them be scaled.

The scaling works properly if the window is resized after the animation or if the tracks for size/position in the animation are disabled, but the animation itself only works properly at 1080p, which isn’t ideal.

I could theoretically adjust the animation in code at runtime to scale the key values based on the viewport resolution, but that’d be a huge pain and really hacky, and I’d like to avoid doing that if possible. I also really don’t want to have to redo all the keyframes. Is there an easy fix for this?

the upcoming 4.7 should help with animated control nodes; changing size is especially fragile currently.

If you do not want to upgrade to dev, or wait for stable, you may have to remake the animations as Tweens. If you are lucky it’s only a matter of setting correct anchors. And a last-ditch effort you can also set your project’s stretch mode to canvas_items to prevent different aspect ratios.

Got it, I was kind of afraid of that. I’ve tried messing with the anchors and it doesn’t seem to make a difference. Remaking it as tweens would technically be doable, but a huge pain since the animation has a lot of smaller keyframes in it.

Setting the stretch mode to canvas_items does seem to fix it, fortunately, although it broke a minor unrelated thing, so I’ll probably just have to upgrade to 4.7 when it comes out. Thanks!

1 Like

Here’s to hoping for a quick release! Though you can try out the dev builds today if you like, make sure to make a backup/use version control.

If it fits the aesthetic using stretch mode “viewport” might help, this forces not only the same aspect ratio but also the same screen size. a 4K monitor-gamer would see a 1080p game, but that can help if you are going for a low-poly low-res retro style.