Attention: Here be dragons

This is the latest (unstable) version of this documentation, which may document features not available in or compatible with released stable versions of Godot.

Checking the stable version of the documentation...

Introduction to 2D

As ferramentas de desenvolvimento de jogos 2D do Godot incluem uma engine de renderização 2D dedicado, sistema de física e recursos especialmente voltados para a criação de experiências 2D. Você pode projetar níveis de forma eficiente com o sistema TileMap, animar personagens com sprites 2D ou animação Cutout, e aproveitar a iluminação 2D para uma iluminação dinâmica das cenas. O sistema de partículas 2D embutido permite criar efeitos visuais complexos, e o Godot também suporta shaders personalizados para melhorar seus gráficos. Esses recursos, combinados com a acessibilidade e flexibilidade do Godot, fornecem uma base sólida para criar jogos 2D envolventes.

Demonstração (Demo) do jogo de plataforma 2D disponível na Biblioteca de recursos.

Esta página mostrará o espaço de trabalho 2D e como você pode conhecê-lo.

Dica

If you would like to get an introduction to 3D, see Introdução ao 3D.

espaço de trabalho 2D

Você usará o espaço de trabalho 2D para trabalhar com cenas 2D, projetar níveis ou criar interfaces de usuário. Para alternar para o espaço de trabalho 2D, você pode selecionar um nó 2D na árvore de cenas ou usar o seletor de espaço de trabalho localizado na borda superior do editor:

Semelhante ao 3D, você pode usar as abas abaixo do seletor de áreas de trabalho para alternar entre as cenas atualmente abertas ou criar uma nova usando o botão de mais (+). Os painéis esquerdo e direito devem ser familiares a partir da introdução ao editor.

Abaixo do seletor de cena está a barra de ferramentas principal, e abaixo da barra de ferramentas principal está a janela de exibição 2D.

Você pode arrastar e soltar nós compatíveis do painel Sistema de Arquivos para adicioná-los à janela de exibição como nós. Arrastar e soltar adiciona o nó arrastado como um irmão do nó selecionado (se o nó raiz estiver selecionado, adiciona como filho). Manter Shift pressionado ao soltar adiciona o nó como filho do nó selecionado. Segurar Alt ao soltar adiciona o nó como filho do nó raiz. Se Alt + Shift estiverem pressionados ao soltar, o tipo do nó poderá ser selecionado, se aplicável.

Main toolbar

Alguns botões da barra de ferramentas principal são os mesmos da área de trabalho 3D. Uma breve explicação é fornecida com o atalho caso o cursor do mouse seja passado sobre um botão por um segundo. Alguns botões podem ter funcionalidades adicionais se outra tecla for pressionada. Uma recapitulação da funcionalidade principal de cada botão com seu atalho padrão é fornecida abaixo, da esquerda para a direita:

• Modo Seleção (Q): Permite a seleção de nós na janela ne exibição. Clicar com o botão esquerdo em um nó na janela de exibição o seleciona. Clicar e arrastar com o botão esquerdo desenhando um retângulo seleciona todos os nós dentro dos limites do retângulo ao soltar o botão. Segurar Shift durante a seleção adiciona mais nós à seleção. Clicar em um nó selecionado enquanto segura Shift desseleciona o nó. Nesse modo, você pode arrastar o(s) nó(s) selecionado(s) para mover, pressionar Ctrl para alternar temporariamente para o modo de rotação ou usar os círculos vermelhos para redimensionar. Se múltiplos nós estiverem selecionados, somente movimento e rotação são possíveis. Neste modo, rotação e redimensionamento não usarão as opções de encaixe caso o encaixe esteja ativado.

• Modo de Movimentação (W): Habilita o modo de movimentação (ou translação) para os nós selecionados. Consulte 2D Viewport para mais detalhes.

• Modo de Rotação (E): Habilita o modo de rotação para os nós selecionados. Consulte 2D Viewport para mais detalhes.

• Modo de Escalonamento (S): Habilita o dimensionamento e exibe dispositivos de dimensionamento em ambos os eixos para o(s) nó(s) selecionado(s). Consulte 2D Viewport para mais detalhes.

• Mostrar lista de nós selecionáveis na posição clicada: Como a descrição sugere, isso fornece uma lista de nós selecionáveis na posição clicada como um menu de contexto, se houver mais de um nó na área clicada.

