Etapa 1: Adicionar Auto layout

Selecione vários elementos (por exemplo, um ícone e texto), clique com o botão direito e escolha Adicionar Auto Layout, ou utilize o atalho Shift + A. Alternativamente, clique no ícone de Auto Layout no painel Design em Layout.

Etapa 2: Reconhecer o quadro de Auto layout

O ícone do quadro no painel de Camadas mudará para indicar que é um quadro de Auto Layout. Isso significa que o quadro agora se ajusta dinamicamente aos seus objetos filhos.

Etapa 3: Ajustar configurações do quadro

O Auto Layout adiciona quadros dinâmicos que se ajustam com base em seus objetos filhos. É possível ajustar o preenchimento, o raio do canto e as dimensões do quadro, tanto na horizontal quanto na vertical. Utilize opções de redimensionamento como ajustar ao conteúdo para garantir que o quadro diminua para se ajustar ao texto.

Etapa 4: Personalizar direção e espaçamento do layout

Altere a direção do layout (horizontal, vertical ou embrulhar). Ajuste o espaço horizontal entre os elementos ou adicione preenchimento para criar espaço negativo ao redor dos elementos.

Etapa 5: Garantir responsividade do botão

Botões criados com Auto Layout expandem ou diminuem automaticamente conforme o texto é digitado, garantindo responsividade. Isso é ideal para projetos que exigem adaptabilidade.

Etapa 6: Empilhar e agrupar elementos

Empilhe elementos uns sobre os outros e, em seguida, aplique Auto Layout para agrupá-los. Isso permite criar projetos organizados e responsivos.

Etapa 7: Modificar configurações avançadas

Ajuste as configurações de Auto Layout para controlar o comportamento dos traços e empilhamento dentro do quadro de Auto Layout. Modifique o comportamento de empilhamento para permitir que objetos se sobreponham conforme necessário.

O Auto Layout simplifica o processo de criação de botões e outros projetos responsivos, permitindo que se adaptem perfeitamente a alterações de conteúdo e layout.