Manejo y vinculación de datos en WPF

1. Manejo y Vinculación de
Datos
D A N A E A G U I L A R G U Z M Á N .
M C P , M C T S
D A N A E A G U I L A R @ G M A I L . C O M

2. Contenido del Módulo
Lección 1. Plantillas de Datos
Lección 2. DataTrigger y MultiDataTrigger
Lección 3. El Datagrid de WPF
Lección 4. ObjectDataProvider y XmlDataProvider
Lección 5. Validación de datos

3. Lección 1. Plantillas de Datos
1. Implementando plantillas de datos
2. Usando plantillas con controles de ítems
3. DataTrigger y MultiDataTrigger

4. 1. Implementando plantillas
de datos
1. Definir el DataTemplate:
2. Aplicar el DataTemplate como ContentTemplate:
<DataTemplate>
<Label Content="{Binding Path=Nombre}"
BorderBrush="DarkBlue" Background="LightGreen"
BorderThickness="3" Foreground="Blue" />
</DataTemplate>
<Label Height="25" Name="label1" Width="150">
<Label.ContentTemplate>
<DataTemplate>
<!--Contenido del template-->
</DataTemplate>
</Label.ContentTemplate>
</Label>

5. 2. Usando plantillas con
controles de ítems
3. Aplicar el DataTemplate a la propiedad ItemTemplate:
<ListBox ItemsSource="{Binding}" Name="listBox1"
IsSynchronizedWithCurrentItem="True">
<ListBox.ItemTemplate>
<DataTemplate>
<!--Contenido del Template-->
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

6. Lección 2. DataTrigger y
MultiDataTrigger
1. DataTrigger
2. MultiDataTrigger

7. 1. DataTrigger
DataTrigger
Similar a Property Trigger pero la propiedad que monitorea usa
binding
En vez de la propiedad Property usa la propiedad Binding

8. 1. DataTrigger
DataTrigger
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Year}" Value="2011">
<Setter Property="Label.Background" Value="Red" />
</DataTrigger>
</Style.Triggers>

9. 2. MultiDataTrigger
MultiDataTrigger
<Style.Triggers>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding Path=Year}"
Value="2011" />
<Condition Binding="{Binding Path=Publisher}"
Value="Apress" />
</MultiDataTrigger.Conditions>
<MultiDataTrigger.Setters>
<Setter Property="Label.Background"
Value="Red" />
</MultiDataTrigger.Setters>
</MultiDataTrigger>
</Style.Triggers>

10. Lección 3. El Datagrid de WPF
1. El DataGridView de Windows Forms
2. El Datagrid de WPF
3. DataGridTemplateColumn
4. Estilos en el DataGrid

11. 1. El DataGridView de
Windows Forms
 Eficiente manejo de datos.
UI Poco customizable

12. 2. El Datagrid de WPF
 UI totalmente customizable.
Menor performance de datos.

13. 2. El Datagrid de WPF
 Validación, selección y estilo.

14. 2. El Datagrid de WPF
 Templates

15. 2. El Datagrid de WPF
• ItemsSource, para vincular los datos
En C#:
En XAML, (teniendo un DataContext):
• Crea automáticamente las columnas para los campos de la
colección. (Según el tipo)
miDataGrid.ItemsSource = libros;
<DataGrid ItemsSource="{Binding}"></DataGrid>

16. 2. El Datagrid de WPF
• Columnas personalizadas
<DataGrid AutoGenerateColumns="False"
ItemsSource="{Binding}">
<DataGrid.Columns>
<DataGridTextColumn Header="Materia"
Width="2*" Binding="{Binding Path=Nombre}" />
<DataGridTextColumn Header="Código de la Materia"
Width="1*" Binding="{Binding Path=Codigo}" />
</DataGrid.Columns>
</DataGrid>

17. 3. DataGridTemplateColumn
1. Definiendo los templates:
<Window.Resources>
<DataTemplate x:Key="cabecera">
<Label Background="Blue"
Foreground="Yellow" Content="{Binding}"/>
</DataTemplate>
<DataTemplate x:Key="celda">
<Button Foreground="Red"
Content="{Binding Path=Codigo}"/>
</DataTemplate>
<DataTemplate x:Key="celdaEditable">
<TextBox Background="Red"
Text="{Binding Path=Codigo}"/>
</DataTemplate>
</Window.Resources>

18. 3. DataGridTemplateColumn
2. Aplicando los templates:
<DataGridTemplateColumn
Header="Código de Materia"
HeaderTemplate="{StaticResource cabecera}"
CellTemplate="{StaticResource celda}"
CellEditingTemplate="{StaticResource celdaEditable}"/>

