![]() |
Web Development »
Silverlight »
Controls
Intermediate
License: The Code Project Open License (CPOL)
Silverlight Data Grid with Dynamic Multiple Row Column in HeaderBy Somnath PalCreating dynamic header for Silverlight DataGrid with multiple row/column |
C# (C# 3.0), .NET (.NET 3.0), Silverlight, Dev
|
||||||||
|
Advanced Search |
|
|
|
||||||||||||||||
I was developing a product in 2006 and one of the requirement was to create a Data Grid with mutiple columns and rows in the header. In my previous article Dynamic Multiple Row Column Grid Header I have presented the idea I have used. Last few months I was exploring Silverlight and I was wondering how the same can be achieved using Silverlight Data Grid. I searched internet looking for a solusion but couldn't find any. So I came up with a very crude way to do this. I am looking for any better solution. Also another feature I wanted is to export the same in Excel. At this point I don't know how to do that.
So the goal of this experiment is to achieve the following output using Silverlight Data Grid.
I have used the similar technique as decribed in my previous article to calculate the row and column span of the headers. I am skipping the logic here. This time I also need a footer. So the approach I have taken is that I will create a Grid of MxN size dynamically. M will be no of header rows plus 1 for the data grid plus 1 for the footer i.e. M = No of header rows + 2. N will be equal to number of data grid columns. I will put the footer details in last row of the grid, Data Grid in the last but 1 row of the grid and all the header items in the remaining rows with approprite row and col span.
I have used the same 3 classes (described in the previous article) to parse the header string and create the collection to render.
Hard coded strings are used in the above functions. In real appliction the methods can get the data from database or any other source.
The xaml code is simple as generated by Visual Studio. All the work is done dynamically in the code behind.
Following Member variables are defined in the code behind
DataGrid grdData = new DataGrid() { AutoGenerateColumns = false };
bool bGridInitialized = false;
List Headers = null;
Three methods are defined in the code behind
In the method InitUI()
A) Header is parsed and stored in Headers collection
String[] ColHeaders = SalseData.GetSalseDataColumnHeader().Split(',');
Headers = dynHead.ParseHeader();
B) Data Grid columns are created and data source added
foreach (String col in ColHeaders)
{
String[] colHeader = col.Split('|');
grdData.Columns.Add(new DataGridTextColumn { Header = colHeader[0],
Binding = new System.Windows.Data.Binding(colHeader[1]),
IsReadOnly = true });
}
grdData.ItemsSource = SalseData.GetSalseData();
C) Grid rows are created
In the method grdData_LayoutUpdated()
A) Grid Columns are created
for (int i = 0; i < grdData.Columns.Count; i++)
{
DataGridColumn dgc = grdData.Columns[i];
LayoutRoot.ColumnDefinitions.Add(...);
}
B) AddHeaderTextBlock method is called to add the header and footer text
C) Data grid is positioned
In the method AddHeaderTextBlock()
Border with proper border thickness and text block with header text are added to the appropriate cell of the grid
Initial version.
| You must Sign In to use this message board. | |||||||||||||||
|
|||||||||||||||
|
|||||||||||||||
|
|||||||||||||||
|
|||||||||||||||
General
News
Question
Answer
Joke
Rant
Admin
|
PermaLink |
Privacy |
Terms of Use
Last Updated: 15 Dec 2008 Editor: |
Copyright 2008 by Somnath Pal Everything else Copyright © CodeProject, 1999-2009 Web18 | Advertise on the Code Project |