Procedimiento para crear una interfaz de usuario de varios paneles con formularios Windows Forms
Al organizar los controles de un formulario, puede crear una interfaz de usuario de varios panel similar a la que se usa en Microsoft Outlook, con una lista de carpetas, un panel de mensajes y un panel de vista previa. Esta organización se consigue principalmente mediante el acoplamiento de controles con el formulario.
Cuando se acopla un control, se determina a qué borde del contenedor primario se fija. Si establece la propiedad Dock en Right, el borde derecho del control se acoplará al borde derecho de su control primario. Además, se cambia el tamaño del borde acoplado del control para que coincida con el de su control contenedor. Para obtener más información sobre cómo funciona la propiedad Dock, consulte Procedimiento para acoplar controles en Windows Forms.
Este procedimiento se centra en organizar el control SplitContainer y otros controles en el formulario, no en agregar funcionalidad para que la aplicación imite Microsoft Outlook.
Formulario diseñado para parecerse a una ventana de correo de Outlook.
Para crear esta interfaz de usuario, debe colocar todos los controles dentro de un control SplitContainer. SplitContainer contiene un control TreeView en el panel izquierdo y otro SplitContainer en el panel derecho. El segundo SplitContainer contiene un control ListView en la parte superior y un control RichTextBox en la parte inferior.
Estos controles SplitContainer permiten cambiar de forma independiente el tamaño de los demás controles del formulario. Puede adaptar las técnicas de este procedimiento para crear sus propias interfaces de usuario personalizadas.
Diseño de los controles
En la tabla siguiente se describe cómo se configuran los controles para imitar Microsoft Outlook:
| Control | Propiedad | Value |
|---|---|---|
| SplitContainer | Name | splitContainer1 |
| Acoplar | Fill |
|
| TabIndex | 4 |
|
| SplitterWidth | 4 |
|
| SplitterDistance | 100 |
|
| Panel1.Controls | Agregue el control treeView1 a este panel. |
|
| Panel2.Controls | Agregue el control treeView1 a este panel. |
|
| TreeView | Name | treeView1 |
| Acoplar | Fill |
|
| TabIndex | 0 |
|
| Nodos | Agregue un nuevo nodo denominado Node0. |
|
| SplitContainer | Name | splitContainer2 |
| Acoplar | Fill |
|
| TabIndex | 1 |
|
| SplitterWidth | 4 |
|
| SplitterDistance | 150 |
|
| Orientación | Horizontal |
|
| Panel1.Controls | Agregue el control treeView1 a este panel. |
|
| Panel2.Controls | Agregue el control treeView1 a este panel. |
|
| ListView | Name | listView1 |
| Acoplar | Fill |
|
| TabIndex | 2 |
|
| Elementos | Agregue un nuevo elemento y establezca el texto en item1. |
|
| RichTextBox | Name | richTextBox1 |
| Acoplar | Fill |
|
| TabIndex | 3 |
|
| Texto | richTextBox1 |
Consulte también
.NET Desktop feedback