Compartir a través de

Procedimiento para crear una interfaz de usuario de varios paneles con formularios Windows Forms mediante el diseñador

  • Artículo

En el siguiente procedimiento, creará una interfaz de usuario de varios paneles similar a la usada en Microsoft Outlook, con una lista Carpeta, un panel Mensajes y un panel 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. Por lo tanto, 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.

Para crear esta interfaz de usuario, coloque todos los controles dentro de un control SplitContainer, que contiene un control TreeView en el panel izquierdo. El panel derecho del control SplitContainer contiene un segundo control SplitContainer con un control ListView encima de un control RichTextBox. 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.

Para crear una interfaz de usuario de estilo Outlook en tiempo de diseño

  1. Cree un proyecto de aplicación de Windows (Archivo>Nuevo>Proyecto>Visual C# o Visual Basic>Escritorio clásico>Aplicación de Windows Forms).

  2. Arrastre un control SplitContainer del Cuadro de herramientas al formulario. En la ventana Propiedades , establezca la propiedad Dock en Fill.

  3. Arrastre un control TreeView del Cuadro de herramientas al panel izquierdo del control SplitContainer. En la ventana Propiedades, establezca la propiedad Dock en Left haciendo clic en el panel izquierdo del editor de valores que se muestra cuando se hace clic en la flecha hacia abajo.

  4. Arrastre otro control SplitContainer desde el Cuadro de herramientas; colóquelo en el panel derecho del control SplitContainer que agregó al formulario. En la ventana Propiedades, establezca la propiedad Dock en Fill y la propiedad Orientation en Horizontal.

  5. Arrastre un control ListView desde el Cuadro de herramientas al panel superior del segundo control SplitContainer que agregó al formulario. Establezca la propiedad Dock del control ListView en Fill.

  6. Arrastre un control RichTextBox desde el Cuadro de herramientas hasta el panel inferior del segundo control SplitContainer. Establezca la propiedad Dock del control ListView en Fill.

    En este momento, si presiona F5 para ejecutar la aplicación, el formulario muestra una interfaz de usuario de tres partes, similar a la de Microsoft Outlook.

    Nota

    Al colocar el puntero del mouse sobre cualquiera de los divisores dentro de los controles SplitContainer, puede cambiar el tamaño de las dimensiones internas.

En este momento, en el desarrollo de aplicaciones, ha creado una interfaz de usuario sofisticada. El siguiente paso es continuar con la programación de la propia aplicación, quizás conectando el control TreeView y los controles ListView a algún tipo de origen de datos. Para obtener más información sobre cómo conectar controles a datos, consulte Enlace de datos y formularios Windows Forms.

Consulte también