• Rotation pivot: Sets the rotation pivot to rotate node(s) around. An added node has its rotation pivot at x: 0, y: 0, by default, with exceptions. For example, the default pivot for a Sprite2D is its center if the centered property is set to true. If you would like to change the rotation pivot of a node, click this button and choose a new location by left clicking. The node rotates considering this point. If you have multiple nodes selected, this icon will add a temporary pivot to be used commonly by all selected nodes. Pressing Shift and clicking this button will create the pivot at the center of selected nodes. If any of the snap options are enabled, the pivot will also snap to them when dragged.

• Modo de Movimentação de Câmera (G): Permite navegar na janela de exibição sem selecionar nenhum nó acidentalmente. Em outros modos, você também pode segurar Espaço e arrastar com o botão esquerdo do mouse para fazer o mesmo.

• Modo de Régua: Após habilitar, clique na janela de exibição para exibir as coordenadas x e y globais atuais. Arrastar de uma posição para outra mede a distância em pixels. Se você arrastar na diagonal, desenhará um triângulo e mostrará as distâncias separadas em termos de x, y e a distância total até o alvo, incluindo os ângulos em relação aos eixos em graus. A tecla R ativa a régua. Se o ajuste estiver habilitado, ele também exibe as medidas em termos de contagem da grade:

Usando régua com encaixe habilitado.

• Usar Atração Inteligente: Alterna o encaixe inteligente para os modos mover, girar e escalar; e para o pivô de rotação. Personalize-o usando o menu de três pontos ao lado das ferramentas de encaixe.

• Usar Atração à Grade: Alterna o encaixe à grade para os modos mover e escalar, pivô de rotação e régua. Personalize-o usando o menu de três pontos ao lado das ferramentas de encaixe.

Você pode personalizar as configurações da grade para que os modos de movimento, rotação, escala, régua e rotação utilizem o ajuste. Use o menu de três pontos para isso:

• Usar Atração de Rotação: Alterna o encaixe usando a configuração de rotação configurada.

• Usar Atração de Escalonamento: alterna o ajuste usando a configuração de etapa de escala.

• Atração Relativa: Alterna o uso do ajuste com base nos valores de transformação atuais do nó selecionado. Por exemplo, se as grades estiverem definidas para 32x32 pixels e se o nó selecionado estiver localizado em x: 1, y: 1, habilitar esta opção deslocará temporariamente as grades em x: 1, y: 1.

• Usar Atração a Pixels: Alterna o uso de subpixels para atração. Se habilitado, os valores de posição serão inteiros; desabilitar habilitará o movimento dos subpixels como valores decimais. Para a propriedade de tempo de execução, considere marcar a propriedade Configurações do Projeto > Renderização > 2D > Encaixe > Snap 2D Transforms to Pixel para nós Node2D e Configurações do Projeto > GUI > Comum> Alinhas Controles a Pixels para nós do tipo Control.

• Atração Inteligente: Fornece um conjunto de opções para ajustar em posições específicas, se estiverem habilitadas:

  • Atrair ao Pai: Encaixa nas bordas do pai. Por exemplo, redimensionar um nó filho do tipo Control enquanto essa opção está ativada fará com que ele se encaixe nas bordas do pai.

  • Atrair à Âncora do Nó: Encaixa na âncora do nó. Por exemplo, se as âncoras de um nó do tipo Control estiverem posicionadas em diferentes locais, ativar essa opção fará com que o encaixe ocorra nas laterais e cantos da âncora.

  • Atrair aos Lados do Nó: Encaixa nas laterais do nó, como para o pivô de rotação ou posicionamento da âncora.

  • Atrair ao Centro do Nó: Encaixa no centro do nó, como para o pivô de rotação ou posicionamento da âncora.

  • Atrair a Outros Nós: Encaixa a outros nós ao mover ou dimensionar. Útil para alinhar nós no editor.

  • Atrair às Guias: Encaixa em guias personalizadas desenhadas usando a régua horizontal ou vertical. Mais sobre a régua e guias abaixo.

• Configurar Atração...: Abre a janela mostrada acima, oferecendo um conjunto de parâmetros de alinhamento.

  • Deslocamento da Grade: Permite deslocar as grades em relação à origem. Os valores x e y podem ser ajustados separadamente.

  • Incremento de Grade: A distância entre cada grade em pixels. x e y podem ser ajustados separadamente.

  • Linha Primária a Cada: O número de grades intermediárias para desenhar linhas infinitas como indicação das linhas principais.

  • Deslocamento de Rotação: define o deslocamento para deslocar o encaixe rotacional.

  • Incremento de Rotação: define o grau de ajuste. Por exemplo, 15 significa que o nó girará e ajustará em múltiplos de 15 graus se o ajuste de rotação estiver habilitado e o modo de rotação for usado.

  • Incremento de Escala: Determina o fator de incremento de escala. Por exemplo, se for "0,1" , a escala será alterada em passos de "0,1" se o ajuste de escala estiver habilitado e o modo de escala for usado.

