Grupo

O recurso Grupo fornece um contêiner para controles que você deseja agrupar visualmente em uma página. O recurso Grupo tem configurações adicionais disponíveis para que você possa ajustar a aparência e a exibição dos controles dentro do contêiner. Além das opções de configuração disponíveis por meio do próprio controle Grupo, você pode usar Estilos para dar mais tema à aparência.

Visão Geral dos Recursos

Os grupos fornecem muitas opções de configuração, dependendo da saída desejada.

Exemplo de grupo usando o tipo de layout empilhado

Os grupos oferecem suporte às seguintes opções de configuração:

• Escolha entre dois tipos de layout de orientação ao configurar grupos: lado a lado ou empilhado.
• Capacidade de usar dimensionamento relativo para dimensionar e preencher o conteúdo para caber no espaço vertical e horizontal disponível em uma página.
• Opção para configurar grupos para recolher e expandir quando o título for clicado.
• Acordeão e Guia são dois tipos de controles que podem ter informações residindo dentro deles e são úteis para apresentar agrupamentos lógicos de informações.
  • Por padrão, App Builder apresentará o primeiro Controle como expandido (ou aberto), e o restante como recolhido (ou fechado).
  • Personalize a imagem exibida em um controle Accordion, que é usado para indicar o estado aberto/fechado. Se você não escolher um "estado desligado" para o Accordion, App Builder usará a imagem do estado ON e a girará 90 graus.
  • O estado padrão (aberto ou fechado) pode ser definido para controles Accordion.

Como Configurar um Grupo

Para usar Grupos, você basicamente cria um Grupo como um controle de contêiner e, em seguida, especifica os controles individuais que deseja que residam dentro do Grupo.

1. Navegue até a página onde deseja configurar o Grupo.
2. Vá para Gaveta de ações > Live Designer.
3. Selecione o painel na visualização de design.
4. Clique no botão + Control.
5. Atribua um Nome para o Grupo.
6. Selecione Grupo como o Tipo de controle.

7. Defina Tipo de Layout. Por exemplo: Lado a Lado.

   • Empilhado: Coloca os controles em linhas separadas, empilhando um sobre o outro.
   • Lado a Lado: Coloca os controles um ao lado do outro ou lado a lado.

8. Clique em Avançar.

9. Revise as informações e clique em Concluir.
10. Clique na aba Todos os controles.
11. Para cada controle que você deseja dentro do Grupo, defina o valor Pai para o valor do Grupo nomeado.

12. Para configuração adicional, clique no ícone de registro aberto para o controle Grupo.

    • A aba Propriedades do Controle permite que você altere o Nome do Controle, altere o Tipo de Controle, altere o Tipo de Layout, defina se as Bordas do Grupo serão exibidas, defina o controle como aberto por padrão e também defina o controle como Ativo ou Inativo.
    • A aba Posição e Largura permite que você ajuste com precisão onde no painel o Grupo aparece, quanta Largura é alocada a ele e o Alinhamento.
    • A aba Rótulo permite que você defina a Visibilidade do Rótulo, substitua o valor do Rótulo e defina o Tipo de Rótulo como Lado a Lado ou Empilhado para o campo de controle correspondente.
    • A aba Edge Case permite que você insira um texto de ajuda que aparecerá quando um usuário passar o mouse sobre o campo.

Método de Dimensionamento de Compressão e Expansão

Se você estiver usando um tipo de layout Lado a Lado para um grupo, App Builder fornecerá opções de Método de dimensionamento para configurar:

• Compress: Flutua o contêiner do grupo para a esquerda e dimensiona os controles com base no conteúdo. O valor Width pode ser usado para substituir a largura do controle que App Builder computa.
• Expandir: Dimensiona os controles contidos no Grupo para preencher a largura disponível. A configuração Largura pode ser usada para ajustar os tamanhos App Builder calcula. Observe que os tipos de controle de botão, ícone e imagem não serão redimensionados para preencher a largura ao usar esta configuração.