Compartilhar via

Como criar uma interface do usuário multipainel com Windows Forms

Ao organizar controles em um formulário, você pode criar uma interface de usuário de vários painéis semelhante à usada no Microsoft Outlook, com uma lista de Pastas , um painel de Mensagens e um painel de Pré-visualização . Essa organização é obtida principalmente por meio de controles de encaixe com o formulário.

Ao encaixar um controle, você determina a qual borda do contêiner pai um controle é fixado. Se você definir a propriedade Dock como Right, a borda direita do controle será encaixada na borda direita do controle pai. Além disso, a borda encaixada do controle será redimensionada para corresponder à borda do controle contêiner correspondente. Para obter mais informações sobre como a propriedade Dock funciona, consulte How to: Dock Controls on Windows Forms.

Este procedimento se concentra em organizar o SplitContainer e os outros controles no formulário, não em adicionar funcionalidade para fazer o aplicativo imitar o Microsoft Outlook.

um formulário projetado para parecer uma janela de email do Outlook.

Para criar essa interface do usuário, você coloca todos os controles em um controle SplitContainer. O SplitContainer contém um controle TreeView no painel esquerdo e outro SplitContainer no painel direito. O segundo SplitContainer contém um controle ListView na parte superior e um controle RichTextBox na parte inferior.

Esses controles SplitContainer habilitam o redimensionamento independente dos outros controles no formulário. Você pode adaptar as técnicas neste procedimento para criar suas próprias interfaces de usuário personalizadas.

Layout de controle

A tabela a seguir descreve como os controles são configurados para imitar o Microsoft Outlook:

Controle Propriedade Valor
SplitContainer Nome splitContainer1
Doca Fill
TabIndex 4
Largura do Divisor 4
SplitterDistance 100
Painel1.Controles Adicione o controle treeView1 a este painel.
Panel2.Controls Adicione o controle splitContainer2 a este painel.
TreeView Nome treeView1
Doca Fill
TabIndex 0
Nodos Adicionar um novo nó chamado Node0
SplitContainer Nome splitContainer2
Doca Fill
TabIndex 1
Largura do Divisor 4
SplitterDistance 150
Orientação Horizontal
Painel1.Controles Adicione o controle listView1 a este painel.
Panel2.Controls Adicione o controle richTextBox1 a este painel.
Visualização de Lista Nome listView1
Doca Fill
TabIndex 2
Itens Adicione um novo item e defina o texto como item1.
RichTextBox Nome richTextBox1
Doca Fill
TabIndex 3
Texto richTextBox1

Consulte também

  • Last updated on