In this video we'll look at how to get started using our WPF Grid Control.
It's a highly customizable WPF Control that can be bound to any object with and IEnumberable
interface.
I'll add it to an existing project and go over some basic features.
Here I've got a project that contains a Customer Class.
I'll use it as a data model for the application.
It has the standard fields associated with a customer and a static method that supplies
the data to the view model.
Let's build the application and go to the MainWindow.xaml.
Click the Window control to view its properties.
In "Common" tab, navigate to the DataContext property and press the "New" button.
Select the MainWindowViewModel from the list and click OK.
Now, let's add the Grid Control.
Open the Toolbox, locate the Data & Analytics tab and drag the Grid Control to the window.
Right-click the grid control and select "Layout->Reset All".
So the grid will fit the entire area Next, bind it to data.
From the smart tag, choose Customers as a Datasource and press OK.
The grid's now bound to the Customers field of the ViewModel.
Let's run the app and take a look.
Our Grid has a number of useful features right out of the box.
You can sort by clicking on the column's header.
And click again to reverse the sort order.
Users can clear the sort order in a column by clicking its header while holding the ctrl
button.
Users can also drag the columns and change their order.
You can filter through grid records as well.
The dropdown displays all the unique values within the chosen column.
For example, I can quickly find all the rows with the same Visits value.
Click the "Clear filter" button to view all the records.
For advanced filtering, use the built-in FilterEditor.
Let's create a simple criteria using the "is between" operator.
With Our Filter Editor, you can build complex criteria using the tree-like interface.
Click OK to apply the filter.
Let's go back to Visual Studio.
Let's go over some of the grid's properties.
Select the TableView element and navigate to the "Options Filter" Tab in the Properties
window.
Enable the "Show AutoFilterRow" option.
Run the app again and you'll see the auto filter row here above the grid's rows.
And as I type in a name here, you'll see that the grid automatically adjust to reflect only
those records with the same name.
I can filter values in the Visits column as well.
Press ctrl + F to show the built-in search panel.
You can search values within multiple columns.
You can also Group records within the grid.
End-users can simply drag a column to the group panel.
And data is grouped by that column.
We also have a great way to display concise information about groups of rows.
Let's go back to visual studio.
Select the Grid and look for "Data" tab in its properties.
I'll add a group summary to the Grid.
Click the Add button and choose the Count item in the "Summary Type" combo box and click
ok.
Run the app one last time and group the data against a column.
Now the Grid displays summaries for all of its groups.
You can also make summaries for all rows.
These are "Total Summaries".
To display a total summary for the particular column, use the context menu of the Total
Summary Panel.
So here we can see the number of rows in the grid, find the youngest person and calculate
the average Visits value.
And that's it for this video.
To learn more about our WPF products, make sure to check out the documentation on our
website.
Thanks for watching and thank you for choosing DevExpress.