In my efforts to “MVVM-ify” my WPF application as much as possible, I ran into the need to Data Bind the Columns Collection of a DataGrid.
After some searching on StackOverflow, I found a neat solution by David Osborn;
http://stackoverflow.com/questions/3065758/wpf-mvvm-datagrid-dynamic-columns
This solution was in C#, so I converted it to VB;
Imports System.Collections.ObjectModel
Imports System.Collections.Specialized
Namespace Controls
Public NotInheritable Class DataGridExtension
Private Sub New()
End Sub
Public Shared Function GetColumns(obj As DependencyObject) As ObservableCollection(Of DataGridColumn)
Return DirectCast(obj.GetValue(ColumnsProperty), ObservableCollection(Of DataGridColumn))
End Function
Public Shared Sub SetColumns(obj As DependencyObject, value As ObservableCollection(Of DataGridColumn))
obj.SetValue(ColumnsProperty, value)
End Sub
Public Shared ReadOnly ColumnsProperty As DependencyProperty = DependencyProperty.RegisterAttached("Columns", _
GetType(ObservableCollection(Of DataGridColumn)), _
GetType(DataGridExtension), _
New UIPropertyMetadata(New ObservableCollection(Of DataGridColumn)(), AddressOf OnDataGridColumnsPropertyChanged))
Private Shared Sub OnDataGridColumnsPropertyChanged(ByVal d As DependencyObject, ByVal e As DependencyPropertyChangedEventArgs)
If d.GetType = GetType(DataGrid) Then
Dim myGrid As DataGrid = TryCast(d, DataGrid)
Dim Columns As ObservableCollection(Of DataGridColumn) = DirectCast(e.NewValue, ObservableCollection(Of DataGridColumn))
If Columns IsNot Nothing Then
myGrid.Columns.Clear()
If Columns IsNot Nothing AndAlso Columns.Count > 0 Then
For Each dataGridColumn As DataGridColumn In Columns
myGrid.Columns.Add(dataGridColumn)
Next
End If
AddHandler Columns.CollectionChanged, Sub(sender As Object, args As NotifyCollectionChangedEventArgs)
If args.NewItems IsNot Nothing Then
For Each column As DataGridColumn In args.NewItems.Cast(Of DataGridColumn)()
myGrid.Columns.Add(column)
Next
End If
If args.OldItems IsNot Nothing Then
For Each column As DataGridColumn In args.OldItems.Cast(Of DataGridColumn)()
myGrid.Columns.Remove(column)
Next
End If
End Sub
End If
End If
End Sub
End Class
End Namespace
Then, in order to use the above, make sure you include the namespace in your XAML resources, for instance;
xmlns:w="clr-namespace:MyApplication1.Controls"
Then add the following to your DataGrid;
w:DataGridExtension.Columns="{Binding Path=DataContext.DataGridColumns, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
Also, make sure you set AutoGenerateColumns to False.
Then go ahead and add you property in your View Model;
''' <summary>
''' The DataGrid Columns
''' </summary>
''' <value></value>
''' <returns></returns>
''' <remarks></remarks>
Property DataGridColumns As ObservableCollection(Of DataGridColumn) Implements Interfaces.iMasterDetailsViewModel(Of T).DataGridColumns
Get
Return _DataGridColumns
End Get
Set(value As ObservableCollection(Of DataGridColumn))
If value.Equals(_DataGridColumns) = False Then
_DataGridColumns = value
OnPropertyChanged("DataGridColumns")
End If
End Set
End Property
You can then add a bunch of columns as follows;
Dim cols As New ObservableCollection(Of DataGridColumn)
Dim col As New DataGridTextColumn
cols.Add(New DataGridTextColumn With {.Binding = New System.Windows.Data.Binding("Customer_Code"), .Header = "Customer Code", .Width = 100})
cols.Add(New DataGridTextColumn With {.Binding = New System.Windows.Data.Binding("Name"), .Header = "Name", .Width = 250})
DataGridColumns = cols
Seems like quite a nice neat solution.
However, do bear in mind that, as Rakshit Bakshi points out in the answer;
“The above code will do the work in general case. However, it will fail when you hide the datagrid and make it visible again. Because the columns property will show that there are 0 columns when they are hidden and as the columns property is changed, the callback will be fired and it will try to add the columns again, but physically columns does exist in the datagrid so the code will fail with an exception saying can't add duplicate columns.”
