Getting started with the DevExpress Grid Control for WPF - data binding 1

02 February 2009

I've started taking a more in-depth look at our WPF grid control, and I just thought I'd document some of the important steps I'm making for others to follow along. Please feel free to point me towards things that don't seem that easy to do - that's what I'm most interested in!

For a start, I'm just going to drop a grid control on a form and try to hook it up to data. Since this is WPF, there are of course numerous options for this. For my first test, I have a simple static collection of data in my application, which consists of objects with data about countries. The collection derives from a List<T>.

On my form, I've got a GridControl inside a DockPanel. I changed the standard layout panel (Grid) to a DockPanel, but otherwise I've left everything as it was after dropping the GridControl on the form. Here's the XAML code:

<Window x:Class="DxGrid1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="342" Width="534" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid">
    <DockPanel>
        <dxg:GridControl Name="gridControl1">
            <dxg:GridControl.Columns>
                <dxg:GridColumn FieldName="Column1" />
                <dxg:GridColumn FieldName="Column2" />
            </dxg:GridControl.Columns>
            <dxg:GridControl.View>
                <dxg:GridColumnView />
            </dxg:GridControl.View>
        </dxg:GridControl>
    </DockPanel>
</Window>

Now I would like to hook up the grid to my data source. I've got a class called CountryInfoList which just needs to be instantiated. An easy way to do this is of course to create a resource section entry, so I add a namespace line to my Window instantiation:

xmlns:local="clr-namespace:DxGrid1"

Then I configure the DataSource property of the grid to bind to the list instance from the resources:

DataSource="{StaticResource list}"

I also set the AutoPopulateColumns property to True and I remove the existing two empty columns. This last step is important - if the current column definition collides with the columns that are actually in the data source, the grid currently (that's on the 8.3 version I'm using) throws an exception. (I've registered a bug for this here.)

At this point the data from my list is already visible in the designer in Visual Studio. My complete XAML looks like this now:

<Window x:Class="DxGrid1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:DxGrid1"
    Title="Window1" Height="342" Width="534" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid">
    <Window.Resources>
        <local:CountryInfoList x:Key="list" />
    </Window.Resources>
    <DockPanel>
        <dxg:GridControl Name="gridControl1" AutoPopulateColumns="True" DataSource="{StaticResource list}">
            <dxg:GridControl.View>
                <dxg:GridColumnView />
            </dxg:GridControl.View>
        </dxg:GridControl>
    </DockPanel>
</Window>

As you see, a hookup to a simple object data source is very easy to do. Of course I could achieve the same result by setting the DataSource property from code - this would allow more flexibility regarding the actual source of my data, since the collection could be constructed more dynamically than the WPF resource system allows. A broad feature set is already supported at this point - sorting, column configuration, grouping.

Update: Here's the download of the source code for my project.

5 comment(s)
Kai Bøhli

Hi Oliver. Glad that DevEx has choosen to support WPF in XAF, which means that more people av DevEx is working on WPF - including you.

I would like to see custom templates for different scenarios. Like a "selected row" template which expands when the row is selected and display a custom contentcontrol for instance. I know how to do this with a listbox, but cannot do it with DXGrid.

Thanks in advance.

2 February, 2009
Thomas Grusche

Why DevEx WPF Grid don't inherits from ItemsControl?

3 February, 2009
Kai Bøhli

There is a sample of a rowtemplate in the lastest demo. This seems to cover some of my wishes.

4 February, 2009
WPF

This time I'm trying to use the DXGrid for WPF with XPO . There are at least two different approaches

5 February, 2009
WPF

Prompted by a forum post , I decided to have a look at how inplace editing works in the DXGrid for WPF

17 February, 2009

Please login or register to post comments.