Skip to main content

Como alterar o posicionamento da sua imagem

Conheça os sete layouts de imagem do Yay! Forms (plano de fundo, ao lado do texto, tela dividida e banners) e como as opções se adaptam no celular.

Depois que uma pergunta tem uma imagem ou vídeo anexado, a linha Layout no painel direito decide onde ela fica: como plano de fundo, ao lado do texto, preenchendo metade da tela ou como banner. O canvas mostra uma prévia de cada opção ao vivo.

A linha Layout

Com a pergunta selecionada, encontre Layout em Image / Video (imagem/vídeo) no painel direito: uma linha de ícones, um por layout. Clique em um para aplicá-lo.

A linha de ícones do Layout em destaque no painel

Os sete layouts de desktop

1. Plano de fundo. A imagem preenche a tela inteira atrás da pergunta. Ótimo para criar atmosfera; garanta que o texto continue legível sobre ela.

A imagem como plano de fundo completo atrás da pergunta

2. À esquerda do texto. A imagem fica em uma caixa ao lado da pergunta, à esquerda.

A imagem flutuando à esquerda da pergunta

3. À direita do texto. O espelho do anterior.

A imagem flutuando à direita da pergunta

4. Split à esquerda. A imagem preenche a metade esquerda da tela de ponta a ponta; a pergunta ocupa a metade direita. O visual clássico para fotos de produto e retratos.

A imagem preenchendo a metade esquerda da tela

5. Split à direita. A mesma divisão, com a imagem à direita.

A imagem preenchendo a metade direita da tela

6. Acima da pergunta. A imagem aparece como um banner em cima da pergunta, o lugar natural para um logo. Esse layout (e o próximo) também libera os campos Height (altura) e Width (largura) para ajustar o tamanho com precisão.

A imagem como banner acima da pergunta

7. Abaixo da pergunta. A imagem aparece logo depois do título da pergunta, antes das opções. Use quando a pergunta é sobre a imagem (“Qual destes designs você prefere?”).

A imagem abaixo do título da pergunta

No celular

Celulares não têm espaço para layouts lado a lado, então a visão Mobile (celular) oferece um conjunto compacto de quatro opções, incluindo o Split top, que empilha a imagem acima da pergunta. Use o seletor de dispositivo acima do canvas para pré-visualizar e ajustar cada dispositivo separadamente; veja Como personalizar o layout do formulário por dispositivo.

A visão mobile com a imagem empilhada acima da pergunta

Conclusão

Você aprendeu os sete layouts de imagem do desktop (plano de fundo, flutuando ao lado do texto, split e banners), quais deles liberam controles de tamanho ou de ponto focal e como o conjunto se adapta no celular.

Artigos relacionados: