"Grid version" of the answer:
(see list version below)
As the question has changed (clarified) I am adding a new answer. The first one is still useful for those that only want lists so I will leave it there.
To do a similar thing with grids you don't expose the templates as datagrid columns are not templated (they are lists of controls, which can individually be templated).
Instead you expose the left grid and right grid column collections as properties and simply set the LeftColumns and RightColumns properties of the control in your parent page. The only trick is that the datagrid-column collections have no setter so you need to update the grid collections items from the new property collections:
The code-behind is now:
using System.Collections.ObjectModel;
using System.Windows.Controls;
namespace SilverlightApplication1
{
public partial class GridSelectionControl : UserControl
{
public GridSelectionControl()
{
InitializeComponent();
}
public ObservableCollection<DataGridColumn> LeftColumns
{
get
{
return leftDataGrid.Columns;
}
set
{
leftDataGrid.Columns.Clear();
foreach (var col in value)
{
leftDataGrid.Columns.Add(col);
}
}
}
public ObservableCollection<DataGridColumn> RightColumns
{
get
{
return rightDataGrid.Columns;
}
set
{
rightDataGrid.Columns.Clear();
foreach (var col in value)
{
rightDataGrid.Columns.Add(col);
}
}
}
}
}
The Xaml of the control is now:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" x:Class="SilverlightApplication1.GridSelectionControl"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<sdk:DataGrid x:Name="leftDataGrid" Margin="10" AutoGenerateColumns="False"/>
<sdk:DataGrid x:Name="rightDataGrid" Margin="10" Grid.Column="2" AutoGenerateColumns="False"/>
<StackPanel Grid.Column="1" Orientation="Vertical">
<Button Content="Add >" Height="23" HorizontalAlignment="Left" Width="75" Margin="10" />
<Button Content="< Remove" Height="23" HorizontalAlignment="Left" Width="75" Margin="10" />
</StackPanel>
</Grid>
</UserControl>
The Xaml of the test page (which defines the columns) is now:
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SilverlightApplication1" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
mc:Ignorable="d"
x:Class="SilverlightApplication1.TestGridSelectionControl"
d:DesignWidth="640" d:DesignHeight="480">
<Grid x:Name="LayoutRoot">
<local:GridSelectionControl x:Name="SelectionControl">
<local:GridSelectionControl.LeftColumns>
<sdk:DataGridCheckBoxColumn Header="Machine?" Binding="{Binding IsMachine}"/>
<sdk:DataGridTextColumn Header="First Name" Binding="{Binding FirstName}"/>
<sdk:DataGridTextColumn Header="Last Name" Binding="{Binding LastName}"/>
</local:GridSelectionControl.LeftColumns>
<local:GridSelectionControl.RightColumns>
<sdk:DataGridCheckBoxColumn Header="Machine?" Binding="{Binding IsMachine}"/>
<sdk:DataGridTextColumn Header="First Name" Binding="{Binding FirstName}"/>
<sdk:DataGridTextColumn Header="Last Name" Binding="{Binding LastName}"/>
</local:GridSelectionControl.RightColumns>
</local:GridSelectionControl>
</Grid>
</UserControl>
And the test code-behind is now:
using System.Collections.ObjectModel;
using System.Windows.Controls;
namespace SilverlightApplication1
{
public partial class TestGridSelectionControl : UserControl
{
public TestGridSelectionControl()
{
// Required to initialize variables
InitializeComponent();
SelectionControl.leftDataGrid.ItemsSource = Person.People;
SelectionControl.rightDataGrid.ItemsSource = Person.Machines;
}
public class Person
{
public string FirstName { get; set; }
public string LastName { get; set; }
public bool IsMachine { get; set; }
public Person(string firstname, string lastname, bool robot)
{
this.FirstName = firstname;
this.LastName = lastname;
this.IsMachine = robot;
}
public static ObservableCollection<Person> People = new ObservableCollection<Person>()
{
new Person("Tom", "Jones", false),
new Person("Elis", "Presley", false),
new Person("Joe", "Blogs", false)
};
public static ObservableCollection<Person> Machines = new ObservableCollection<Person>()
{
new Person("Marvin", "Android", true),
new Person("Hal", "9000", true),
new Person("B", "9", true)
};
}
}
}
