2 Ventanas usando WPF


Actualizado: Otra forma de hacer esto se encuentra en el siguiente artículo 2 Ventanas usando WPF de forma Desacoplada

Un problema que se presenta a lo largo de nuestra vida como programadores es el usar mas de una ventana abierta, y aunque hay muchas soluciones para sortear este problema, aquí veremos una forma. Miremos el código.
Primero vamos a necesitar 2 ventanas, en nuestro caso la MainWindow y la de Agregar.
El código xaml para la primera ventana sería así:

<Window x:Class="_2VentanasWPF.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525" Closing="Window_Closing">
    <Grid>
        <Button x:Name="add" Content="Agregar" VerticalAlignment="Bottom" Width="50" Click="Agregar_Click"/>
        <DataGrid x:Name="Informacion" Width="500" Height="280" VerticalAlignment="Top" RowHeight="20">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Nombre" Binding="{Binding Path=nombre}" Width="100"/>
                <DataGridTextColumn Header="Apellido" Binding="{Binding Path=apellido}" Width="100"/>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

El código para la segunda sería este:

<Window x:Class="_2VentanasWPF.Agregar"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Agregar" Height="300" Width="300">
    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <Label Content="Nombre:" Margin="10"/>
        <TextBox x:Name="Nombre" Width="100" Height="25"/>
        <Label Content="Apellido:" Margin="10"/>
        <TextBox x:Name="Apellido" Width="100" Height="25"/>
        <Button x:Name="Boton_Agregar" Width="100" Height="25" Content="Agregar" Margin="30" Click="Agregar_Click"/>
    </StackPanel>
</Window>

Y ahora veamos los code-behind de ambas Ventanas.

El código para la primera ventana o también llamada ventana principal

namespace _2VentanasWPF
{
    /// <summary>
    /// Lógica de interacción para MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        //Creamos una referencia a la Ventana Hija
        Agregar ag = new Agregar ();

        //Creamos una pequeña estructura con la cual cargaremos nuestro dataGridView
        //que contendrá el nombre y apellido de una persona
        public struct MyData
        {
            public string nombre { set; get; }
            public string apellido { set; get; }
        }
        public MainWindow ()
        {
            InitializeComponent ();
        }

        private void Agregar_Click ( object sender, RoutedEventArgs e )
        {
            try
            {
                //Si la ventana hija -Agregar- existe, le añadimos un evento y mostramos la Ventana
                //El evento disparará cuando el usuario presione el Boton_Agregar de la Ventana Hija
                //a continuación se ejecutará el método ag_AgregarEventHandler que actualizara el Grid
                ag.AgregarEventHandler += new RoutedEventHandler ( ag_AgregarEventHandler );
                ag.ShowDialog();
            }
            catch
            {
                //Si la ventana hija -Agregar- no existe, la volvemos a referenciar y le añadimos un
                //evento y mostramos la Ventana. El evento disparará cuando el usuario presione el
                //Boton_Agregar de la Ventana Hija, a continuación se ejecutará el método
                //ag_AgregarEventHandler que actualizara el Grid
                ag = new Agregar ();
                ag.AgregarEventHandler += new RoutedEventHandler ( ag_AgregarEventHandler );
                ag.ShowDialog ();
            }
        }

        void ag_AgregarEventHandler ( object sender, RoutedEventArgs e )
        {
            //Disparado el evento se creará un nuevo objeto MyData con el nombre y apellido que se ingresaron
            //en la Ventana hija.
            //Luego se agrega al dataGridView (Informacion) el objeto datos que creamos.
            MyData datos = new MyData () { nombre = ag.Nombre.Text.ToString (), apellido = ag.Apellido.Text.ToString () };
            Informacion.Items.Add ( datos );
        }

        private void Window_Closing ( object sender, System.ComponentModel.CancelEventArgs e )
        {
            //Al cerrar la ventana principal debemos validar que la referencia a la Ventana hija
            //se cierre para que el programa cierre completamente.
            ag.Close ();
        }
    }
}

Y el código de la segunda ventana o ventana hija.

namespace _2VentanasWPF
{
    /// <summary>
    /// Lógica de interacción para Agregar.xaml
    /// </summary>
    public partial class Agregar : Window
    {
        public Agregar ()
        {
            InitializeComponent ();
        }

        //Creamos nuestro evento que dispararemos cuando el usuario
        //agregue un nuevo dato
        public event RoutedEventHandler AgregarEventHandler;
        private void Agregar_Click ( object sender, RoutedEventArgs e )
        {
            //Validamos que haya ingresado al menos alguno de los dos campos (nombre, apellido).
            if ( Nombre.Text != string.Empty || Apellido.Text != string.Empty )
            {
                if ( AgregarEventHandler != null )
                {
                    //Disparamos el evento que hará que el dataGridView de la Ventana
                    //padre se actualice
                    AgregarEventHandler ( sender, e );
                }
                //Reinicializamos los valores de los textBox
                Nombre.Text = string.Empty;
                Apellido.Text = string.Empty;
            }
        }
    }
}

Aquí dejo el código completo del proyecto y una imagen de como queda el ejemplo. 2VentanasWPF.zip. Recuerda cambiar el formato .odt a .zip

Anuncios

6 Respuestas a “2 Ventanas usando WPF

  1. muchas gracias me ayudo mucho esta publicacion ! =D

  2. Hola jk. Pues la intención es seguir publicando pequeños proyectos para ayudar y a medida que vaya pasando el tiempo utilizar todos los proyectos en uno solo.

  3. hola ,te felicito por ayudar a los que aun no entendemosbien el codigo ..espero que nos sigas apoyando

  4. Hola como podría crear una ventana principal con un menu por ejemplo y cuadno habra la otra ventana siga apareciendo el mismo menu. Mejor dicho quisiera crear una pantalla y que las otras se habran sobre esa misma como un MDI. saludos y gracias…

  5. Gracias por tu aporte. Realmente me ha servido muchísimo. Un saludo.

  6. Gracias!!! sirve mucho!!

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s