This article demonstrates how to host various child controls
within a ListBox control in Silverlight.
Adding child controls to a ComboBox is similar to adding any
item to a ListBox. The ListBox.Items represents a collection of items of a ListBox.
We can use ListBox.Items.Add() method to add an object to a ListBox. This
object item can be a text, control or any other object.
The code snippet in Listing 12 adds a string, a Button, a
TextBlock, a DateTime, a Rectangle, and a Panel with child controls to a ListBox.
// Add a String
listBox1.Items.Add("ListBox
with Child Controls");
// Add a Button
Button btn = new Button();
btn.Height = 50;
btn.Width = 150;
btn.Content = "Click
ME";
btn.Background = new
SolidColorBrush(Colors.Orange);
btn.Foreground = new
SolidColorBrush(Colors.Black);
listBox1.Items.Add(btn);
// Create a TextBlock and Add it to
ListBox
TextBlock textBlockItem = new TextBlock();
textBlockItem.TextAlignment = TextAlignment.Center;
textBlockItem.FontFamily = new
FontFamily("Georgia");
textBlockItem.FontSize = 14;
textBlockItem.FontWeight = FontWeights.ExtraBold;
textBlockItem.Text = "Hello!
I am a text block.";
// Add TextBlock to ListBox
listBox1.Items.Add(textBlockItem);
// Add a DateTime to a ListBox
DateTime dateTime1 = new DateTime(2010,
10, 12, 8, 15, 55);
listBox1.Items.Add(dateTime1);
// Add a Rectangle to a ListBox
Rectangle rect1 = new
Rectangle();
rect1.Width = 50;
rect1.Height = 50;
rect1.Fill = new SolidColorBrush(Colors.Red);
listBox1.Items.Add(rect1);
// Add a panel that contains child
controls
TextBlock textBlock1 = new TextBlock();
textBlock1.TextAlignment = TextAlignment.Center;
textBlock1.Text = "Panel
with child controls";
Ellipse ellipse1 = new Ellipse();
ellipse1.Width = 50;
ellipse1.Height = 50;
ellipse1.Fill = new
SolidColorBrush(Colors.Green);
StackPanel ListBoxPanel = new StackPanel();
ListBoxPanel.Width = 200;
ListBoxPanel.Background = new
SolidColorBrush(Colors.Yellow);
ListBoxPanel.Children.Add(textBlock1);
ListBoxPanel.Children.Add(ellipse1);
// Add Panel to ListBox
listBox1.Items.Add(ListBoxPanel);
listBox1.SelectedIndex = 0;
listBox1.Padding = new
Thickness(0);
listBox1.MaxWidth = 200;
The ListBox with child controls looks like following.
Using this same
approach, you can add any controls to a ListBox. Also, keep in mind, these item
controls can work independently. For example, if you need to add an event to
the Button control in a ListBox, you may.