Serialization and Deserialization in WinUI DataGrid (SfDataGrid)

24 May 202212 minutes to read

SfDataGrid allows you to serialize and deserialize the SfDataGrid settings using DataContractSerializer.

Serialization

You can serialize the SfDataGrid by using SfDataGrid.Serialize method which exports the current DataGrid control properties to an XML file.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
this.datagrid.Serialize(storageFile);

Serialization options

SfDataGrid serialization operation can be customized by passing SerializationOptions instance as an argument to Serialize method.

Serialize sorting

By default, SfDataGrid allows you to serialize the sorting operation. You can disable the sorting serialization by setting the SerializationOptions.SerializeSorting to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeSorting = false;
this.datagrid.Serialize(storageFile, options);

Serialize grouping

By default, SfDataGrid allows you to serialize the grouping operation. You can disable the grouping serialization by setting the SerializationOptions.SerializeGrouping to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeGrouping = false;
this.datagrid.Serialize(storageFile, options);

Serialize filtering

By default, SfDataGrid allows you to serialize the filtering operation. You can disable the filtering serialization by setting the SerializationOptions.SerializeFiltering to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeFiltering = false;
this.datagrid.Serialize(storageFile, options);

Serialize columns

By default, SfDataGrid allows you to serialize the columns manipulation operation. You can disable the columns serialization by setting the SerializationOptions.SerializeColumns to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeColumns = false;
this.datagrid.Serialize(storageFile, options);

Serialize summaries

By default, SfDataGrid allows you to serialize the caption summary, group summary and table summary settings in SfDataGrid.

You can disable the summaries serialization by setting SerializationOptions.SerializeCaptionSummary , SerializationOptions.SerializeGroupSummaries , SerializationOptions.SerializeTableSummaries properties to false

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeCaptionSummary = false;
options.SerializeGroupSummaries = false;
options.SerializeTableSummaries = false;
this.datagrid.Serialize(storageFile, options);

Serialize stacked headers

By default, SfDataGrid allows you to serialize the stack headers operation. You can disable the stack headers serialization by setting the SerializationOptions.SerializeStackedHeaders to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeStackedHeaders = false;
this.datagrid.Serialize(storageFile, options);

Serialize Details View

By default, SfDataGrid allows you to serialize the DetailsViewDefinition. You can disable the DetailsViewDefinition serialization by setting the SerializationOptions.SerializeDetailsViewDefinition to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeDetailsViewDefinition = false;
this.datagrid.Serialize(storageFile, options);

Serialize unbound rows

By default, SfDataGrid allows you to serialize the unbound rows settings. You can disable the unbound rows serialization by setting the SerializationOptions.SerializeUnBoundRows to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.CreateFileAsync("DataGrid.xml", CreationCollisionOption.ReplaceExisting);
SerializationOptions options = new SerializationOptions();
options.SerializeUnboundRows = false;
this.datagrid.Serialize(storageFile, options);

Deserialization

You can deserialize the SfDataGrid setting by using SfDataGrid.Deserialize method which reconstructs the SfDataGrid based on the setting in the stored XML file.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
this.datagrid.Deserialize(storageFile);

Deserialization options

Deserialization operation can be customized by passing DeserializationOptions instance as an argument to Deserialize method.

Deserialize sorting

By default, SfDataGrid allows you to deserialize the sorting operation. You can disable the sorting deserialization by setting the DeserializationOptions.DeserializeSorting to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeSorting = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize grouping

By default, SfDataGrid allows you to deserialize the grouping operation. You can disable the grouping deserialization by setting the DeserializationOptions.DeserializeGrouping to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeGrouping = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize filtering

By default, SfDataGrid allows you to deserialize the filtering. you can disable the filtering deserialization by setting DeserializationOptions.DeserializeFiltering to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeFiltering = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize columns

By default, SfDataGrid allows you to deserialize the columns manipulation operations. You can disable the columns deserialization by setting the DeserializationOptions.DeserializeColumns to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeColumns = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize summaries

By default, SfDataGrid allows you to deserialize the group summary, caption summary and table summary settings.

You can disable the summaries deserialization by setting DeserializationOptions.DeserializeCaptionSummary , DeserializationOptions.DeserializeGroupSummaries , DeserializationOptions.DeserializeTableSummaries properties to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeCaptionSummary = false;
options.DeserializeGroupSummaries = false;
options.DeserializeTableSummaries = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize stacked headers

By default, SfDataGrid allows you to deserialize the stack headers. You can disable the stacked headers deserialization by setting the DeserializationOptions.DeserializeStackedHeaders to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeStackedHeaders = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize Details View

By default, SfDataGrid allows you to deserialize the DetailsViewDefinition. You can disable the DetailsViewDefinition deserialization by setting the DeserializationOptions.DeserializeDetailsViewDefinition to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeDetailsViewDefinition = false;
this.datagrid.Deserialize(storageFile, options);

Deserialize unbound rows

By default, SfDataGrid allows you to deserialize the unbound rows settings. You can disable the unbound rows deserialization by setting the DeserializationOptions.DeserializeUnBoundRows to false.

var folder = ApplicationData.Current.LocalFolder;
var storageFile = await folder.GetFileAsync("DataGrid.xml");
DeserializationOptions options = new DeserializationOptions();
options.DeserializeUnboundRows = false;
this.datagrid.Deserialize(storageFile, options);

Customizing Serialization and Deserialization Operations

SfDataGrid allows you to customize the serialization and deserialization operations by deriving SerializationController class and override the necessary virtual methods.

Serializing template column content

By default, you cannot serialize the template content in SfDataGrid. This is the default behavior during Serialization and Deserialization operation.

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
            <!-- Other merged dictionaries here -->
        </ResourceDictionary.MergedDictionaries>
        <!-- Other app resources here -->
        <DataTemplate x:Key="cellTemplate">
            <Button Width="110" Content="{Binding Value}" />
        </DataTemplate>
    </ResourceDictionary>
</Application.Resources>


<dataGrid:SfDataGrid x:Name="dataGrid"
                    AutoGenerateColumns="False"
                    ItemsSource="{Binding Orders}">
    <dataGrid:SfDataGrid.Columns>
        <dataGrid:GridTemplateColumn CellTemplate="{StaticResource cellTemplate}"
                                HeaderText="Order ID"
                                MappingName="OrderID"
                                SetCellBoundValue="True" />        
    </dataGrid:SfDataGrid.Columns>
</dataGrid:SfDataGrid>

If you want to serialize and deserialize the template content, you have to reconstruct the same template during deserialization in RestoreColumnProperties method.

this.dataGrid.SerializationController = new SerializationControllerExt(this.dataGrid);

public class SerializationControllerExt : SerializationController
{
    public SerializationControllerExt(SfDataGrid grid)
    : base(grid)
    {

    }

    protected override void RestoreColumnProperties(SerializableGridColumn serializableColumn, GridColumn column)
    {
        base.RestoreColumnProperties(serializableColumn, column);
        if (column is GridTemplateColumn)
        {
            if (column.MappingName == "OrderID")
            {
                column.CellTemplate = Application.Current.Resources["cellTemplate"] as DataTemplate;
            }
        }
    }
}

NOTE

View sample in GitHub.