• Trancar Nó(s) Selecionado(s) (Ctrl + L). Bloqueia os nós selecionados, impedindo a seleção e movimentação na viewport. Clicar no botão novamente (ou usar Ctrl + Shift + L) desbloqueia os nós selecionados. Nós bloqueados só podem ser selecionados na árvore de cena. Eles podem ser facilmente identificados por um cadeado ao lado de seus nomes na árvore de cena. Clicar nesse cadeado também desbloqueia os nós.

• Agrupar Nó(s) Selecionado(s) (Ctrl + G). Isso permite a seleção do nó raiz se algum dos filhos estiver selecionado. Usar Ctrl + G novamente desfaz o agrupamento. Além disso, clicar no botão de desagrupar na árvore de cena realiza a mesma ação.

• Opções de Esqueleto: Oferece opções para trabalhar com Skeleton2D e Bone2D.

  • Mostrar Ossos: Alterna a visibilidade dos ossos do nó selecionado.

  • Criar nó(s) Bone2D a partir de nó(s): Converte nó(s) selecionado(s) em Bone2D.

Ver também

To learn more about Skeletons, see Animação de recorte(Cut-out).

• Menu Visualizar: Oferece opções para controlar a visualização da janela de exibição. Como suas opções dependem muito da janela de exibição, elas são abordadas na seção 2D Viewport.

Ao lado do menu "Visualizar", botões adicionais podem estar visíveis. Na imagem da barra de ferramentas no início deste capítulo, um botão adicional Sprite2D aparece porque um Sprite2D está selecionado. Este menu fornece algumas ações e ferramentas rápidas para trabalhar em um nó ou seleção específica. Por exemplo, ao desenhar um polígono, ele oferece botões para adicionar, modificar ou remover pontos.

Sistema de coordenadas

No editor 2D, diferente do 3D, existem somente dois eixos: x e y. Além disso, o ângulo de visão é fixo.

Na janela de exibição, você verá duas linhas em duas cores cruzando a tela infinitamente: vermelho para o eixo x e verde para o eixo y. No Godot, ir para a direita e para baixo são direções positivas. O ponto de intersecção dessas duas linhas é a origem: x: 0, y: 0.

