Como: Controles de Layout (C++)

O Editor de Caixa de Diálogo fornece ferramentas de layout que alinham e dimensionam os controles automaticamente. Para a maioria das tarefas, você pode usar a barra de ferramentas do Editor de Caixa de Diálogo. Todos os comandos da barra de ferramentas do Editor de Caixa de Diálogo também estão disponíveis no menu Formato, e a maioria tem teclas de atalho.

Muitos comandos de layout para caixas de diálogo estão disponíveis apenas quando mais de um controle é selecionado. Você pode selecionar um único ou vários controles e, quando mais de um controle é selecionado, o primeiro que você selecionar será, por padrão, o dominante.

O local, a altura e a largura do controle atual são exibidos no canto inferior direito da barra de status. Quando a caixa de diálogo inteira é selecionada, a barra de status exibe a posição da caixa de diálogo como um todo e sua altura e largura.

Organizar controles

Você pode organizar controles em caixas de diálogo no Editor de Caixa de Diálogo em um dos três estados diferentes:

  • Com guias e margens ativadas, definidas como padrão.

  • Com a grade de layout ativada.

  • Sem nenhum recurso de fixação ou alinhamento.

A barra de ferramentas do Editor de Caixa de Diálogo contém botões que controlam o estado.

  • Para alterar o estado, selecione o ícone apropriado ou vá para o menu Formatar>Configurações da Guia.

A caixa de diálogo Configurações da Guia tem as seguintes propriedades:

Propriedade Descrição
Guias de layout Exibe as configurações das guias de layout.
Nenhum Oculta as ferramentas de layout.
Réguas e guias Quando habilitada, essa opção adiciona réguas às ferramentas de layout e permite que guias sejam colocados nas réguas. As guias padrão são as margens.
Grid Cria uma grade de layout. Novos controles serão alinhados automaticamente à grade.
Espaçamento entre grades Exibe as configurações de espaçamento de grade em DLUs (unidades de caixa de diálogo).
Largura: DLUs Define a largura da grade de layout em DLUs. Uma DLU horizontal é a largura média da fonte da caixa de diálogo dividida por 4.
Altura: DLUs Define a altura da grade de layout em DLUs. Uma DLU vertical é a altura média da fonte da caixa de diálogo dividida por 8.

Guias e Margens

Esteja você movendo ou adicionando controles, ou reorganizando um layout atual, guias e margens podem ajudar você a alinhar os controles com precisão em uma caixa de diálogo.

Quando você cria uma caixa de diálogo, quatro guias modificadas, chamados margens, são fornecidos e aparecem como linhas pontilhadas azuis.

  • Para mover as margens, basta arrastá-las para a nova posição.

  • Para fazer uma margem desaparecer, basta movê-la para uma posição zero.

  • Para recuperar a margem, coloque o ponteiro sobre a posição zero e mova a margem para a posição desejada.

As guias aparecem como linhas pontilhadas azuis na caixa de diálogo exibida no editor e setas correspondentes nas réguas na parte superior e no lado esquerdo do Editor de Caixa de Diálogo. As alças de dimensionamento dos controles se fixam nas guias quando os controles são movidos, e as guias se fixarão nos controles se estes não tiverem sido previamente fixados na guia. Quando uma guia é movida, os controles que estão fixados nela também se movem. Os controles fixados em mais de uma guia são redimensionados quando uma das guias é movida.

  • Para criar uma guia dentro da régua, clique uma vez para criar uma guia ou clique duas vezes para abrir a caixa de diálogo Configurações da Guia onde você pode especificar as configurações correspondentes.

  • Para definir um guia na caixa de diálogo, selecione a guia e arraste-a para uma nova posição ou selecione a seta na régua para arrastar a guia associado.

    As coordenadas da guia são exibidas na barra de status na parte inferior da janela e na régua ou, para exibir a posição exata da guia, mova o ponteiro sobre a seta na régua.

  • Para excluir uma guia, arraste-a para fora da caixa de diálogo ou arraste a seta correspondente para fora da régua.

As marcas de escala nas réguas que determinam o espaçamento das guias e controles são definidas por DLUs (unidades de caixa de diálogo). Uma DLU é baseada no tamanho da fonte da caixa de diálogo, normalmente MS Shell Dlg de 8 pontos. Uma DLU horizontal é a largura média da fonte da caixa de diálogo dividida por quatro. Uma DLU vertical é a altura média da fonte dividida por 8.

  • Para alterar os intervalos das marcas de escala, vá para o menu Formatar>Configurações da Guia e, no campo Espaçamento da Grade, especifique uma nova largura e altura em DLU.

