Demonstra Passo a passo: Dispor de Windows Forms Controls Padding, margens e a propriedade AutoSize

Artigo
08/04/2011

Posicionamento preciso de controles no formulário é uma prioridade alta para muitos aplicativos. O Windows Forms Designer lhe oferece várias ferramentas de layout para fazer isso. Três das mais importantes são o Margin, Padding, e AutoSize Propriedades, que estão presentes em todos os controles Windows Forms.

O Margin propriedade define o espaço ao redor do controle que os controles de outros mantém uma distância especificada a partir bordas. do controle

O Padding propriedade define o espaço no interior de um controle que mantém o conteúdo do controle (por exemplo, o valor de suas Text propriedade) uma distância especificada a partir bordas. do controle

A ilustração a seguir mostra a Padding e Margin Propriedades em um controle.

Preenchimento e margem para controles do Windows Forms

O AutoSize propriedade informa a um controle para dimensionar automaticamente si mesmo para o seu conteúdo. Ele será redimensiona seja menor que o valor de seu original Size propriedade e ele representará o valor de suas Padding propriedade.

As tarefas ilustradas neste passo a passo incluem:

Criando um projeto Windows Forms
Definir margens para seus controles.
Definir o preenchimento de seus controles
Os controles de dimensionamento automaticamente

Quando tiver terminado, você terá de entender o papel desempenhado por esses recursos importantes do layout.

Observação
As caixas de diálogo e comandos de menu demonstradas podem ser diferentes daqueles descritos na Ajuda, dependendo das configurações ativas ou configurações de edição. Para alterar as configurações, escolha Import and Export Settings sobre o Ferramentas menu. Para obter mais informações, consulte Trabalhando com configurações.

Pré-requisitos

A fim de concluir este explicação passo a passo, será necessário:

Dê permissões suficientes para poder criar e executar projetos de aplicativos de Formulários do Windows no computador onde o Visual Studio está instalado.

Criando o projeto

A primeira etapa é criar o projeto e configurar o formulário.

Para criar o projeto

Criar um Windows Application projeto chamado LayoutExample. Para obter mais informações, consulte Como: Crie um novo projeto de aplicativo do Windows Forms .
Selecione o formulário de Windows Forms Designer.

Definir margens para seus controles.

Você pode definir a distância padrão entre os controles usando o Margin propriedade. Quando você move um controle próximo suficiente para um outro controle, você verá um snapline que mostra as margens para os dois controles. O controle que você está movendo também se ajustará à distância definida pelas margens.

Para organizar os controles no formulário usando a propriedade Margin

Arraste dois Button controla a partir de caixa de ferramentas para seu formulário.
Selecione uma da Button controla e movê-lo para perto do outro, até que eles são quase tocar.

Observe o snapline que aparece entre eles. Essa distância é a soma dos dois controles Marginvalores. O controle que você está movendo encaixa para essa distância. Para obter detalhes, consulte:Demonstra Passo a passo: Organizando controles em Windows Forms usando linhas de ajuste.
Alterar o Margin propriedade de um dos controles, expandindo o Margin entrada na Propriedades janela e a configuração o All propriedade para 20.
Selecione uma da Button controla e movê-lo para perto do outro.

A definição de snapline a soma dos valores de margem é maior e que o controle se ajusta a uma distância maior de outro controle.
Alterar o Margin a propriedade do controle selecionado, expandindo o Margin entrada na Propriedades janela e a configuração o Top propriedade para 5.
Mover o controle selecionado abaixo de outro controle e observe que o snapline é mais curto. Mover o controle selecionado à esquerda de outro controle e observe que o snapline retém o valor observado na etapa 4.
Você pode definir cada um dos aspectos da Margin propriedade, Left, Top, Right, Bottom, para valores diferentes, ou você pode defini-los todos para o mesmo valor com o All propriedade.

Definir o preenchimento de seus controles

Para alcançar o layout preciso necessário para seu aplicativo, os controles geralmente irá conter controles filho. Quando você deseja especificar a proximidade da borda do controle filho para a borda do controle pai, use o controle de pai Padding propriedade em conjunto com o controle de filho Margin propriedade. O Padding propriedade também é usada para controlar a proximidade do conteúdo do controle (por exemplo, um Button do controle Text propriedade) para bordas.

Para organizar os controles no formulário usando o preenchimento

Arraste um controle Button do ToolBox para seu formulário.
Altere o valor da propriedade AutoSize do controle Button para true, .
Alterar o Padding propriedade expandindo o Padding entrada na Propriedades janela e a configuração o All propriedade para 5.

O controle expande para fornecer espaço para o novo preenchimento.
Arraste um controle GroupBox do ToolBox para seu formulário. Arraste um controle Button do ToolBox para o controle GroupBox. Posição do Button de controle para que fique alinhada com o canto inferior direito do GroupBox de controle.