Um nó raiz terá sua origem nesta posição após ser adicionado. Alternar para os modos mover` ou ``escalar após selecionar um nó exibirá os gizmos na posição de deslocamento do nó. Os gizmos apontarão para as direções positivas dos eixos x e y. No modo de movimento, você pode arrastar a linha verde para mover apenas no eixo y. Da mesma forma, você pode segurar a linha vermelha para mover apenas no eixo x.

No modo de escala, os gizmos terão um formato quadrado. Você pode segurar e arrastar os quadrados verde e vermelho para dimensionar os nós nos eixos y ou x. Arrastar na direção negativa inverte o nó horizontal ou verticalmente.

2D Viewport

A janela de exibição será a área onde você passará mais tempo se planeja criar níveis ou interfaces de usuário visualmente:

Clicar com o botão do meio do mouse e arrastar o mouse deslocará a visualização. As barras de rolagem à direita ou na parte inferior da janela de exibição também movem a visualização. Alternativamente, as teclas G ou Espaço podem ser usadas. Se você habilitar Configurações do Editor > Editores > Movimentação da Câmera > Movimento Simples, poderá ativar o deslocamento diretamente com Espaço, sem precisar arrastar.

A janela de exibição possui botões no canto superior esquerdo. Centralizar Câmera centraliza o(s) nó(s) selecionado(s) na tela. Útil se você tiver uma cena grande com muitos nós e quiser visualizar o nó selecionado na árvore de cena. Ao lado estão os controles de zoom. - afasta o zoom, + aproxima o zoom, e clicar no número com a porcentagem redefine para 100%. Alternativamente, você pode usar a roda do meio do mouse para aproximar (rolar para cima) e afastar (rolar para baixo) o zoom.

As barras pretas nas bordas esquerda e superior da janela de exibição são as réguas. Você pode usá-las para se orientar na janela de exibição. Por padrão, as réguas exibem as coordenadas em pixels, numeradas em passos de 100 pixels. Alterar o fator de zoom mudará os valores exibidos. Ativar o Atração à Grade ou alterar as opções de encaixe atualizará a escala da régua e os valores mostrados.

Você também pode criar vários guias personalizados para ajudar você a fazer medições ou alinhar nós com eles:

Se você tiver pelo menos um nó na cena, poderá criar guias arrastando-as da régua horizontal ou vertical em direção à janela de exibição. Uma guia roxa aparecerá, mostrando sua posição, e permanecerá lá quando você soltar o botão do mouse. Você pode criar guias horizontais e verticais simultaneamente arrastando-as do quadrado cinza na interseção das réguas. As guias podem ser reposicionadas arrastando-as de volta para suas respectivas réguas, e podem ser removidas arrastando-as de volta para a régua.

Você também pode habilitar o encaixe nas guias criadas usando o menu Atração Inteligente.

Nota

Se você não conseguir criar uma linha ou não visualizar guias criadas anteriormente, certifique-se de que elas estejam visíveis verificando o menu "Visualizar" da janela de exibição. Y alterna a visibilidade delas por padrão. Além disso, certifique-se de ter pelo menos um nó na cena.

Dependendo da ferramenta escolhida na barra de ferramentas, clicar com o botão esquerdo realizará uma ação principal na janela de exibição. Por exemplo, o Modo de Seleção selecionará o nó clicado com o botão esquerdo na janela de exibição. Às vezes, o clique esquerdo pode ser combinado com um modificador (por exemplo, Ctrl ou Shift) para executar ações secundárias. Por exemplo, manter Shift pressionado enquanto arrasta um nó nos modos "Seleção" ou "Movimento" tentará encaixar o nó em um único eixo durante o movimento.

Clicar com o botão direito na janela de exibição oferece duas opções: criar um nó ou instanciar uma cena na posição escolhida. Se pelo menos um nó estiver selecionado, clicar com o botão direito também oferece a opção de mover o(s) nó(s) selecionado(s) para essa posição.

A janela de exibição tem um menu Visualizar que fornece diversas opções para alterar a aparência da janela de exibição:

• Grade: Permite mostrar a grade o tempo todo, mesmo quando não estiver ativado o modo de atração (snapping). Você também pode alternar a exibição usando a opção fornecida.

• Mostrar Suportes: Alterna a exibição temporária do contorno do nó, com as propriedades de transformação anteriores (posição, escala ou rotação) se uma operação de transformação tiver sido iniciada. Para nós do tipo Control, também mostra os parâmetros de dimensionamento. Útil para visualizar as diferenças (deltas).

• Mostrar Réguas: Alterna a visibilidade das réguas horizontal e vertical. Veja 2D Viewport para mais informações sobre réguas.

• Mostrar Guias: Alterna a visibilidade das guias criadas. Consulte 2D Viewport para saber como criá-las.

• Mostrar Origem: alterna a exibição das linhas de origem verde e vermelha desenhadas em x: 0, y: 0.

• Mostrar Viewport: Alterna a visibilidade da janela de exibição (Viewport) padrão do jogo, indicada por um retângulo na cor índigo. É também o tamanho padrão da janela em plataformas desktop, que pode ser alterado em Configurações do Projeto > Exibição > Janela > Tamanho e definindo Largura da Viewport e Altura da Viewport.

• Gizmos: Alterna a visibilidade dos indicadores Posição (mostrado com o ícone de cruz), Trancar (mostrado com cadeado), Grupo (mostrado com dois quadrados) e Transformação (mostrado com linhas verdes e vermelhas).

• Centralizar Seleção: O mesmo que o botão Centralizar Câmera na janela de exibição. Centraliza o(s) nó(s) selecionado(s) na visualização. F é o atalho padrão.

• Seleção de Quadro: Semelhante a Centralizar Seleção, mas também altera o fator de zoom para ajustar o conteúdo na tela. Shift + F é o atalho padrão.

• Limpar Guias: Exclui todas as guias da tela. Você precisará recriá-las se planeja usá-las mais tarde.

• Visualizar Escala da Tela: Alterna a visualização da escala da tela no editor quando o fator de zoom ou a visualização da janela de exibição muda. Útil para ver como os node do tipo Control ficarão após a escala e a movimentação, sem executar o jogo.

• Pré-visualizar Tema: Permite escolher entre os temas disponíveis para alterar a aparência dos nodes do tipo Control no editor, sem precisar executar o jogo.

Node2D and Control node

CanvasItem is the base node for 2D. Node2D is the base node for 2D game objects, and Control is the base node for everything GUI. For 3D, Godot uses the Node3D node.

Displaying 3D nodes in 2D

It is possible to display 3D nodes in a 2D scene by using a SubViewport. You can see this in the demo 3D in 2D Viewport.