WPF 4.5: Live Shaping

Live Shaping

live shaping

Properties required for Live Shaping

  1. IsLiveFiltering = true;  
  2. LiveFilteringProperties.Add("Value");  
Example Live Sorting

In the following example, we have created a class named student. The class implements an INotifyPropertyChanged interface and is used for the Property’s value changes. Also a StudentCollection was created that populates the student information at runtime. On a Window_Loaded event we created an object of StudentCollection that is already populated with the student information and binds it with a dataGrid.

Also created a:
  1. DispatcherTimer dispTimer = new DispatcherTimer();  
The dispatcher times that will update the Price property after a specific duration? On the click on the button the Sorting will start. It uses the following programming features: 
  • ICollectionView: Enable collections to apply Custom Sorting, Filtering and Grouping.

  • ICollectionViewLiveShaping: Defining Sorting, Grouping, Filtering on ColectionView in Real Time.
  1. public class Student : INotifyPropertyChanged  
  2. {  
  3.    int _StudentId;  
  4.    public int StudentId  
  5.    {  
  6.       get { return _StudentId; }  
  7.       set  
  8.       {  
  9.          _StudentId = value;  
  10.          OnPropertychanged("StudentId");  
  11.       }  
  12.    }  
  13.   
  14.    string _StudentName;  
  15.    public string StudentName  
  16.    {  
  17.       get { return _StudentName; }  
  18.    set  
  19.       {  
  20.          _StudentName = value;  
  21.          OnPropertychanged("StudentName");  
  22.       }  
  23.    }  
  24.   
  25.   
  26.    string _StudentCity;  
  27.    public string StudentCity  
  28.    {  
  29.       get { return _StudentCity; }  
  30.       set  
  31.       {  
  32.          _StudentCity = value;  
  33.       OnPropertychanged("StudentCity");  
  34.       }  
  35.    }  
  36.   
  37.    decimal _StudentFee;  
  38.    public decimal StudentFee  
  39.    {  
  40.       get { return _StudentFee; }  
  41.       set  
  42.       {  
  43.          _StudentFee = value;  
  44.          OnPropertychanged("StudentFee");  
  45.       }  
  46.    }  
  47.   
  48.     
  49.    public event PropertyChangedEventHandler PropertyChanged;  
  50.    private void OnPropertychanged(string pName)  
  51.    {  
  52.       if (PropertyChanged != null)  
  53.       {  
  54.          PropertyChanged(thisnew PropertyChangedEventArgs(pName));  
  55.       }  
  56.    }  
  57.   
  58. }  
  59. public class StudentCollection : ObservableCollection<Student>  
  60. {  
  61.    public StudentCollection()  
  62.    {  
  63.       Add(new Student() { StudentId = 1,StudentName = "Pete Brown", StudentCity = "Chicago", StudentFee = 100 });  
  64.       Add(new Student() { StudentId = 2, StudentName = "Mikey Aurthor", StudentCity = "Phoenix", StudentFee = 150 });  
  65.       Add(new Student() { StudentId = 3, StudentName = "Dyna Mike", StudentCity = "Chicago", StudentFee = 800 });  
  66.       Add(new Student() { StudentId = 4, StudentName = "Rachel Dave", StudentCity = "Phoenix", StudentFee = 200 });  
  67.       Add(new Student() { StudentId = 5, StudentName = "Nikky Chre", StudentCity = "Phoenix", StudentFee = 180 });  
  68.       Add(new Student() { StudentId = 6, StudentName = "Karl Nas", StudentCity = "Chicago", StudentFee = 2200 });  
  69.       Add(new Student() { StudentId = 7, StudentName = "Bruce Wayne", StudentCity = "Seattle", StudentFee = 100 });  
  70.       Add(new Student() { StudentId = 9, StudentName = "Johan Surg", StudentCity = "Austin", StudentFee = 300 });  
  71.       Add(new Student() { StudentId = 10, StudentName = "Tony ", StudentCity = "Austin", StudentFee = 300 });  
  72.       Add(new Student() { StudentId = 11, StudentName = "Peterson J", StudentCity = "Seattle", StudentFee = 300 });  
  73.       Add(new Student() { StudentId = 12, StudentName = "Jack Russel", StudentCity = "Chicago", StudentFee = 300 });  
  74.    }  
  75. }  
XAML Design
  1. <Window x:Class="Wpf_Live_Shaping.LiveSorting"  
  2.         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  3.         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
  4.         Title="LiveSorting" Height="400" Width="500" Loaded="Window_Loaded">  
  5.     <Grid>  
  6.         <DataGrid Name="DGData" Margin="10,40,10,10"></DataGrid>  
  7.         <Button Content="Start Sorting" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="75" Click="ButtonStartSirting_Click"/>  
  8.         <Button Content="Stop Sorting" HorizontalAlignment="Left" Margin="100,10,0,0" VerticalAlignment="Top" Width="75" Click="ButtonStopSorting_Click"/>  
  9.   
  10.     </Grid>  
  11. </Window>  
