Para desarrollar aplicaciones WPF siguiendo el patrón MVVM, el framwork MVVMLight proporciona herramientas esenciales. Este artículo explora la integración y uso básico de MVVMLight en un proyecto WPF.

Integración de MVVMLight en el proyecto

Puede añadir MVVMLight a través del gestor de paquetes NuGet. Al instalar el paquete, se generan automáticamente archivos iniciales en el proyecto, incluyendo una carpeta ViewModel con clases base.

Si se presentan errores de referencia, asegúrese de que los espacios de nombres estén correctamente importados en los archivos relevantes.

Estructura de Modelo-Vista-ViewModel

El patrón MVVM divide la aplicación en tres componentes principales: Modelo para datos, Vista para la interfaz de usuario y ViewModel para la lógica de negocio. Es recomendable organizar el código en carpetas separadas para cada capa.

Modelo

El Modelo representa los datos de la aplicación. Debe heredar de ObservableObject para notificar cambios en las propiedades a la interfaz de usuario.

using GalaSoft.MvvmLight;

namespace EjemploWPF.Modelos
{
    public class PersonaModelo : ObservableObject
    {
        private int _identificador;

        public int Identificador
        {
            get => _identificador;
            set
            {
                _identificador = value;
                RaisePropertyChanged(() => Identificador);
            }
        }

        private string _nombreCompleto;

        public string NombreCompleto
        {
            get => _nombreCompleto;
            set
            {
                _nombreCompleto = value;
                RaisePropertyChanged(() => NombreCompleto);
            }
        }
    }
}

La herencia de ObservableObject permite que las propiedades disparen eventos PropertyChanged, lo cual es crucial para la sincronización con la Vista.

ViewModel

El ViewModel gestiona la lógica de negocio y expone datos a la Vista. Hereda de ViewModelBase, que a su vez proporciona soporte para notificaciones de cambios.

using GalaSoft.MvvmLight;
using EjemploWPF.Modelos;

namespace EjemploWPF.ViewModels
{
    public class PersonaViewModel : ViewModelBase
    {
        public PersonaViewModel()
        {
            if (IsInDesignMode)
            {
                Persona = new PersonaModelo { Identificador = 1, NombreCompleto = "Ana García" };
            }
            else
            {
                // Simulación de carga de datos
                Persona = new PersonaModelo { Identificador = 2, NombreCompleto = "Carlos López" };
            }
        }

        public PersonaModelo Persona { get; set; }
    }
}

En el constructor, se instancia el Modelo según el modo de ejecución (diseño o tiempo de ejecución).

Vista

La Vista define la interfaz de usuario en XAML y enlaza datos con el ViewModel. Para vincular la Vista al ViewModel, se establece el DataContext en el código subyacente.

// En el código subyacente de la Vista (por ejemplo, MainWindow.xaml.cs)
public MainWindow()
{
    InitializeComponent();
    DataContext = new PersonaViewModel();
}

Los controles XAML enlazan propiedades del ViewModel mediante enlaces de datos, como {Binding Persona.Identificador}.

ViewModelLocator y registro de instancias

El ViewModelLocator actúa como un localizador de ViewModels, facilitando la inyección de dependencias. Se registra como un recurso global en App.xaml.

<Application.Resources>
    <vm:ViewModelLocator x:Key="Locator" />
</Application.Resources>

Dentro del ViewModelLocator, se registran instancias de ViewModels para su uso en toda la aplicación.

using GalaSoft.MvvmLight.Ioc;

namespace EjemploWPF.ViewModels
{
    public class ViewModelLocator
    {
        public ViewModelLocator()
        {
            SimpleIoc.Default.Register<PersonaViewModel>();
        }

        public PersonaViewModel PersonaVM => SimpleIoc.Default.GetInstance<PersonaViewModel>();
    }
}

Al acceder a la propiedad del ViewModelLocator, se obtiene la instancia única del ViewModel registrado, lo que simplifiac la gestión de dependencias.