How to bind to ColumnCollection for a GridView using XAML - wpf

I have a collection of objects which I would like to represent columns in a GridView.
Currently I am binding individual columns in my GridView to items in the collection like this:
<ListView>
<ListView.View>
<GridView>
<GridViewColumn Header="{Binding Path=MyColumns[0].Title}"></GridViewColumn>
<GridViewColumn Header="{Binding Path=MyColumns[1].Title}"></GridViewColumn>
<GridViewColumn Header="{Binding Path=MyColumns[2].Title}"></GridViewColumn>
</GridView>
</ListView.View>
</ListView>
This works well, but what I really want to do is to bind to the collection itself (since the number of items in the collection might change at run-time). I would like to accomplish this in XAML. What I have in mind is something like this (note this does not work - the ColumnsSource attribute is make-believe):
<ListView>
<ListView.View>
<GridView ColumnsSource="{Binding Path=MyColumns}">
</GridView>
</ListView.View>
</ListView>
Can this be done? If so, how?

You can use an attached property to create a ColumnsSource property, see this question for an example.

Related

Attach behavior to Items in GridView

I've got a ListView with a GridView used to present Items. ListView is defined like
<ListView ItemsSource={Binding ...}>
<ListView.View>
<GridView>
<GridViewColumn>...</GridViewColumn>
<GridViewColumn>...</GridViewColumn>
<GridViewColumn>...</GridViewColumn>
...
</GridView>
</ListView.View>
</ListView>
How can I attach custom behavior to each Item in the List (one behavior for all items)?
Thanks in advance!

How to show properties of a list in a list in a listview?

I am implementing an application in wpf , MVVM pattern.
I want to implement a listview with objects. These objects contains a list. On default this list contains only 1 object. But in the listview, I want to show that certain object. So the properties of the object in the list. This is my first problem.
But I also have to be able to have more objects in this list. My second problem is that i don't really know how to realise this? And i also have to show the properties of these objects in the listview.
Maybe a treeview? but i don't get how that i got to begin on this..
Someone with some ideas?
You can arbitrarily nest DataTemplates, e.g.
<ListView ItemsSource="{Binding Data}">
<ListView.View>
<GridView>
<GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}"/>
<!-- Internal Manchines list gets its own ListView -->
<GridViewColumn Header="Machines">
<GridViewColumn.CellTemplate>
<DataTemplate>
<ListView ItemsSource="{Binding Machines}">
<ListView.View>
<GridView>
<GridViewColumn Header="Model" DisplayMemberBinding="{Binding Model}"/>
<GridViewColumn Header="Manufacturer" DisplayMemberBinding="{Binding Manufacturer}"/>
</GridView>
</ListView.View>
</ListView>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="Occupation" DisplayMemberBinding="{Binding Occupation}"/>
<GridViewColumn Header="Status" DisplayMemberBinding="{Binding Status}"/>
</GridView>
</ListView.View>
</ListView>
This can be improved in terms of alignment, e.g. you could set up a Grid in the DataTemplate with a shared size column to make all lists the same width (making the internal columns align might be a bit hard though)
Further you could define a style to collapse empty lists (which otherwise would show the header without items).

How to get selected item of a nested listview?

i have a nested listview, i can bind the selected item of the basic listview to my viewmodel but not my selected item of the nested listview ( in the basic listview ) I just do:
this is my listview:
<ListView Height="155" ScrollViewer.CanContentScroll="True" ScrollViewer.VerticalScrollBarVisibility="Visible" dd:DragDrop.IsDragSource="True"
dd:DragDrop.IsDropTarget="False" Margin="24,506,280,169" Background="#CDC5CBC5"
dd:DragDrop.DropHandler="{Binding}" SelectedItem ="{Binding Path=SelectedCluster,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" ItemsSource="{Binding Path=Clusters,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}" >
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn Header="Titel" DisplayMemberBinding="{Binding Title}"/>
<GridViewColumn Header="Questions">
<GridViewColumn.CellTemplate>
<DataTemplate>
<ListView DataContext="{Binding}" ItemsSource="{Binding ExaminationQuestions}" SelectedItem="{Binding Path=SelectedExaminationQuestionInCluster,UpdateSourceTrigger=PropertyChanged,Mode=TwoWay}">
<ListView.View>
<GridView>
<GridViewColumn Header="Description" DisplayMemberBinding="{Binding Question.Description}"/>
</GridView>
</ListView.View>
</ListView>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>
Viewmodel:
public ExaminationQuestion SelectedExaminationQuestionInCluster
{
get { return selectedExaminationQuestionInCluster; }
set { selectedExaminationQuestionInCluster = value;
OnPropertyChanged("SelectedExaminationQuestionInCluster");
}
}
Someone who knows what i am doing wrong? If i set a breakpoint of the setter of selecteditem of the second listview. He just ignores that..
Thanks
My guess is the binding is probably incorrect. In your outer ListView, you bind to "Clusters". Your inner ListView is probably trying to bind to "SelectedExaminationQuestionInCluster" on the current Cluster. You can see if this is the case by using snoop. It's a valuable tool when debugging WPF apps. It will highlight broken bindings in red and tell you what's wrong with them.
If you want to bind to "SelectedExaminationQuestionInCluster" on the parent DataContext, you could use this syntax:
SelectedItem="{Binding Path=DataContext.SelectedExaminationQuestionInCluster,
ElementName=OuterListView}"
You'll have to give the outer ListView a name of course.
EDIT: I just realized this might not make sense. If each Cluster has its own collection of ExaminationQuestions, then each Cluster should also have a SelectedExaminationQuestion. The parent DataContext should not have any concept of a SelectedQuestion unless it is shared amongst all Clusters.

