Silverlight – ListBox
”;
Listbox is a control that provides a list of items to the user for selection of an item. A user can select one or more items from a predefined list of items at a time. In a ListBox, multiple options are always visible to the user without any user interaction.
A Listbox presents a scrollable list of items. If a user selects an item, the selected item changes appearance to indicate selection. It supports a more extensive form of content model and Button. A major difference between a button and a list box is that a button contains a single piece of content whereas a listbox allows every single item in the list.
The hierarchical inheritance of ListBox class is as follows −
Given below are the commonly used Properties of ListBox class.
| Sr. No. | Property & Description |
|---|---|
| 1 |
Background Gets or sets a brush that provides the background of the control. (Inherited from Control) |
| 2 |
BorderThickness Gets or sets the border thickness of a control. (Inherited from Control) |
| 3 |
FontFamily Gets or sets the font used to display text in the control. (Inherited from Control) |
| 4 |
FontSize Gets or sets the size of the text in this control. (Inherited from Control) |
| 5 |
FontStyle Gets or sets the style in which the text is rendered. (Inherited from Control) |
| 6 |
FontWeight Gets or sets the thickness of the specified font. (Inherited from Control) |
| 7 |
Foreground Gets or sets a brush that describes the foreground color. (Inherited from Control) |
| 8 |
GroupStyle Gets a collection of GroupStyle objects that define the appearance of each level of groups. (Inherited from ItemsControl) |
| 9 |
Height Gets or sets the suggested height of a FrameworkElement. (Inherited from FrameworkElement) |
| 10 |
HorizontalAlignment Gets or sets the horizontal alignment characteristics that are applied to a FrameworkElement when it is composed in a layout parent, such as a panel or items control. (Inherited from FrameworkElement) |
| 11 |
IsEnabled Gets or sets a value indicating whether the user can interact with the control. (Inherited from Control) |
| 12 |
Item Gets the collection used to generate the content of the control. (Inherited from ItemsControl) |
| 13 |
ItemsSource Gets or sets an object source used to generate the content of the ItemsControl. (Inherited from ItemsControl) |
| 14 |
Margin Gets or sets the outer margin of a FrameworkElement. (Inherited from FrameworkElement) |
| 15 |
Name Gets or sets the identifying name of the object. When a XAML processor creates the object tree from XAML markup, run-time code can refer to the XAML-declared object by this name. (Inherited from FrameworkElement) |
| 16 |
Opacity Gets or sets the degree of the object”s opacity. (Inherited from UIElement) |
| 17 |
SelectedIndex Gets or sets the index of the selected item. (Inherited from Selector) |
| 18 |
SelectedItem Gets or sets the selected item. (Inherited from Selector) |
| 19 |
SelectedValue Gets or sets the value of the selected item, obtained by using the SelectedValuePath. (Inherited from Selector) |
| 20 |
Style Gets or sets an instance Style that is applied for this object during layout and rendering. (Inherited from FrameworkElement) |
| 21 |
VerticalAlignment Gets or sets the vertical alignment characteristics that are applied to a FrameworkElement when it is composed in a parent object such as a panel or items control. (Inherited from FrameworkElement) |
| 22 |
Width Gets or sets the width of a FrameworkElement. (Inherited from FrameworkElement) |
Given below are the most commonly used Events of ListBox.
| Sr. No. | Event & Description |
|---|---|
| 1 |
DragEnter Occurs when the input system reports an underlying drag event with this element as the target. (Inherited from UIElement) |
| 2 |
DragLeave Occurs when the input system reports an underlying drag event with this element as the origin. (Inherited from UIElement) |
| 3 |
DragOver Occurs when the input system reports an underlying drag event with this element as the potential drop target. (Inherited from UIElement) |
| 4 |
DragStarting Occurs when a drag operation is initiated. (Inherited from UIElement) |
| 5 |
Drop Occurs when the input system reports an underlying drop event with this element as the drop target. (Inherited from UIElement) |
| 6 |
DropCompleted Occurs when a drag-and-drop operation is ended. (Inherited from UIElement) |
| 7 |
GotFocus Occurs when a UIElement receives focus. (Inherited from UIElement) |
| 8 |
IsEnabledChanged Occurs when the IsEnabled property changes. (Inherited from Control) |
| 9 |
KeyDown Occurs when a keyboard key is pressed while the UIElement has focus. (Inherited from UIElement) |
| 10 |
KeyUp Occurs when a keyboard key is released while the UIElement has focus. (Inherited from UIElement) |
| 11 |
LostFocus Occurs when a UIElement loses focus. (Inherited from UIElement) |
| 12 |
SelectionChanged Occurs when the currently selected item changes. (Inherited from Selector) |
| 13 |
SizeChanged Occurs when either the ActualHeight or the ActualWidth property changes value on a FrameworkElement. (Inherited from FrameworkElement) |
Given below are the most commonly used Methods of ListBox.
| Sr. No. | Method & Description |
|---|---|
| 1 |
Arrange Positions child objects and determines a size for a UIElement. Parent objects that implement custom layout for their child elements should call this method from their layout override implementations to form a recursive layout update. (Inherited from UIElement) |
| 2 |
FindName Retrieves an object that has the specified identifier name. (Inherited from FrameworkElement) |
| 3 |
Focus Attempts to set the focus on the control. (Inherited from Control) |
| 4 |
GetValue Returns the current effective value of a dependency property from a DependencyObject. (Inherited from DependencyObject) |
| 5 |
IndexFromContainer Returns the index to the item that has the specified, generated container. (Inherited from ItemsControl) |
| 6 |
OnDragEnter Called before the DragEnter event occurs. (Inherited from Control) |
| 7 |
OnDragLeave Called before the DragLeave event occurs. (Inherited from Control) |
| 8 |
OnDragOver Called before the DragOver event occurs. (Inherited from Control) |
| 9 |
OnDrop Called before the Drop event occurs. (Inherited from Control) |
| 10 |
OnKeyDown Called before the KeyDown event occurs. (Inherited from Control) |
| 11 |
OnKeyUp Called before the KeyUp event occurs. (Inherited from Control) |
| 12 |
OnLostFocus Called before the LostFocus event occurs. (Inherited from Control) |
| 13 |
ReadLocalValue Returns the local value of a dependency property, if a local value is set. (Inherited from DependencyObject) |
| 14 |
SetBinding Attaches a binding to a FrameworkElement, using the provided binding object. (Inherited from FrameworkElement) |
| 15 |
SetValue Sets the local value of a dependency property on a DependencyObject. (Inherited from DependencyObject) |
Let us look at a simple example in which different UI elements are added in a ListBox.
<UserControl x:Class = "ListBoxExample.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"
mc:Ignorable = "d" d:DesignWidth = "640" d:DesignHeight = "480">
<Grid x:Name = "LayoutRoot">
<ListBox x:Name = "myList">
<TextBlock Text = "First item" />
<Button Content = "Second item" />
<Path Fill = "Blue" Data = "M4,0 l-4,10 8,0z M15,0 l-4,10 8,0z M26,0 l4,10 8,0z"
Margin = "10" />
<StackPanel Orientation = "Horizontal">
<Ellipse Fill = "Red" Height = "30" Width = "100" />
<TextBlock Text = "Name: " />
<TextBox Width = "200" />
</StackPanel>
<TextBlock Text = "More..." />
</ListBox>
</Grid>
</UserControl>
Given below is the C# implementation.
using System.Windows.Controls;
namespace ListBoxExample {
public partial class MainPage : UserControl {
public MainPage() {
InitializeComponent();
myList.Items.Add("String entry");
myList.Items.Add(new Button { Content = "Content entry" });
}
}
}
When the above code is compiled and executed, you will see a list box which contains mixture of graphics text and also an editable field where you can type the text.
| Sr. No. | Controls & Description |
|---|---|
| 1 | Calendar & DatePicker
Calendar & DatePicker represents a control that enables a user to select a date by using a visual calendar display. It provides some basic navigation using either the mouse or the keyboard. |
| 2 | TabControl
A container that places items into separate tabs and allows the user to view just one tab at a time. It allows the user to select from a number of different views by clicking on the tab headers. |
| 3 | Popup
This class displays the content on top of the existing content, within the bounds of the application window. It is a temporarily display on the other content. |
| 4 | ToolTip
Tooltip represents a control that creates a pop-up window that displays information for an element in the GUI. Silverlight lets you attach a tooltip to any control. |
”;