Introducing CollectionView for WinForms
CollectionView is a highly effective component for organizing data. By using CollectionView, you get a powerful implementation of the ICollectionView interface (originally part of WPF) which is essentially a view of the underlying data source. It provides methods for filtering, grouping, and sorting data asynchronously.
C1CollectionView is already available in ComponentOne Studio for UWP and based on the immense popularity, latest release of ComponentOne Studio brings it to WinForms edition too. Yes! You read right. Now, you can just drag and drop any data aware UI control, bind it to CollectionView, and let it deliver functionalities you've always wanted (like grouping, filtering, and sorting).
Why C1CollectionView?
Data collections in WinForms doesn't support features like sorting, filtering, and grouping. This is where CollectionView comes into play, as it acts as a wrapper class around these data collections to provide the missing functionality.
Key Features
- Sorting, filtering, and grouping
The C1CollectionView class and C1WrapCollectionView are powerful classes and support the most desired functionalities: sorting, filtering, and grouping.
- Current record management
CollectionView has CurrentItem property and CurrentPosition method to get the item and position respectively. Also, there are many methods exposed that enables changing the item currently active.
- Asynchronous operations
The above methods are written asynchronously so there are no bottlenecks. This enhances the overall responsiveness of the application.
- Optimized performance
CollectionView enables high optimization while performing data transformation like sorting, filtering, and grouping on large datasets.
- Integrates with any data driven control
CollectionView fully implements ICollectionView, so any data aware controls can use it as the DataSource.
- Incremental data loading that increases performance
While scrolling, it loads data incrementally that optimizes the performance.
- No learning curve needed
C1CollectionView implements C1.CollectionView.ICollectionView which is ComponentOne's implementation of WPF's ICollectionView. So, there is virtually no learning curve.
CollectionView for WinForms: Use Case
To see how CollectionView facilitates organizing data, let's take a scenario where one wants to present a list of YouTube videos. The videos belong to many different channels, authors, categories, etc. The viewer should be able to sort the videos on parameters like Date, channel title, etc. and group them based on his interests (like trending or channel title). Also, to look out for a particular video, the viewer should have the option of filtering the videos.
In this scenario, we'll take standard ListView for displaying the list of videos, as it's flexible and supports the easy display of list items with icon.
Here, each video is a list item of ListView control. The list is currently grouped and sorted on Channel Title field. Also, the list can be filtered by typing keywords in the textbox at top.
Getting Started with the CollectionView
The addition of sorting, filtering, and grouping functionalities through CollectionView can be divided into the following parts:
- Adding necessary assemblies
- Creating & populating CollectionView
- Adding sort, filter and group functions
1. Adding necessary assemblies
As CollectionView is a non-UI component, you won't find it in Visual Studio's ToolBox. So, the first step towards using it is to add the C1.CollectionView library in your project. It performs all of the work you'd associate with a .NET style CollectionView.
After this, you'll also need to add another library C1.Win.CollectionView that exposes IBindingList interface so it can be used in WinForms controls.
2. Creating & populating CollectionView
To create CollectionView, we'll need to instantiate the C1CollectionView class available in C1.CollectionView assembly. This class takes a data source and enables filtering, sorting & grouping operations.
Here, we'll be assuming that we already have the videos information from YouTube stored in a dataset. If you are not sure on how to do that, please refer to MSDN.
ObservableCollection<YouTubeVideo> _videos;
C1CollectionView<YouTubeVideo> _collectionView = new C1CollectionView<YouTubeVideo>(_videos);
CollectionView is now populated and ready to bind the UI control (here ListView). For this we'll use ListView's SetItemsSource method.
listView.SetItemsSource(_collectionView, "Title", "Thumbnail");
3. Adding sort, filter, and group functions
It's the easiest to add group, sort, and filter functions using CollectionView. See how:
- Grouping: It's one of the most desired functionalities, and with CollectionView can be achieved using single line code.
To group videos according to the channel, we'd invoke CollectionView's GroupAsync method. This method has various overloads that accept group descriptions, group fields, etc., and you can choose any one as per your requirement.
await _collectionView.GroupAsync(v => v.ChannelTitle);
- Sorting: It makes the data more organized by systematically arranging the items. To sort the videos according to the channel, call the SortAsync method passing the sort path and sort direction, as follows:
await _collectionView.SortAsync(v => v.ChannelTitle, direction == SortDirection.Ascending ? SortDirection.Descending : SortDirection.Ascending);
- Filtering: While viewing large datasets, it's common to filter them based on interests. To find a particular video, enter filter string in an input control like TextBox and pass it as a parameter while invoking CollectionView's FilterAsync method in the TextChanged event.
private async void filterTextBox_TextChanged(object sender, EventArgs e)
{
await _collectionView.FilterAsync(filterTextBox.Text);
}
A working illustration of CollectionView can be downloaded here.
In this article, we answered the what, why, and how aspects of the CollectionView in WinForms. Let us know if you'd like us to discuss any other aspects in the comments below.
Ruchir Agarwal