Observe as linhas de ajuste que aparece como o Button abordagens de controle da parte inferior e bordas direitas da GroupBox de controle. Essas linhas de ajuste correspondem do Margin propriedade da Button.
Alterar o GroupBox do controle Padding propriedade expandindo o Padding entrada na Propriedades janela e a configuração o All propriedade para 20.
Selecione o Button controle dentro do GroupBox controlar e movê-lo em direção ao centro da GroupBox.

As linhas de ajuste aparecem a uma distância maior do que as bordas da GroupBox de controle. Essa distância é a soma da Button do controle Margin propriedade e o GroupBox do controle Padding propriedade.

Os controles de dimensionamento automaticamente

Em alguns aplicativos, o tamanho de um controle não será o mesmo em tempo de execução como era no tempo de design. O texto de um Button controle, por exemplo, pode ser obtida a partir de um banco de dados e seu comprimento não será conhecido em Avançar.

Quando o AutoSize for definida como true, o controle será dimensionado para conteúdo. Para obter mais informações, consulte Visão geral da propriedade AutoSize.

Para organizar os controles no formulário usando a propriedade AutoSize

Arraste um controle Button do ToolBox para seu formulário.
Altere o valor da propriedade AutoSize do controle Button para true, .
Alterar o Button do controle Text propriedade como "Este botão tem uma longa seqüência de sua propriedade de texto."

Quando você confirmar a alteração, o Button controle redimensionado para ajustar o novo texto.
Arraste outra Button controlar a partir do caixa de ferramentas para seu formulário.
Alterar o Button do controle Text propriedade como "Este botão tem uma longa seqüência de sua propriedade de texto."

Quando você confirmar a alteração, o Button controle não se redimensiona, e o texto é cortado pela borda direita do controle.
Alterar o Padding propriedade expandindo o Padding entrada na Propriedades janela e a configuração o All propriedade para 5.

O texto no interior do controle é recortado todos os quatro lados.
Alterar o Button do controle AutoSize propriedade para true.

O Button controle se redimensiona para abranger toda cadeia de caracteres. Além disso, o enchimento foi adicionado ao redor do texto, fazendo com que o Button controle expandir em todas as quatro direções.
Arraste um controle Button do ToolBox para seu formulário. Posicione o canto inferior direito do formulário.
Altere o valor da propriedade AutoSize do controle Button para true, .
Definir o Button do controle Anchor propriedade para Right, Bottom.
Alterar o Button do controle Text propriedade como "Este botão tem uma longa seqüência de sua propriedade de texto."

Quando você confirmar a alteração, o Button controle redimensionado em direção à esquerda. Em geral, o dimensionamento automático aumentará o tamanho de um controle na direção oposta sua Anchor configuração de propriedade.

AutoSize e propriedades de AutoSizeMode

Alguns controles suportam a AutoSizeMode propriedade, que lhe dá mais controle refinado sobre automáticas dimensionando o comportamento de um controle.

Para utilizar a propriedade AutoSizeMode

Arraste um controle Panel do ToolBox para seu formulário.
Alterar o valor da propriedade AutoSize do controle Panel para true, .
Arraste um controle Button do ToolBox para o controle Panel.
Local do Button controle perto do canto inferior direito da Panel de controle.

Selecione o Panel de controle e pegue a alça de dimensionamento de inferior direito. Redimensionar o Panel o controle a ser maiores e menores.

Observação
Você pode redimensionar livremente as Panel controle, mas você não pode dimensioná-lo menor do que a posição da Button canto inferior direito do. controle Esse comportamento é especificado pelo valor padrão de AutoSizeMode propriedade, que é GrowOnly.

Alterar o valor da propriedade AutoSizeMode do controle Panel para GrowAndShrink, .

O Panel controle dimensiona a mesmo para cercar o Button de controle. Você não pode redimensionar a Panel de controle.
Arraste o Button controle em direção ao canto superior esquerdo da Panel de controle.

O Panel controle é redimensionado para o Button de nova posição. da controle

Próximas etapas

Há muitos outros recursos de layout para organizar controles em seus aplicativos Windows Forms. Aqui estão algumas combinações que você pode tentar:

Criar um formulário usando um TableLayoutPanel de controle. Para obter detalhes, consulte:Demonstra Passo a passo: Organizando controles em formulários do Windows usando um TableLayoutPanel. Tente alterar os valores a TableLayoutPanel do controle Padding propriedade, bem como o Margin propriedade em seus controles filho.
Experimente o mesmo experimento usando um FlowLayoutPanel de controle. Para obter detalhes, consulte:Demonstra Passo a passo: Organizando controles em Windows Forms usando um FlowLayoutPanel.
Experimente a ancoragem de controles filho em um Panel de controle. O Padding propriedade é uma realização mais geral da DockPadding propriedade e você pode satisfazer mesmo que esse é o caso, colocando um controle filho em um Panel de controle e configuração do controle filho Dock propriedade para Fill. Definir o Panel do controle Padding propriedade para vários valores e observe o efeito.

Consulte também

Share via