ObjectDataProvider – Parte II (final)

Esta es la segunda de dos partes de este tutorial, Este es el enlace a la primera parte.

En esta parte del tutorial, usaremos Blend para arrastrar un ListView y, crearemos el ObjectDataProvider que encapsulará la clase PersonaBinding.

Parte I: Consumir los datos

  1. Abrimos nuestra solución en Blend, y nos vamos a la ventana principal del proyecto WPF (referencia: Window1.xaml).
  2. Arrastramos un ListBox sobre nuestra ventana y lo llamaremos lsbPersonas, en las propiedades del ListBox buscamos ItemSource y seleccionamos DataBinding
  3. Ahora, Blend nos muestra una ventana de donde podemos escoger la fuente de datos para nuestro control, puede ser XML o CLR, en este caso seleccionamos CLR.
  4. La siguiente ventana muestra una lista de todos los objetos que se encuentran en los ensamblados referenciados por el proyecto WPF, buscamos y seleccionamos la clase PersonaBinding y la nombramos PersonasDS, luego presionamos OK.
  5. Regresamos a la ventana anterior, en el panel derecho debemos seleccionar el miembro de donde se leerán los datos, para este ejemplo seleccionamos la propiedad Items, luego presionamos OK.

Lo que acabamos de hacer es decirle a Blend que existe un ObjectDataProvider llamada PersonasDS que expone la clase PersonasBinding y, que nuestro ListView leerá los datos de la propiedad Items

Pueden ver el XAML de su ventana y encontrarán algo como:

 <Window.Resources>
 <ObjectDataProvider x:Key="PersonasDS" d:IsDataSource="True" ObjectType="{x:Type PersonasWpf:PersonasBinding}"/>
 </Window.Resources>
...
<ListBox Visibility="Visible" x:Name="lsbPersonas" Width="Auto"ItemsSource="{Binding Path=Items, Mode=Default, Source={StaticResource PersonasDS}}" IsSynchronizedWithCurrentItem="True"/>

Una vez creado el PersonasDS, lo podemos reutilizar en mas controles de la misma ventana, por ejemplo un combo.

Si se dan cuenta, en el diseñador, el ListBox se llena con los datos de ejemplo, y cuando la ejecutan se cargan los datos de la base de datos.

Parte II: Buscar datos.

La última parte de este tutorial consiste en implementar un buscador sencillo, estilo Spotlight o DesktopSearch, lo que vamos a hacer es agregar una caja de texto a nuestra ventana, y filtraremos los datos del ListBox según el contenido del TextBox:

Agregamos un TextBox a la ventana, lo llamaremos txtBuscar.

Creamos un manejador para el evento TextChanged y vamos a Visual Studio para escribir el código necesario. De forma general, esto es lo que tenemos en el XAML: Un ListBox que está enlazado a la propiedad Items de un ObjectDataProvider llamado PersonasDS que es de tipo ClienteBinding. Por el lado del CLR no tenemos ningún objeto hasta ahora, y lo que necesitamos hacer es filtrar esa lista de Items, para eso tenemos que referenciar al objeto PersonasDS que creamos en el XAML.

Debemos crear una variable de instancia de tipo PersonasDataBinding donde guardaremos la referencia a PersonasDS:

PersonasBinding listaClientes;

Luego, en el constructor buscamos el recurso llamado PersonasDS y lo convertimos al tipo PersonasBinding:

ObjectDataProvider odp = this.Resources["PersonasDS"] as ObjectDataProvider;
 listaClientes = odp.Data as PersonasBinding;

Ahora ya tenemos un objeto llamado listaClientes que representa los datos que están enlazados al ListBox, el paso final es ir al manejador del evento TextChanged del TextBox y escribir:

private void txtBuscar_TextChanged(object sender, System.Windows.Controls.TextChangedEventArgs e)
 {
 listaClientes.Filtrar(txtBuscar.Text);
 }

Gracias al milagro del paso de datos por referencia y al ObjectDataProvider, enlazamos un control ListBox a una clase del CLR e implementamos de una forma sencilla un buscador.

Notas finales:

Como les había mencionado en un principio, este tutorial se enfoca en partes específicas y se salta algunas cosas de la implementación que no apoyan tanto a la idea principal, pero al final de cuentas se obtiene algo funcional y útil que demuestra como aprovechar esta tecnología.

Con gusto responderé inquietudes sobre este tema (comentarios).

:: Fin de la Transmisión ::

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

A %d blogueros les gusta esto: