Canvas Responsivo na Unity 3D

Canvas Responsivo na Unity 3D

A engine contém diversas ferramentas e recursos para ajustes de tela e ancoragem de Game Objects.

Publicado em

Você começa a criar o seu jogo, fica super empolgado com os desenhos recebidos por um Designer amigo seu, monta tudo bonitinho e funcionando perfeitamente, mas quando envia para outras pessoas testares, se assusta, o layout dos elementos UI não está igual a da sua maquina.

Quem nunca passou pela situação mostrada acima? E olha que hoje nem é sexta-feira 13 hein, para trazer esse tipo de conto de terror.

Felizmente temos jogadores em diversas telas com diferentes resoluções, seja um monitor antigo de 800x600 ou um gamer ultrawide de 2560x1080, mas independente do tipo de resolução, sua interface precisa se adaptar a todas elas.

Preparamos um vídeo bem prático ensinando os principais pontos para deixar seu layout responsivo, organizado e mais dinâmico.

Ancoragem de elementos no Canvas da Unity 3D

Precisamos entender duas coisas inicialmente, um Game Object de UI pode ser ajustado a partir do seu ponto pivô central ou distribuído pelo seu conteúdo.

No componente Rect Transform, temos uma grade alinhamentos, o estado padrão faz a distribuição levando em consideração o Pivô do objeto.

Pivo de ancoragem Unity 3D
Pivo de ancoragem Unity 3D

Agora se você quer ajustar seus elementos a partir do seu conteúdo (massa, largura e altura), então segure a tecla Shift Esquerdo, enquanto clica e mantém a janela de grades aberta. Nessa nova grade, você terá a sua disposição a distribuição e ancoramento a partir de cada ponto do seu componente UI, como a borda esquerda, por exemplo.

Ancoragem por conteúdo na Unity 3D
Ancoragem por conteúdo na Unity 3D

Layout Group no Canvas da Unity 3D

No vídeo citado acima, vemos mais a fundo os componentes de Layout Group, porém vamos ver uma explicação extra.

Existem componentes que fazem diferentes ajustes em elementos, como o Horizontal Layout Group e o Vertical Layout Group. Cada um deles fazem a distribuição dos filhos conforme os parâmetros e o tipo especificado.

  • Vertical Layout Group  - Distribui os elementos verticalmente;
  • Horizontal LAyout Group - Distribui os elementos horizontalmente.

Layout Group na Unity 3D
Layout Group na Unity 3D

Por hora é isso, em caso de dúvidas, deixe nos comentários.

Gunnar Correa
Gunnar Correa

Autodidata, Graduado em Desenvolvimento Web, Especialista em Tecnologias na Educação e Pós-graduando em Segurança da Informação. Começou seus estudos na área de programação quando era criança, e atualmente, está estudando desenvolvimento de jogos. Fundador da SatellaSoft, criado em 2009 com o intuito de compartilhar conhecimento de forma gratuita e inédita.

Todos os nossos cursos em promoção
Todos os nossos cursos em promoção

Webstories

Todos os nossos cursos em promoção


Deixe um comentário
Aguarde...
Todos os nossos cursos em promoção