Code Behind
  1. public partial class LiveSorting : Window  
  2. {  
  3.    DispatcherTimer dispTimer = new DispatcherTimer();  
  4.    ObservableCollection<Student> ListStudent = new ObservableCollection<Student>();  
  5.    public LiveSorting()  
  6.    {  
  7.       InitializeComponent();  
  8.    }  
  9.   
  10.    private void Window_Loaded(object sender, RoutedEventArgs e)  
  11.    {  
  12.       var studentCollection = new StudentCollection();  
  13.       DGData.ItemsSource = studentCollection;  
  14.       Random random = new Random();  
  15.       var Students = new StudentCollection();  
  16.       foreach (var item in Students)  
  17.       {  
  18.          ListStudent.Add(new Student()  
  19.          {  
  20.             StudentId = item.StudentId,  
  21.             StudentName = item.StudentName,  
  22.             StudentCity = item.StudentCity,  
  23.             StudentFee = item.StudentFee  
  24.          });  
  25.       }  
  26.       DGData.ItemsSource = ListStudent;  
  27.    }  
  28.   
  29.    void dispTimer_Tick(object sender, EventArgs e)  
  30.    {  
  31.       Random random = new Random();  
  32.       foreach (var pc in ListStudent)  
  33.       {  
  34.          pc.StudentFee += random.Next(100) - 5;  
  35.       }  
  36.    }  
  37.   
  38.    private void ButtonStartSirting_Click(object sender, RoutedEventArgs e)  
  39.    {  
  40.       ICollectionView pView = CollectionViewSource.GetDefaultView(ListStudent);  
  41.       pView.SortDescriptions.Add(new SortDescription("StudentFee", ListSortDirection.Ascending));  
  42.       var productview = (ICollectionViewLiveShaping)CollectionViewSource.GetDefaultView(ListStudent);  
  43.       productview.IsLiveSorting = true;  
  44.       dispTimer.Interval = TimeSpan.FromMilliseconds(600);  
  45.       dispTimer.Tick += dispTimer_Tick;  
  46.       dispTimer.Start();  
  47.    }  
  48.   
  49.    private void ButtonStopSorting_Click(object sender, RoutedEventArgs e)  
  50.    {  
  51.       dispTimer.Stop();  
  52.   
  53.    }  
  54. }  
Result

live sorting

live sorting image

table

Example Live Filtering

In this example we will filter information that exists in a datagrid on the basis of StudentCity.

XAML Design
  1. <Grid>  
  2.         <Grid.RowDefinitions>  
  3.             <RowDefinition  Height="100*"></RowDefinition>  
  4.         </Grid.RowDefinitions>  
  5.         <Grid.ColumnDefinitions>  
  6.             <ColumnDefinition  Width="80*"></ColumnDefinition>  
  7.             <ColumnDefinition  Width="30*"></ColumnDefinition>  
  8.         </Grid.ColumnDefinitions>  
  9.   
  10.         <DataGrid Name="DGData" Margin="10,40,10,10" Grid.Row="0" Grid.Column="0"></DataGrid>  
  11.         <ListBox x:Name="lstCity"   
  12.                  Height="160" Grid.Row="0" Grid.Column="1"   
  13.                  SelectionChanged="lstCity_SelectionChanged"/>  
  14.     </Grid>  
Code Behind
  1. public partial class LiveFilterWindow : Window  
  2. {  
  3.         StudentCollection Students;  
  4.         List<string> Cities;  
  5.         public string CityName { getset; }  
  6.         public LiveFilterWindow()  
  7.         {  
  8.             InitializeComponent();  
  9.         }  
  10.   
  11.         private void Window_Loaded(object sender, RoutedEventArgs e)  
  12.         {  
  13.             Students = new StudentCollection();  
  14.             DGData.ItemsSource = Students;  
  15.   
  16.             Cities = Students.Select(d => d.StudentCity).Distinct().ToList();  
  17.             lstCity.ItemsSource = Cities;  
  18.   
  19.         }  
  20.   
  21.         private void lstCity_SelectionChanged(object sender, SelectionChangedEventArgs e)  
  22.         {  
  23.             ListCollectionView studentView = CollectionViewSource.GetDefaultView(DGData.ItemsSource) as ListCollectionView;  
  24.             studentView.IsLiveFiltering = true;  
  25.             studentView.LiveFilteringProperties.Add("StudentCity");  
  26.             CityName = lstCity.SelectedItem.ToString();  
  27.             studentView.Filter = new Predicate<object>(IsCityFound);  
  28.             studentView.Refresh();  
  29.         }  
  30.   
  31.         bool IsCityFound(object d)  
  32.         {  
  33.             bool result = false;  
  34.             Student std = d as Student;  
  35.             if (std.StudentCity == CityName)  
  36.             {  
  37.                 result = true;  
  38.             }  
  39.             return result;  
  40.         }  
  41.     }  
Output

chicago

seattle

chicago filter