How to dynamically insert rows in Silverlight 3 datagrid with different header/column layout?

Question

Say I have the DataGrid control from Silverlight 3 and I want to dynamically create some free space between two rows to show more details. How can I do that?

Header1 | Header2 | Header3 | Header4
-------------------------------------
Cell1     Cell2     Cell3     Cell4
Cell5     Cell6     Cell7     Cell8
Cell9     Cell10    Cell11    Cell12

for example, shall become:

Header1 | Header2 | Header3 | Header4
-------------------------------------
Cell1     Cell2     Cell3     Cell4
Cell5     Cell6     Cell7     Cell8
   Foo1    Foo2
   Foo3    Foo4
Cell9     Cell10    Cell11    Cell12

Note that the two newly inserted "rows", may have different column count and may be different types of controls. In other words the inserted items may be perhaps another single control altogether.

Is this even possible with the DataGrid control? Perhaps someone has some clever idea. Thanks a lot!

Answer 1

You will need a collection of the type class (i.e Cell) with a property .Foos collection exposed on the cell. (example properties in short hand)

Class Foo
   Property FooName as String
End Class

Class Cell
   Property CellName as String
   ReadOnly Property Foos as Generic.List(of Foo)
End Class

---

 <DataTemplate x:Key="MyTemplate">
   <TextBlock Text={Binding CellName}" />
   <StackPanel ItemSource="{Binding Foos}">
       <StackPanel.ItemTemplate>
           <DataTemplate>
               <TextBlock Text="{Binding FooName}" />
           <DataTemplate>
       <StackPanel.ItemTemplate>
   </StackPanel>
</DataTemplate>

And on your DataGrid for those cells, you could have the CellTemplate set to MyTemplate. For those cells with an empty Foos collection, the Foos won't show up.