19. 4. Estilos en el DataGrid
• Estilos en el DataGrid:
<DataGrid.CellStyle>
<Style TargetType="DataGridCell">
<Setter Property="Foreground" Value="Green" />
<Setter Property="FontWeight" Value="Bold" />
</Style>
</DataGrid.CellStyle>

20. 4. Estilos en el DataGrid
• Estilos en las columnas:
<DataGridTextColumn Header="Materia"
Binding="{Binding Path=Nombre}" >
<DataGridTextColumn.EditingElementStyle>
<Style TargetType="TextBox">
<Setter Property="Foreground" Value="Red" />
</Style>
</DataGridTextColumn.EditingElementStyle>
<DataGridTextColumn.ElementStyle>
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="LightBlue" />
</Style>
</DataGridTextColumn.ElementStyle>
</DataGridTextColumn>

21. Lección 4. ObjectDataProvider
y XmlDataProvider
1. ObjectDataProvider
2. XmlDataProvider

22. 1. ObjectDataProvider
ObjectDataProvider:
Binding a métodos:<Window.Resources>
<ObjectDataProvider x:Key="miProviderMaterias"
ObjectType="{x:Type local:Estudiante}"
MethodName="GetMaterias">
<ObjectDataProvider.ConstructorParameters>
<system:String>Juanito</system:String>
</ObjectDataProvider.ConstructorParameters>
<ObjectDataProvider.MethodParameters>
<system:Int32>1</system:Int32>
<system:Int32>2012</system:Int32>
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
</Window.Resources>

23. 1. XmlDataProvider
XmlDataProvider:
Binding a archivos XML (Solo lectura)
XPath posible también en la vinculación:
<Window.Resources>
<XmlDataProvider x:Key="libros" Source="Books.xml"
XPath="Books" />
</Window.Resources>
<ListBox ItemsSource="{Binding Source={StaticResource libros},
XPath=Book[Year&gt;2009]}" DisplayMemberPath="Title" />

24. Lección 5. Validación de datos
1. Validación de entradas de usuario
2. Validación de datos
3. Reglas de validación

25. 1. Validación de entradas de
usuario
Implementando IDataErrorInfo
public class Estudiante : System.ComponentModel.IDataErrorInfo
{
public string Nombre { get; set; }
public string Apellido { get; set; }
public string Error
{
get { /*...*/ }
}
public string this[string columna]
{
get { /*...*/ }
}
}

26. 1. Validación de entradas de
usuario
La propiedad ValidatesOnDataErrors
Mostrando los errores:
<TextBox.Text>
<Binding Source="{StaticResource MiColeccion}"
Path="Nombre" UpdateSourceTrigger="LostFocus"
ValidatesOnDataErrors="True"/>
</TextBox.Text>
<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="true">
<Setter Property="ToolTip"
Value="{Binding RelativeSource={RelativeSource Self},
Path=(Validation.Errors)[0].ErrorContent}"/>
</Trigger>
</Style.Triggers>
</Style>

27. 2. Validación de datos
Validación de datos vinculados:
ExceptionValidationRule:
<TextBox>
<TextBox.Text>
<Binding Path="Propiedad1">
<Binding.ValidationRules>
<local:ReglaDeValidacion1 />
<local:ReglaDeValidacion2 />
</Binding.ValidationRules>
</Binding>
</TextBox.Text>
</TextBox>
<Binding Path="Propiedad1">
<Binding.ValidationRules>
<ExceptionValidationRule />
</Binding.ValidationRules>
</Binding>

28. 3. Reglas de validación
1. Heredando la clase Abstracta ValidationRule:
public class MiValidador : System.Windows.Controls.ValidationRule
{
public override ValidationResult Validate(object value,
System.Globalization.CultureInfo cultureinfo)
{
string cadena = value.ToString();
if (string.IsNullOrWhiteSpace(cadena))
{
return new ValidationResult(false, "La cadena no puede ser vacia");
}
return new ValidationResult(true, null);
}
}

29. 3. Reglas de validación
La propiedad NotifyOnValidationError:
1. Manejando el evento de error:
<Binding NotifyOnValidationError="True" Mode="TwoWay"
Source="{StaticResource MiColeccion}" Path="Nombre">
<Binding.ValidationRules>
<local:MiValidador/>
</Binding.ValidationRules>
</Binding>
<Grid Validation.Error="Grid_Error">
private void Grid_Error(object sender, ValidationErrorEventArgs e)
{
if (e.Action == ValidationErrorEventAction.Added)
MessageBox.Show(e.Error.ErrorContent.ToString());
else
System.Diagnostics.Trace.WriteLine("El error de validacion fue quitado");
}