Módulo 8 · Aula 8.9 · Animação com Tween (opcional)

Objetivos de aprendizagem

1. Animar uma propriedade (tamanho, posição) pelo código com create_tween().
2. Fazer passos ao mesmo tempo (set_parallel) e um depois do outro (chain).
3. Usar a animação como "juice" curto, com a moderação da Aula 7.5.

Pré-requisitos

Aula 7.5 (juice com moderação). Aula 8.4.

Materiais

Godot 4.7; laboratório, cena castanha_pulando.tscn.

Conceitos

Tween. Muda uma propriedade aos poucos, de onde está até um valor, num tempo dado: tween_property(self, "scale", Vector2(3, 3), 0.15) faz o nó crescer até 3 vezes em 0,15 segundo.

Ao mesmo tempo ou em fila. Normalmente, cada tween_property espera o anterior terminar. Com set_parallel(true), os seguintes rodam juntos. chain() volta a fazer em fila.

Propriedade com parte. "position:y" mexe só no y da posição.

AnimatedSprite2D × Tween. A animação por quadros (Aula 8.3) troca desenhos; o Tween mexe em números. Os dois se completam. O Godot também tem o nó AnimationPlayer, para animações montadas numa linha do tempo; ele fica de fora deste módulo.

Exemplos

Tutorial passo a passo

1. Abra castanha_pulando.tscn e execute. Aperte Espaço ou Enter.
2. Leia castanha_pulando.gd. Mude 0,15 para 1,0: ainda parece comemoração, ou ficou lento? Volte.
3. No Sementes em Godot, faça a semente "piscar" antes de sumir: em vez de queue_free() direto, um Tween de scale para zero em 0,1 s e depois queue_free (dica: tween.tween_callback(queue_free)).
4. Atenção: com o Tween, a semente ainda existe por 0,1 s. Ela pode ser coletada duas vezes? Como evitar? (Dica: desligar a colisão com set_deferred("monitoring", false) logo no começo.)

Imagens

Não há capturas desta aula. A cena é pequena e o efeito só se vê em movimento.

Indicação da interface

Não há telas novas: é só código, na tela Script.

O código completo

exemplos/laboratorio/scripts/castanha_pulando.gd:

extends Sprite2D


func _unhandled_input(event: InputEvent) -> void:
	if event.is_action_pressed("ui_accept"):
		comemorar()


func comemorar() -> void:
	var y_inicial := position.y
	var tween := create_tween()
	# Dois passos ao mesmo tempo: cresce e sobe.
	tween.set_parallel(true)
	tween.tween_property(self, "scale", Vector2(3, 3), 0.15)
	tween.tween_property(self, "position:y", y_inicial - 40, 0.15)
	# Depois (chain), volta ao normal.
	tween.chain().tween_property(self, "scale", Vector2(2, 2), 0.2)
	tween.tween_property(self, "position:y", y_inicial, 0.2)

Explicação do código

• create_tween() cria o Tween preso ao nó: se o nó sumir, o Tween para junto.
• A castanha começa com scale 2 (definido na cena) e volta para 2.
• O teste automático confere que, logo depois de apertar, ela está maior e mais alta, e que meio segundo depois voltou exatamente ao tamanho e ao lugar.

Resultado esperado

Comemoração de menos de meio segundo, e a semente do Sementes sumindo com animação, sem ponto contado duas vezes.

Problemas comuns

Exercício guiado

Quanto tempo dura a comemoração inteira? (Resposta: 0,15 + 0,2 = 0,35 s.)

Desafio individual

Faça um texto "+1" aparecer em cima da semente coletada, subir 30 pixels e sumir (modulate:a até 0) em 0,4 s.

Desafio avançado (opcional)

Pesquise na documentação os tipos de "easing" (set_trans, set_ease) e use um que pareça um pulo de verdade.

Critérios de avaliação

• Tween com passos em paralelo e em fila.
• Efeito curto, ligado a um momento importante.

Checklist de conclusão

• Testei a castanha pulando
• Usei set_parallel e chain
• A semente some com animação, sem contar duas vezes

Extensão

Compare com os brilhos da Feira do Troco (Aula 7.5): o que é mais fácil de fazer no GDevelop e o que é mais fácil no Godot?