Difference between revisions of "Property Based Content Sorting"
m |
m |
||
| Line 37: | Line 37: | ||
There is the possibility to sort at the point where you define your Collection View. This is especially useful for sorting Selective List items! An example is as follows: | There is the possibility to sort at the point where you define your Collection View. This is especially useful for sorting Selective List items! An example is as follows: | ||
<source lang = "xml"> | <source lang = "xml"> | ||
| + | xmlns:cv="using:UBIK.WinX.UI.CollectionView" | ||
| + | |||
<cv:ListCollectionView x:Key="SortedList" ItemsSource="{Binding EditDialogViewModel.PropertyItem, Converter={StaticResource SelectiveListToItemsConverter}}"> | <cv:ListCollectionView x:Key="SortedList" ItemsSource="{Binding EditDialogViewModel.PropertyItem, Converter={StaticResource SelectiveListToItemsConverter}}"> | ||
<cv:ListCollectionView.SortDescriptions> | <cv:ListCollectionView.SortDescriptions> | ||
Revision as of 09:36, 11 November 2020
A collection of property-based content sorting criteria can be applied to child object lists. Some common use cases are as follows.
- A user can click on a header to sort a child list based on a certain property's value;
- A customizer can create UI that presents such headers, each applying to a different property.
For example. One can customize the ChildArea template to include the following.
<Grid.Resources>
<converters:SortDirectionToSymbolConverter x:Key="SDToSymbolConverter" />
</Grid.Resources>
<Border Background="#8000488E" Visibility="{Binding Children.Sorting[SomePropertyName], Converter={StaticResource NullObjOrEmptyStrColConverter}}" />
<Border Background="#90707070" Visibility="{Binding Children.Sorting[SomePropertyName], Converter={StaticResource NullObjOrEmptyStrVisConverter}}" />
<Button FontFamily="Segoe MDL2 Assets"
Content="{Binding Children.Sorting[SomePropertyName], Converter={StaticResource SDToSymbolConverter}}"
Command="{Binding Children.SortByPropertyCommand}" CommandParameter="SomePropertyName" />
</Grid>
This is shown as a single header/button. The Command binding (SortByPropertyCommand) allows the child list to be sorted (ascending on the first click, descending on the second) by property "SomePropertyName" (case sensitive).
The binding on Content ensures the header displays a proper visual symbol. The ascending/descending/unsorted symbols can also be customized like the following if necessary.
The codes for different "Segoe MDL2 Assets" symbols can be found here.
 | The Borders in the example are not mandatory. They merely highlight the currently active sorting header/button, which could be useful when multiple headers are displayed. |
Collection View sorting
This functionality is documented in more detail on the wiki page Version 3.6 (WinX).
There is the possibility to sort at the point where you define your Collection View. This is especially useful for sorting Selective List items! An example is as follows:
<cv:ListCollectionView x:Key="SortedList" ItemsSource="{Binding EditDialogViewModel.PropertyItem, Converter={StaticResource SelectiveListToItemsConverter}}">
<cv:ListCollectionView.SortDescriptions>
<cv:SortDescriptions>
<cv:SortDescription Direction="Ascending" PropertyName="Value" />
</cv:SortDescriptions>
</cv:ListCollectionView.SortDescriptions>
</cv:ListCollectionView>
| This example can be found in the Lonza customising. |
