Question

What is the best way to display multidimensional data in WPF? I won’t know the size/shape of the data until runtime. Ideally I would like to use databinding but that is not a strict requirement. I was thinking some sort of grid but I don’t know how to dynamically bind to the data and have it figure out the number of rows and columns. Suggestions and examples please?

Answer 1

Sounds as though you want an Excel-like interface for 2D arrays with editing capability. For the other dimensions, you will have to come up with tabs or a series of comboboxes.

Check out the WPF Toolkit DataGrid. There is an option for auto generate columns. Experiment with that.

However, you will have some code behind to deal with the other dimensions since the Datagrid can only represent 2D data.

Corey

Edit: (04/28/2010) Here is a working solution.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Data;
using Microsoft.Windows.Controls;

namespace WpfApplication2
{
    public partial class MainWindow : Window
    {
    public List<List<object>> TheData { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        // Generate some random data
        Random r = new Random();

        TheData = new List<List<object>>
        {
            new List<object> { r.Next(100), r.Next(100), r.Next(100),r.Next(100) },
            new List<object> {  r.Next(100), r.Next(100), r.Next(100),r.Next(100) },
            new List<object> {  r.Next(100), r.Next(100), r.Next(100) },
            new List<object> {  r.Next(100), r.Next(100), r.Next(100),r.Next(100) },
            new List<object> {  r.Next(100), r.Next(100), r.Next(100),r.Next(100) },
            new List<object> {  r.Next(100), r.Next(100), r.Next(100),r.Next(100), r.Next(100) }
        };

        // Now bind data to the grid
        // We need at least one element
        if (TheData.Count > 0)
        {
            // Find the longest row so we create enough columns
            var max = TheData.Max(c => c.Count);

            for (var i = 0; i < max; i++)
            {
                TheGrid.Columns.Add(
                    new DataGridTextColumn
                    {
                        Header = string.Format("Column: {0:00}", i),
                        Binding = new Binding(string.Format("[{0}]", i))
                    }
                    );
            }
        }

        TheGrid.ItemsSource = TheData;
    }
}

}

The XAML…

<Window x:Class="WpfApplication2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/wpf/2008/toolkit"
    Title="GridTest">
<Grid x:Name="LayoutGrid">
    <toolkit:DataGrid x:Name="TheGrid"
                      AutoGenerateColumns="False"
                      IsReadOnly="False"
                      CanUserAddRows="False"/>
</Grid>

Some thing to note about this approach, if you allow editing of data and allow jagged arrays, you will need to new up a new List on the short rows.

As far as > 2D data, you will need some sort of option to select another dimension since the datagrid can only represent 2D data.