Layout do contêiner

O layout de um contêiner ajuda a criar um layout complexo de sua escolha de modo fácil e simples. Quando o controle do layout de um contêiner é adicionado, por padrão, um único contêiner fica disponível. É possível adicionar outros contêineres, clicando no sinal de “+”, na tela.

Os contêineres dentro do layout do contêiner podem ser reposicionados, bastando arrastar um contêiner e soltá-lo em qualquer lugar dentro do layout. Os contêineres podem ser redimensionados, arrastando seu canto. É possível excluir um contêiner, selecionando-o e pressionando a tecla “delete” do teclado ou, então, a partir do modo de exibição de árvore.

O controle de layout de contêiner tem dois conjuntos de propriedades. Um para o layout do contêiner e outro para cada um dos contêineres dentro do layout.

Observação:

Recomendação

Os layouts de contêiner são melhores quando usados no nível da página, ou seja, quando se deseja criar o layout de uma página com diferentes seções. Para alinhar e posicionar os controles na página, sugerimos o uso de Contêineres

Importante: Evite layouts de contêiner aninhados. Recomendamos evitar o uso de layouts de contêiner aninhados, pois isso facilita a manutenção e a consistência entre o tempo de design e o tempo de execução.

Propriedades de layout de contêiner

Geral

• Dica de ferramentas — São exibidas dicas de ferramentas sobre o layout do contêiner. Use a dica para fornecer informações adicionais sobre o controle.
• Oculto — Quando selecionado, oculta o controle no tempo de execução.
• Desabilitado — Quando selecionado, desabilita o controle no tempo de execução.

Events

Não há eventos.

Estilo

• Cor de fundo — Conjuntos de cores de fundo do layout do contêiner.
• Fonte — Define a família de fontes para o layout do contêiner. Todos os contêineres dentro do layout terão a mesma família de fontes do layout.
• Margem - Define a margem do layout. Por padrão, a margem 0 px vem definida. As propriedades Top/Bottom (Superior/Inferior) e Left/Right (Esquerda/Direita) são combinadas. Essas propriedades podem ser desvinculadas, usando-se o botão de desvinculação, do lado direito do cabeçalho da seção da Margem.
• Preenchimento — Define o preenchimento do layout. Por padrão, o preenchimento O px vem definido. As propriedades de preenchimento Superior/Inferior e Direita/Esquerda são combinadas. Essas propriedades podem ser desvinculadas com o ícone de desvinculação, que fica do lado direito do cabeçalho, na seção de preenchimento, caso outros valores de preenchimento precisarem ser definidos para cada lado.
• Tamanho — A largura e a altura do layout podem ser definidas na seção de Tamanho. A largura padrão é definida como 100%. A altura do layout se ajusta automaticamente, com base nos contêineres dentro dele, pois está definido como “Auto”.

Container Properties

Geral

• Oculto — Quando selecionado, oculta o controle no tempo de execução.
• Desabilitado — Quando selecionado, desabilita o controle no tempo de execução.

Events

• Clicando em — Configure o que acontece ao se clicar no contêiner.

Estilo

• Layout — Determine como os controles dentro do contêiner serão posicionados:

  • Direção (Horizontal/vertical) - Os controles são organizados um abaixo do outro (vertical) ou um ao lado do outro (horizontal).
  • Alinhamento — Alinhamento de controles dentro do modelo (Esquerdo, Centro, Direito e Estender na vertical e Superior, Meio, Inferior e Estender na horizontal).
  • Justificar — Superior, Centro, Inferior e Distribuir na direção vertical e Esquerda, Centro, Direita e Distribuir na direção horizontal.
  • Permitir encapsulamento — se habilitada, encapsula o controle no contêiner se não houver espaço suficiente.
• Cor de fundo — Conjuntos de cores de fundo do contêiner.
• Borda — Define a borda do controle. Com relação à borda, é possível configurar a espessura, a cor e o raio da borda.
• Fonte — Define a família de fontes para o contêiner. Todos os controles dentro do contêiner terão a mesma família de fontes do contêiner.