Tutorial: Crear un formulario MDI con combinación de menús y controles ToolStrip

El espacio de nombres System.Windows.Forms es compatible con aplicaciones de interfaces de múltiples documentos (MDI) y el control MenuStrip admite la combinación de menús. Los formularios MDI también pueden ser compatibles con los controles ToolStrip.

Este tutorial muestra cómo utilizar los controles ToolStripPanel con un formulario MDI. El formulario también admite la combinación de menús con menús secundarios. En este tutorial se ilustran las siguientes tareas:

  • Creación de un proyecto de Windows Forms

  • Creación del menú principal del formulario. El nombre real del menú variará.

  • Agregar el control ToolStripPanel al cuadro de herramientas.

  • Creación de un formulario secundario.

  • Organizar los controles ToolStripPanel por orden z.

Cuando haya terminado, tendrá un formulario MDI que es compatible con la fusión de menús y los controles móviles ToolStrip.

Para copiar el código de este tema como una sola lista, vea Cómo: Crear un formulario MDI con combinación de menús y controles ToolStrip.

Prerrequisitos

Necesitará Visual Studio para completar este tutorial.

Creación del proyecto

  1. En Visual Studio, cree un proyecto de aplicación Windows llamado MdiForm (Archivo>Nuevo>Proyecto>Visual C# o Visual Basic>Escritorio clásico>Aplicación Windows Forms).

  2. Seleccione el formulario en el Diseñador de Windows Forms.

  3. En la ventana Propiedades, establezca el valor de IsMdiContainer en true.

Creación del menú principal

El formulario MDI primario contiene el menú principal. El menú principal tiene un elemento de menú denominado Ventana. Con el elemento de menú Ventana , puede crear formularios secundarios. Los elementos de menú de los formularios secundarios se combinan en el menú principal.

  1. En el Cuadro de herramientas, arrastre un control MenuStrip al formulario.

  2. Agregue un elemento ToolStripMenuItem al control MenuStrip y asígnele el nombre Ventana.

  3. Seleccione el control MenuStrip.

  4. En la ventana Propiedades, establezca el valor de la propiedad MdiWindowListItem en ToolStripMenuItem1.

  5. Agregue un subelemento al elemento de menú Ventana y denomine al subelemento Nuevo.

  6. En la ventana Propiedades, haga clic en Eventos.

  7. Haga doble clic en el evento Click.

    El Diseñador de Windows Forms genera un controlador de eventos para el evento Click.

  8. Inserte el código siguiente en el controlador de eventos.

    // This method creates a new ChildForm instance
    // and attaches it to the MDI parent form.
    private void newToolStripMenuItem_Click(object sender, EventArgs e)
    {
        ChildForm f = new ChildForm();
        f.MdiParent = this;
        f.Text = "Form - " + this.MdiChildren.Length.ToString();
        f.Show();
    }
    
    ' This method creates a new ChildForm instance 
    ' and attaches it to the MDI parent form.
     Private Sub newToolStripMenuItem_Click( _
     ByVal sender As Object, _
     ByVal e As EventArgs) _
     Handles newToolStripMenuItem.Click
    
         Dim f As New ChildForm()
         f.MdiParent = Me
         f.Text = "Form - " + Me.MdiChildren.Length.ToString()
         f.Show()
    
     End Sub
    

Agregue el control ToolStripPanel al cuadro de herramientas

Al usar los controles MenuStrip con un formulario MDI se debe tener el control ToolStripPanel. Debe agregar el control ToolStripPanel al Cuadro de herramientas para construir su formulario MDI en el Diseñador de formularios de Windows Forms.

  1. Abra el Cuadro de herramientas y haga clic en la ficha Todos los formularios de Windows Forms para mostrar los controles de formularios de Windows Forms disponibles.

  2. Haga clic con el botón derecho para abrir el menú contextual y seleccione Elegir elementos.

  3. En el cuadro de diálogo Seleccionar elementos del cuadro de herramientas, desplácese hacia abajo por la columna Nombre hasta encontrar ToolStripPanel.

  4. Seleccione la casilla en ToolStripPanel, y haga clic en Aceptar.

    El control ToolStripPanel aparece en el Cuadro de herramientas.

Crear un formulario secundario

En este procedimiento, definirá una clase de formulario secundaria independiente que tenga su propio control MenuStrip. Los elementos de menú de este formulario se combinan con los del formulario primario.

  1. Agregue un nuevo formulario denominado ChildForm al proyecto.

    Para obtener más información, vea Cómo: Agregar formularios de Windows Forms a un proyecto.

  2. En el Cuadro de herramientas, arrastre un control MenuStrip al formulario secundario.

  3. Haga clic en el glifo de acciones del diseñador del control MenuStrip (Small black arrow) y luego seleccione Editar elementos.

  4. En el cuadro de diálogo Editor de la colección de elementos, agregue un nuevo ToolStripMenuItem denominado ChildMenuItem al menú secundario.

    Para obtener más información, vea Editor de la colección de elementos de ToolStrip.

Probar el formulario

  1. Presione F5 para compilar y ejecutar el formulario.

  2. Haga clic en el elemento de menú Ventana para abrir el menú y, a continuación, haga clic en Nuevo.

    Se crea un nuevo formulario secundario en el área cliente MDI del formulario. El menú del formulario secundario se combina con el menú principal.

  3. Cerrar el formulario secundario.

    El menú del formulario secundario se quita del menú principal.

  4. Haga clic en Nuevo varias veces.

    Los formularios secundarios se enumeran automáticamente en el elemento de menú Ventana porque se asigna la propiedad MenuStrip del control MdiWindowListItem.

Agregar compatibilidad para ToolStrip

En este procedimiento, agregará cuatro controles ToolStrip al formulario primario MDI. Cada control ToolStrip se agrega dentro de un control ToolStripPanel, que se acopla al borde del formulario.

  1. En el Cuadro de herramientas, arrastre un control ToolStripPanel al formulario.

  2. Con el control ToolStripPanel seleccionado, haga doble clic en el control ToolStrip del Cuadro de herramientas.

    Se crea un control ToolStrip en el control ToolStripPanel.

  3. Seleccione el control ToolStripPanel.

  4. En la ventana Propiedades, cambie el valor de la propiedad Dock del control Left.

    El control ToolStripPanel se acopla al lado izquierdo del formulario, debajo del menú principal. El área de cliente MDI cambia de tamaño para ajustarse al control ToolStripPanel.

  5. Repita los pasos 1 a 4.

    Acople el nuevo control ToolStripPanel a la parte superior del formulario.

    El control ToolStripPanel está acoplado debajo del menú principal, pero a la derecha del primer control ToolStripPanel. Este paso muestra la importancia del orden z para posicionar correctamente los controles ToolStripPanel.

  6. Repita los pasos 1 a 4 para otros dos controles ToolStripPanel.

    Acople los nuevos controles ToolStripPanel a la derecha y a la parte inferior del formulario.

Organizar controles ToolStripPanel por orden Z

La posición de un control ToolStripPanel acoplado en su formulario MDI está determinada por la posición del control en el orden z. Puede organizar fácilmente el orden z de los controles en la ventana Esquema del documento.

  1. En el menú Ver, haga clic en Otras ventanas y haga clic en Esquema del documento.

    La disposición de sus controles ToolStripPanel del procedimiento anterior no es estándar. Esto se debe a que el orden z no es correcto. Use la ventana Esquema del documento para cambiar el orden z de los controles.

  2. En la ventana Esquema del documento, seleccione ToolStripPanel4.

  3. Haga clic en el botón de flecha abajo repetidamente, hasta que ToolStripPanel4 esté en la parte inferior de la lista.

    El control ToolStripPanel4 se acopla a la parte inferior del formulario, debajo de los demás controles.

  4. Seleccione ToolStripPanel2.

  5. Haga clic en el botón de flecha abajo una vez para colocar el tercer control en la lista.

    El control ToolStripPanel2 se acopla a la parte superior del formulario, debajo del menú principal y encima de los demás controles.

  6. Seleccione varios controles en la ventana Esquema del documento y muévalos a diferentes posiciones en el orden z. Observe el efecto del orden z en la colocación de controles acoplados. Use CTRL-Z o Deshacer en el menú Editar para deshacer los cambios.

Comprobación del formulario

  1. Presione F5 para compilar y ejecutar el formulario.

  2. Haga clic en el control de ajuste de un control ToolStrip y arrastre el control a diferentes posiciones en el formulario.

    Puede arrastrar un control ToolStrip de un control ToolStripPanel a otro.

Pasos siguientes

En este tutorial, ha creado un formulario MDI primario con controles ToolStrip y fusión de menús. Puede usar la familia de controles ToolStrip para muchos otros fines:

Vea también