Grade de Layout

Ao colocar ou organizar controles em uma caixa de diálogo, use a grade de layout para um posicionamento mais preciso. Quando a grade é ativada, os controles se fixam nas linhas pontilhadas da grade como se estivessem magnetizados.

  • Para ativar ou desativar a grade de layout, vá para o menu Formatar>Configurações da Guia e selecione ou desmarque o botão Grade.

    Você ainda pode controlar a grade em janelas individuais do Editor de Caixa de Diálogo usando o botão Alternar Grade na barra de ferramentas do Editor de Caixa de Diálogo.

  • Para alterar o tamanho da grade de layout, vá para o menu Formatar>Configurações da Guia e digite a altura e a largura em DLUs para as células na grade. A altura ou largura mínima é 4.

Desabilitar Guias

Você pode usar teclas especiais em conjunto com o mouse para desativar o efeito de fixação das guias. O uso da tecla Alt desativa os efeitos de fixação da guia selecionada. Mover uma guia com a tecla Shift impede que os controles fixados se movam com a guia.

  • Para desativar o efeito de fixação das guias, arraste o controle enquanto mantém pressionada a tecla Alt.

  • Para mover as guias sem mover os controles fixados, arraste a guia enquanto mantém pressionada a tecla Shift.

  • Para desativar as guias, vá para o menu Formatar>Configurações da Guia. Em seguida, em Guias de Layout, selecione Nenhum.

    Dica

    Você também pode usar o atalho no menu Formatar>Guias de Alternância.

Selecionar Controles

Selecione os controles para dimensioná-los, alinhá-los, movê-los, copiá-los ou excluí-los e, em seguida, conclua a operação desejada. Na maioria dos casos, você precisa selecionar mais de um controle para usar as ferramentas de dimensionamento e alinhamento na barra de ferramentas do Editor de Caixa de Diálogo.

Quando um controle é selecionado, ele tem uma borda sombreada ao redor com alças de dimensionamento sólidas (ativas) ou vazadas (inativas), pequenos quadrados que aparecem na borda de seleção. Quando vários controles são selecionados, o controle dominante tem alças de dimensionamento sólidas e todos os outros controles selecionados têm alças de dimensionamento vazias.

  • Para selecionar controles, na Janela de Ferramentas, selecione Ponteiro e use uma das seguintes etapas para fazer sua seleção:

    • Arraste o ponteiro para desenhar uma caixa de seleção ao redor dos controles que deseja selecionar na caixa de diálogo. Quando você solta o botão do mouse, todos os controles dentro e que cruzam a caixa de seleção são selecionados.

    • Mantenha pressionada a tecla Shift e selecione os controles que você deseja incluir na seleção.

    • Mantenha pressionada a tecla Ctrl e selecione os controles que você deseja incluir na seleção.

  • Para adicionar ou remover um controle do grupo de controles selecionados, mantenha pressionada a tecla Shift e selecione o controle que você deseja adicionar ou remover.

Controles Dominantes

Ao dimensionar ou alinhar vários controles, o Editor de Caixa de Diálogo usa o controle dominante para determinar como os outros controles são dimensionados ou alinhados. Por padrão, o controle dominante é o primeiro controle selecionado.

  • Para especificar o controle dominante, mantenha pressionada a tecla Ctrl e selecione o controle que você deseja usar para influenciar o tamanho ou o local de outros controles primeiro. Manter pressionada a tecla Ctrl e selecionar um controle dentro de uma seleção também fará desse controle o controle dominante nessa seleção.

  • Para alterar o controle dominante, limpe a seleção atual de todos os controles atualmente selecionados e repita o procedimento acima, selecionando um controle diferente primeiro.

Observação

As alças de dimensionamento do controle dominante são sólidas enquanto as alças dos controles subordinados são vazias. Todo o redimensionamento ou alinhamento adicional baseia-se no controle dominante.

Controles de Tamanho

