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

WPF Team Blog
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.

9 comment(s)
Kai Bøhli
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 1
Thomas Grusche 1

Why DevEx WPF Grid don't inherits from ItemsControl?

3 February, 2009
Kai Bøhli
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
Anonymous
WPF

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

5 February, 2009
Anonymous
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
Customer91771
Customer91771

Hi Oliver,


I see in the image blue color column headings but in the code it's not there


Can you help me to do that


Thank you.

22 August, 2019
Oliver Sturm (DevExpress)
Oliver Sturm (DevExpress)

Hi - I don't think I activated this theme on purpose back then (over ten years ago, when I wrote this post!), but it looks like "DeepBlue" to me. Please check the list of WPF themes here: https://documentation.devexpress.com/WPF/7407/Common-Concepts/Themes/List-of-DevExpress-WPF-Themes - you can also find links on that page for further details.


Oliver

22 August, 2019
Customer91771
Customer91771

Okay, Thank you.

I am new to DevExpress with WPF.

Can you please guide me or give the steps to add theme to WPF Application?


It will be helpful to me,


Thank you.

22 August, 2019
Customer91771
Customer91771

I understood, Very simple.



Thank you.

22 August, 2019

Please login or register to post comments.