Keep your place in this quest

Log in or sign up for free to subscribe, follow lesson progress, and access more learning content.

Criando Ativos

Ativos são as peças que seu jogo usa: imagens, cenas, sons e objetos. No Tiniest2D, você cria a maior parte dos ativos escrevendo uma variável no script. O editor percebe construtores como Sprite() e permite que você edite o ativo visualmente.

image.png

Sprites

Sprites são imagens em pixel-art. Elas são usadas para personagens, paredes, moedas, botões, balas, fundos e qualquer outra coisa que precise ser desenhada. Um sprite pode ser uma única imagem ou uma pequena animação feita de múltiplos quadros.

Para criar um sprite, declare uma variável com o construtor Sprite():

var playerSprite = Sprite(16, 16)
var coin = Sprite(8, 8)
var wall = Sprite(32, 32)

Os números são largura e altura em pixels. Após salvar, você verá o nome da variável envolto em uma caixa escura - isso indica que é um ativo sprite.

Para editar um sprite:

  • Ctrl+Click no nome da variável do sprite
  • O Editor de Sprite abre

Controles do Editor de Sprite

image.png

O Editor de Sprite é onde você desenha a imagem pixel por pixel. Se você é novo em pixel art, comece pequeno: sprites de 8x8 ou 16x16 são mais fáceis de ler, editar e animar.

Controle Ação
Clique esquerdo Pintar pixel com a cor atual
Clique direito Apagar pixel (transparente)
Arrastar do meio do mouse Panorâmica da visualização
Roda do mouse Zoom in/out
Paleta de cores Clique para selecionar a cor
Largura/Altura +/- Redimensionar o sprite
Alternar Colisor Ativar/desativar limites de colisão
Offsets do Colisor Ajustar inserções de colisão L/T/R/B
Mostrar Colisor Pré-visualizar limites de colisão
Espaço Alternar pré-visualização de animação
Setas Esquerda/Direita Navegar entre os quadros
Escape Retornar ao editor de script

Painel de Animação

Animação é feita mostrando vários quadros de sprite rapidamente em sequência. Por exemplo, um personagem andando pode ter um quadro com o pé esquerdo à frente e outro com o pé direito à frente.

image.png

O painel de Animação (na barra lateral esquerda) permite que você gerencie os quadros do sprite:

Controle Ação
FPS +/- Ajustar a velocidade da animação (quadros por segundo)
Adicionar Quadro Adicionar um novo quadro em branco no final
Copiar Quadro Duplicar o quadro atual (inserido após o atual)
Deletar Quadro Deletar o quadro atual (apenas se houver mais de 1 quadro)
Tira de Quadro Clique nas miniaturas na parte inferior para selecionar quadros

Quando um sprite tem múltiplos quadros, os objetos que o utilizam automaticamente animarão em tempo de execução. Cada objeto rastreia seu próprio estado de animação de forma independente.