Use as alças de dimensionamento para redimensionar um controle. Quando o ponteiro é posicionado em um identificador de dimensionamento, ele altera a forma para indicar as direções nas quais o controle pode ser redimensionado. As alças de dimensionamento ativos são sólidas e, se uma alça de dimensionamento for vazia, o controle não poderá ser redimensionado ao longo desse eixo.

  • Para dimensionar um controle, selecione o controle e arraste as alças de dimensionamento para alterar o tamanho.

    • As alças de tamanho na parte superior e nas laterais alteram o tamanho horizontal ou vertical.

    • Os identificadores de tamanho nos cantos alteram o tamanho horizontal e vertical.

    Dica

    Você pode redimensionar o controle uma DLU (unidade de caixa de diálogo) por vez mantendo pressionada a tecla Shift e usando as teclas de seta para a Direita e para Baixo.

  • Para dimensionar automaticamente um controle para que o texto caiba dentro dele, vá para o menu Formatar ou clique com o botão direito do mouse no controle e escolha Tamanho do conteúdo.

  • Para tornar os controles do mesmo tamanho, selecione os controles que deseja redimensionar e vá para o menu Formatar>Fazer o mesmo tamanho e escolha Ambos, Altura ou Largura.

    Você redimensiona um grupo de controles com base no tamanho do controle dominante, que é o primeiro controle selecionado na série. O tamanho final dos controles no grupo depende do tamanho do controle dominante.

  • Para dimensionar um grupo de controles com guias, fixe um lado do controle (ou controles) em uma guia e arraste uma guia para o outro lado do controle (ou controles). Agora você pode mover qualquer guia para dimensionar o controle (ou controles).

    Para usar vários controles, dimensione cada um de modo que eles sejam fixados à segunda guia.

Outros Controles

Você pode dimensionar uma caixa de combinação ao adicioná-la à caixa de diálogo. Você também pode especificar o tamanho da caixa de listagem suspensa. Para obter mais informações, confira Adicionar valores a um controle de caixa de combinação.

  1. Selecione o botão de seta suspensa à direita da caixa de combinação.

    Arrow on a combo box in an MFC project.

    O contorno do controle muda para mostrar o tamanho da caixa de combinação com a área da lista suspensa estendida.

  2. Use a alça de dimensionamento inferior para alterar o tamanho inicial da área da lista suspensa.

    Combo box sizing in an MFC project.

  3. Selecione a seta suspensa novamente para fechar a parte da lista suspensa da caixa de combinação.

Observação

Quando você adiciona uma caixa de listagem com uma barra de rolagem horizontal a uma caixa de diálogo usando o MFC, a barra de rolagem não aparecerá automaticamente em seu aplicativo.

Defina uma largura máxima para o elemento mais largo chamando CListBox::SetHorizontalExtent em seu código. Sem esse valor definido, a barra de rolagem não será exibida, mesmo que os itens na caixa de listagem sejam mais largos que a caixa.

Alinhar controles

  • Para alinhar controles, selecione aqueles que você deseja alinhar. Vá para o menu Formatar>Alinhar e escolha um dos seguintes alinhamentos:

    Alinhamento Descrição
    À Esquerda Alinha os controles selecionados ao longo de seus lados esquerdos.
    Centros Alinha os controles selecionados horizontalmente ao longo de seus pontos centralizados.
    Direitos Alinha os controles selecionados ao longo de seus lados direitos.
    Superior Alinha os controles selecionados ao longo de suas bordas superiores.
    Centralizado Alinha os controles selecionados verticalmente ao longo de seus pontos centralizados.
    Inferior Alinha os controles selecionados ao longo de suas bordas inferiores.

    Lembre-se de selecionar o controle que você deseja que seja dominante primeiro ou defina-o como tal antes de executar o comando de alinhamento ou dimensionamento, pois a posição final do grupo de controles depende da posição do controle dominante.

  • Para colocar os controles de espaço uniformemente, selecione os controles que você deseja reorganizar. Vá para o menu Formatar>Espaçar Uniformemente e escolha um dos seguintes alinhamentos:

    Espaçamento Descrição
    Através Espaçamento uniforme entre os controles mais à direita e mais à esquerda selecionados.
    Para baixo Espaçamento uniforme entre os controles mais acima e mais abaixo selecionados.
  • Para centralizar os controles, selecione o(s) controle(s) que deseja reorganizar. Vá para o menu Formatar>Centralizar na Caixa de Diálogo e escolha uma das seguintes disposições:

    Disposição Descrição
    Vertical Centralizar os controles verticalmente na caixa de diálogo.
    Horizontal Centralizar os controles horizontalmente na caixa de diálogo.
  • Para alinhar botões de push, selecione um ou mais botões de push. Vá para o menu Formatar>Organizar Botões e escolha uma das seguintes disposições:

    Disposição Descrição
    Right Alinha botões de push ao longo da borda direita da caixa de diálogo.
    Menor Alinha botões de push ao longo da borda inferior da caixa de diálogo.

    Se você selecionar um controle diferente de um botão de push, sua posição não será afetada.

Requisitos

Win32

Confira também

Gerenciar Controles da Caixa de Diálogo
Como: Adicionar, Editar ou Excluir Controles
Como: Definir Acesso e Valores de Controle