Sorting a ListView by deriving GridViewColumnHeader

I am trying to implement a ListView with a GridView with sortable columns.
To sort the ListView I hook up the Click event for the GridViewColumnHeaders and adding SortDescriptors to the default view source (similar to what is done in MSDN).
Something like this:
<ListView ItemsSource="MY ITEMS SOURCE BINDING">
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn DisplayMemberBinding="MY DISPLAYMEMBER BINDING">
<GridViewColumnHeader Content="My Header" Click="ColumnHeaderClicked"/>
This all works fine, but I would like to generalize it a bit. To do that I simply derived GridViewColumnHeader and wrote a click-handler. I know there are many sortable list view implementations out there typically deriving from ListView, but I was just wondering if this approach is possible.
Something like this:
<ListView ItemsSource="MY ITEMS SOURCE BINDING">
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn DisplayMemberBinding="MY DISPLAYMEMBER BINDING">
<local:SortableGridViewColumnHeader Content="My Header"/>
For this to work I need to navigate from the SortableGridViewColumnHeader code to the containing ListView in order to set new SortDescriptors.
I tried navigating up the Parent ladder, but the GridViewColumnHeader is not a visual child of my ListView. Surely I could make a dependency property and bind it to the ListView, but there must be a way to navigate to it instead.
How would I do that in code? (I am not looking for answers on how to sort a WPF ListViews in general, I am wondering if it can be done this way).
EDIT
It turned out that what I needed was this parent searcher in the click-handler of my GridViewColumnHeader derivative.
DependencyObject parent = this;
do
{
parent = VisualTreeHelper.GetParent(parent);
if (parent == null) return;
} while (!(parent is ListView));
Now my sorting works like a charm.
There is a much easier way to do that, using an attached property. Check out this article for details.
<ListView ItemsSource="{Binding Persons}"
IsSynchronizedWithCurrentItem="True"
util:GridViewSort.AutoSort="True">
<ListView.View>
<GridView>
<GridView.Columns>
<GridViewColumn Header="Name"
DisplayMemberBinding="{Binding Name}"
util:GridViewSort.PropertyName="Name"/>
<GridViewColumn Header="First name"
DisplayMemberBinding="{Binding FirstName}"
util:GridViewSort.PropertyName="FirstName"/>
<GridViewColumn Header="Date of birth"
DisplayMemberBinding="{Binding DateOfBirth}"
util:GridViewSort.PropertyName="DateOfBirth"/>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>

Multicolumn listview in WPF at design time

I might sound dumb here, but I want to do something really simple. At design time, I want to add columns to a listview control and add some data to it. I need to add combobox in each column of the listview. The thing I am not able to find is where to mention the column number in the listviewitem. Any help appreciated guys.
<ListView IsSynchronizedWithCurrentItem="True" Margin="8,68,304,188"
BorderThickness="2,2,2,2">
<ListView.View>
<GridView>
<GridViewColumn Width="150" Header="Column1"/>
<GridViewColumn Width="150" Header="Column2"/>
</GridView>
</ListView.View>
<ListViewItem>
</ListViewItem>
</ListView>
Each column in the listviewitem is rendered based on the GridView definition, so there is no real concept of column numbers. What you do is bind objects to the the listview's itemsource and it creates listviewitems from it. Thus, there are a few hoops to jump through.
This link has an example of how to do some simple object data binding. The advantage of this is what binding structure you have for design time can probably be reused for run-time if you set the datacontext/itemsource to an empty object instead of the static one in XAML.
If you're doing this to show examples or you just have a static data source that you want to use, I would recommend using the XmlDataProvider. Then you'd change your ListView to be like this,
<ListView IsSynchronizedWithCurrentItem="True" Margin="8,68,304,188"
BorderThickness="2,2,2,2">
<ListView.View>
<GridView>
<GridViewColumn Width="150" Header="Column1" DisplayMemberPath="{Binding XPath=/A/B}"/>
<GridViewColumn Width="150" Header="Column2" DisplayMemberPath="{Binding XPath=/A/C"/>
</GridView>
</ListView.View>
<ListViewItem>
</ListViewItem>
</ListView>

Resources