Практикум
Элемент ListBox
Добавляем новый пользовательский элемент управления ListBoxControl.xaml (Add/New Item). Размещаем его в каталоге \Controls.
Добавим стандартный элемент ListBox:
<ListBox
x:Name="_listbox"
Margin="0,0,-2,0"
HorizontalAlignment="Center"
VerticalAlignment="Bottom">
Width="229"
Height="230"
<StackPanel Orientation="Horizontal">
<Image Height="100" Width="100" Source="1.jpg"/>
<TextBlock
Text="Ferrari F430"
HorizontalAlignment="Right"
VerticalAlignment="Center"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<Image Height="100" Width="100" Source="2.jpg"/>
<TextBlock
Text="Fisker Karma"
HorizontalAlignment="Right"
VerticalAlignment="Center"/>
</StackPanel>
<StackPanel Orientation="Horizontal">
<Image Height="100" Width="100" Source="3.jpg"/>
<TextBlock
Text="Lamborghini Murcielago LP 640"
HorizontalAlignment="Right"
VerticalAlignment="Center"/>
</StackPanel>
</ListBox>И добавим 3 пункта, с помощью шаблона. Шаблон содержит элемент <StackPanel/>, который содержит рисунок <Image/> и текст <TextBlock/>.
Добавляем страницу ListBoxPage.xaml для размещения этого элемента, страницу поместим в каталог \Views проекта.
На странице ListBoxPage.xaml добавляем пространство имен класса SilverlightControls:
xmlns:local="clr-namespace:SilverlightControls"
и в сетку страницы сам элемент управления ListBox:
<local:ListBoxControl
VerticalAlignment="Top"
HorizontalAlignment="Center"/>После компиляции проекта мы увидим список автомобилей с их изображениями:
Заключение
На данном практическом занятии мы научились создавать пользовательские элементы управления на основе стандартных элементов, входящих в состав Silverlight framework. Увидели как любой элемент может содержать внутри себя другие вложенные элементы (шаблоны), а также, применили стиль к элементу управления.