how to put array of user control in the columns of Grid - silverlight

Question

Hi I have array of Employee data which includes photo,description, title name,salary. I have to show each employee data in separate panel control structure that means if I have 10 employees there will be 10 panels. and I have to show these panels in a grid which has two columns. Also width of the panel in each column will vary according to main page size.

Answer 1

Why not represent the employee data with a separate userControl then use a Wrap panel to display the employees. This approach would handle a variable number of employees.
To better illustrate my idea here's some code:
The MainPage has a grid with a WrapPanel that fills the available space.
MainPage.xaml
<UserControl
x:Class="SilverlightApplication2.MainPage"
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:ct="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
mc:Ignorable="d">
<Grid x:Name="LayoutRoot" Background="WhiteSmoke">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="200"/>
<RowDefinition/>
<RowDefinition Height="200"/>
</Grid.RowDefinitions>
<ct:WrapPanel x:Name="panel1" Grid.Row="1" Grid.Column="1"
Background="Aqua" VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"/>
</Grid>
</UserControl>
MainPage.xaml.cs
public partial class MainPage : UserControl
{
public MainPage ()
{
InitializeComponent();
this.DataContext = this;
this.Loaded += new RoutedEventHandler( MainPage_Loaded );
}
void MainPage_Loaded ( object sender, RoutedEventArgs e )
{
for ( int x = 0; x <= 10; x++ )
{
panel1.Children.Add( new ChildControl() );
}
}
}
I am adding ChildWindow controls as defined below to show how the WrapPanel adapts the presentation of its children to the space available.
ChildWindow.xaml
<UserControl
x:Class="SilverlightApplication2.ChildControl"
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"
Width="100"
Height="100">
<Grid x:Name="LayoutRoot" Background="PowderBlue">
<TextBlock Text="ChildControl"/>
</Grid>
</UserControl>
If I've missed your point please give some more clarification.