Organize as visualizações responsivas e padrão, ocultando contêineres específicos no layout de formato livre

Você pode ocultar contêineres de visualização para fornecer uma experiência mais responsiva em dispositivos pequenos, como celulares e tablets, bem como exibir apenas determinados objetos em exibições padrão grandes e não responsivas para desktops e tablets grandes no modo paisagem.

Por exemplo, há uma grade de detalhes e uma imagem de fundo em uma visualização responsiva em um celular. No entanto, os usuários não precisam ver esses contêineres. Você pode ocultar facilmente os elementos, para que usuários com telas pequenas tenham uma visualização limpa e intuitiva, sem imagens de fundo desnecessárias ou visualizações que criem rolagem excessiva.

Algumas coisas para manter em mente:

• Para dispositivos Apple:

  • O modo paisagem do iPad executa painéis em uma visualização que não responde.

  • O modo retrato do iPad executa painéis em uma visualização sem resposta se a dimensão do dispositivo não for inferior a 768 pontos de largura. Caso contrário, o painel funciona em modo responsivo, como em um iPad mini ou iPad de 9,7''. Detalhes sobre as dimensões do dispositivo podem ser encontrados no Fundações > Disposição > Especificações seção das Diretrizes de Interface Humana da Apple aqui.

  • Todos os iPhones executam painéis em uma visualização responsiva, independentemente de os usuários estarem na visualização retrato ou paisagem.

• Para dispositivos Android:

• Os tablets Android seguem o ponto de interrupção 768. os painéis serão executados em uma visualização responsiva se a dimensão do dispositivo for inferior a 768 pontos.

• Todos os telefones Android executam painéis em uma visualização responsiva, independentemente de os usuários estarem na visualização retrato ou paisagem.

Para obter mais informações sobre visualizações responsivas, consulte Melhores práticas para criar um painel responsivo de formato livre.

• Ocultar contêineres em uma visualização responsiva

• Ocultar contêineres em uma visualização padrão

Ocultar contêineres em uma visualização responsiva

1. Abra um painel em layout de formato livre.
2. Identifique os contêineres que você deseja ocultar em uma visualização responsiva para telas pequenas.

Visualização original sem resposta:



Visualização responsiva:



Você deseja ocultar a imagem e a grade de uma visualização responsiva para telas pequenas para eliminar qualquer rolagem necessária.

3. No painel Camadas, clique com o botão direito no contêiner e escolha Ocultar na visualização responsiva.

   Observe os ícones para indicar quais contêineres estão ocultos em uma visualização responsiva.

   

4. Use o Visualização responsiva para ver a aparência da tela pequena.

   

5. Para exibir novamente os contêineres ocultos em uma visualização responsiva, clique com o botão direito no contêiner no painel Camadas e escolha Mostrar na visualização responsiva.

Ocultar contêineres em uma visualização padrão

Pode haver casos em que você queira exibir apenas objetos específicos em uma exibição padrão e sem resposta para telas grandes. É aqui que Ocultar na visualização padrão vem a calhar. Ocultar na visualização padrão tem dois ótimos casos de uso.

1. Organize a visualização responsiva para telas pequenas para que apenas objetos específicos sejam exibidos e, em seguida, fiquem ocultos em uma visualização padrão e não responsiva para telas grandes. Isso pode incluir a criação de diferentes barras de navegação para pequenos dispositivos móveis, em vez de desktops ou tablets grandes no modo paisagem. Aqui estão dois exemplos:

• Painel da central de atendimento

  

  

• Painel de varejo

2. Ótimo para usar durante a criação para ajudar a ajustar e formatar contêineres sobrepostos. Lembre-se de mostrar novamente na tela antes de salvar, a menos que queira que os objetos permaneçam ocultos em uma tela grande padrão e sem resposta.