Creating and Assigning Views

• Jun 07, 2019

You can specify the GridControl‘s view by assigning one of the following objects to the GridControl.View property.

• TableView
• TreeListView
• CardView

Note

The GridControl uses TableView by default.

Assigning a View at Design-Time

The following example shows how to assign a TreeListView to the grid control using XAML.

XAML

<dxg:GridControl ItemsSource="{Binding Employees}">
    <dxg:GridControl.View>
        <dxg:TreeListView KeyFieldName="ID" ParentFieldName="ParentID"/>
    </dxg:GridControl.View>
    <dxg:GridColumn FieldName="Name"/>
    <dxg:GridColumn FieldName="Position"/>
    <dxg:GridColumn FieldName="Department"/>
</dxg:GridControl>

The following image demonstrates the result.

Assigning a View at Run-Time

The following example shows how to assign a CardView to the grid control in code.

C#

using DevExpress.Xpf.Grid;

// ...
public Window1() {
    InitializeComponent();
    grid.View = CreateCardView();
    grid.DataSource = new nwindProductsDataSetTableAdapters.ProductsTableAdapter().GetData();
}
private CardView CreateCardView() {
    CardView view = new CardView() {
        NavigationStyle = GridViewNavigationStyle.Cell,
        AllowGrouping = false,
        ShowColumnHeaders = false
    };
    return view;
}

VB.NET

Imports DevExpress.Xpf.Grid

Class Window1
    Public Sub New()
        InitializeComponent()
        grid.View = New CardView() With {.NavigationStyle = GridViewNavigationStyle.Cell, _
                                   .AllowGrouping = False, .ShowColumnHeaders = False}
        grid.DataSource = New nwindDataSetTableAdapters.CustomersTableAdapter().GetData()
    End Sub
End Class

The following image demonstrates the result.