2012-05-19

Articles

ColumnSortBehavior

 

As soon a control has a header bar the corresponding column can be sorted after click on it. This behavior attaches this functionality to all controls with a GridViewHeaderRowPresenter.

 

alt

 

Usage

<UserControl x:Class="DW.Interactivity.Demo.ColumnSortBehaviorControl"
			 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
			 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
			 xmlns:Interactivity="http://schemas.my-libraries.de/wpf/interactivity">
	<UserControl.Resources>
		<DataTemplate x:Key="HeaderArrowUp">
			<Grid>
				<TextBlock Text="{Binding}" VerticalAlignment="Center" HorizontalAlignment="Center" />
				<Path StrokeThickness="0" SnapsToDevicePixels="True" Data="M 0,4 L 4,0 L 8,4 L 0,4"
					  Margin="0,-2,0,0" VerticalAlignment="Top" HorizontalAlignment="Center">
					<Path.Fill>
						<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
							<GradientStop Color="#FF3C5E72" Offset="0"/>
							<GradientStop Color="#FFC3E4F5" Offset="1"/>
						</LinearGradientBrush>
					</Path.Fill>
				</Path>
			</Grid>
		</DataTemplate>
		<DataTemplate x:Key="HeaderArrowDown">
			<Grid>
				<TextBlock Text="{Binding}" VerticalAlignment="Center" HorizontalAlignment="Center" />
				<Path StrokeThickness="0" SnapsToDevicePixels="True" Data="M 0,0 L 4,4 L 8,0 L 0,0"
					  Margin="0,-2,0,0" VerticalAlignment="Top" HorizontalAlignment="Center">
					<Path.Fill>
						<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
							<GradientStop Color="#FF3C5E72" Offset="0"/>
							<GradientStop Color="#FFC4E3F4" Offset="1"/>
						</LinearGradientBrush>
					</Path.Fill>
				</Path>
			</Grid>
		</DataTemplate>
		<DataTemplate x:Key="HeaderTransparent">
			<Grid>
				<TextBlock Text="{Binding}" VerticalAlignment="Center" HorizontalAlignment="Center" />
			</Grid>
		</DataTemplate>
	</UserControl.Resources>
	<ListView ItemsSource="{Binding Customers}"
			  Interactivity:ColumnSortBehavior.AllowColumnSortings="True"
			  Interactivity:ColumnSortBehavior.AscendingSortHeaderTemplate="{StaticResource HeaderArrowUp}"
			  Interactivity:ColumnSortBehavior.DescendingSortHeaderTemplate="{StaticResource HeaderArrowDown}"
			  Interactivity:ColumnSortBehavior.NeutralHeaderTemplate="{StaticResource HeaderTransparent}">
		<ListView.View>
			<GridView>
				<GridViewColumn Header="Name"
								Interactivity:ColumnSortBehavior.IsDefaultSortColumn="True"
								Interactivity:ColumnSortBehavior.SortPropertyName="Name"
								DisplayMemberBinding="{Binding Name}" />
				<GridViewColumn Header="Family Name"
								Interactivity:ColumnSortBehavior.SortPropertyName="FamilyName"
								DisplayMemberBinding="{Binding FamilyName}" />
			</GridView>
		</ListView.View>
	</ListView>
</UserControl>
using System.Windows.Controls;
using DW.Interactivity.Demo.Data;
using DW.SharpTools;

namespace DW.Interactivity.Demo
{
	public partial class ColumnSortBehaviorControl : UserControl
	{
		public ColumnSortBehaviorControl()
		{
			InitializeComponent();
			DataContext = this;

			Customers = new EnhancedObservableCollection<Customer>();
			Customers.AddRange(CustomerRepository.CreateDummyData());
		}

		public EnhancedObservableCollection<Customer> Customers { get; set; }
	}
}

 

 

Note

This control needs the DW.SharpTools.