Страничная модель оконного интерфейса WPF и элементы управления содержимым (стр. 5 )

<Label>Строка 4</Label>

</StackPanel>

</ListBox>

В этом примере элемент <StackPanel> становится элементом списка, содержащегося в ListBoxItem.

Обработку элементов списка lb1 обеспечивает код:

private void lb1_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

if (!(lb1.SelectedItem == null))

{

switch (lb1.SelectedIndex)

{

case 0: MessageBox. Show("Инструментальные"); break;

case 1: MessageBox. Show("Средства"); break;

case 2: MessageBox. Show("Разработки"); break;

case 3: MessageBox. Show("Программ"); break;

}

Эта разметка создаёт список, который иллюстрирует рисунок 3.8.

Рисунок 3.8

Чтобы использовать большинство возможностей любого наследника ItemsControl, необходимо использовать привязку данных.

3.2.5 Элементы с заголовками являются наследниками класса HeaderedltemsControl, который унаследован от ItemsControl. Классы, унаследованные от HeaderedltemsControl, перечислены в таблице 3.6.

Таблица 3.6

Класс	Описание
MenuItem	Классы меню Menu и ContextMenu содержат элементы типа MenuItem. Элементы меню могут быть подключены к командам, поскольку класс MenuItem реализует интерфейс ICommandSource.
TreeViewItem	Элементы TreeViewItem соответствуют элементам иерархии класса TreeView.
ToolBar	Это контейнер, содержащий в себе группу элементов управления, обычно в виде элементов Button и Separator. Элемент ToolBar можно поместить внутрь ToolBarTray, который способен упорядочивать элементы ToolBar.

3.2.6 Добавление декораций к одиночному элементу осуществляется с помощью класса Decorator -базового класса, имеющего наследников, таких как Border, ViewBox и BulletDecorator.

НЕ нашли? Не то? Что вы ищете?

В приведённом ниже примере демонстрируется применение Border, ViewBox и BulletDecorator, результат которого показан на рисунке 3.9.

<Label>Строка 1</Label>

</Border>

Рисунок 3.9

Элемент <Border> декорирует элемент дочерний элемент, добавляя вокруг него рамку. Можно определять кисть и толщину рамки, фон, радиус закругления углов, а также поля его дочерних элементов.

<Viewbox> растягивает и сжимает свои дочерние элементы до размеров доступного пространства. Свойства StretchDirection и Stretch специфичны для функциональности <Viewbox>. Эти свойства позволяют устанавливать, должен ли растягиваться дочерний элемент в обоих направления, и будут ли сохранены пропорции:

<Label>Строка 2</Label>

</Viewbox>

Класс <BulletDecorator> декорирует свой дочерний элемент специальной меткой (Bullet). Дочерним элементом <BulletDecorator. Child> может быть любой элемент (в данном примере - <ComboBox> с именем cb1). Метка также может быть любым элементом. В примере применяется <Label> с именем label, но допускается любой элемент UIElement.

<BulletDecorator. Bullet>

<Label Name="label">Декорируем строку</Label>

</BulletDecorator. Bullet>

<BulletDecorator. Child>

<ComboBoxItem>Размер 16</ComboBoxItem>

<ComboBoxItem>Красный цвет</ComboBoxItem>

<ComboBoxItem>Жирный</ComboBoxItem>

<ComboBoxItem>Восстановить</ComboBoxItem>

</ComboBox>

</BulletDecorator. Child>

</BulletDecorator>

Программный код обработки события дочернего элемента декоратора приводится ниже:

private void cb1_SizeChanged(object sender, SizeChangedEventArgs e)

{

if (cb1.SelectedIndex == 0)

label. FontSize = 16;

if (cb1.SelectedIndex == 1)

label. Foreground = new SolidColorBrush(Colors. Red);

if (cb1.SelectedIndex == 2)

label. FontWeight = FontWeights. Bold;

if (cb1.SelectedIndex == 3)

{

label. FontSize = 12;

label. Foreground = new SolidColorBrush(Colors. Black);

label. FontWeight = FontWeights. Normal;

}

На этапе выполнения декоратор позволяет изменить внешнее оформление метки, как иллюстрирует рисунок 3.10.

Рисунок 3.10

Декоратор - это разновидность элемента, которая обычно используется для добавления некоторого графического оформления другого элемента. Все декораторы наследуются от класса System. Windows. Controls. Decorator.

Большинство декораторов создано специально для оформления определённого рода элементов управления. Например, Button использует декоратор ButtonChrome, чтобы создать оригинальные скруглённые углы и фон с тенью, а ListBox использует декоратор ListBoxChrome.

3.3 Лабораторная работа №3 «Создание многостраничных приложений WPF с элементами управления содержимым»

3.3.1 Целью выполнения лабораторной работы является приобретение практических навыков по разработке приложений WPF, использующих многостраничный интерфейс и элементы управления содержимым.

В методических указаниях рассматриваются примеры программирования свойств и методов объектов классов NavigationWindow (элемент <NavigationWindow>), Page (элемент <Page>), Frame (элемент <Frame>), а также наиболее часто используемые элементы управления.

3.3.2 Пример создания простого многостраничного приложения с помощью элементов <Page>.

Шаг 1. Создать новый проект типа WPF Application.

Шаг 2. Удалить из состава проекта автоматически созданный мастером файл MainWindow. xaml и добавить к проекту WPF страницу WPF, как иллюстрирует рисунок 3.11.

Рисунок 3.11

Шаг 3. Открыть файл App. xaml и изменить, как указано в листинге, атрибут StartupUri.

Листинг App. xaml

<Application x:Class="WpfApplication1.App"

xmlns="http://schemas. microsoft. com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas. /winfx/2006/xaml"

StartupUri="Page1.xaml">

<Application. Resources>

</Application. Resources>

</Application>

Шаг 4. Запустить проект на выполнение. Образ окна приведён на рисунке 3.12.

Рисунок 3.12

При запуске этого приложения среде WPF хватит «интеллектуальных способностей», чтобы понять, что стартовой указывается страница, а не на окно. Среда автоматически создаст новый объект NavigationWindow для выполнения роли контейнера и отобразит страницу внутри него.

Шаг 5. Добавить в состав проекта ещё две страницы WPF – Page2.xaml и Page3.xaml, используя диалог, отображённый на рисунке 3.11.

Состав проекта на данном этапе проектирования иллюстрирует рисунок 3.13.

Рисунок 3.13

Шаг 6. Для визуализации схемы навигации по страницам будем использовать элемент <TreeView>, а переход на страницы будут реализовывать элементы <Hyperlink>.

Один элемент <Hyperlink> обеспечивает переход с помощью гиперссылки NavigateUri="Page2.xaml", другой - с помощью события Click.

Листинг файла Page1.xaml приводится ниже.

Листинг файла Page1.xaml

<Page x:Class="WpfApplication1.Page1"

xmlns="http://schemas. /winfx/2006/xaml/presentation"

xmlns:x="http://schemas. /winfx/2006/xaml"

xmlns:mc="http://schemas. openxmlformats. org/markup-compatibility/2006"

xmlns:d="http://schemas. /expression/blend/2008" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="300" WindowTitle="Стартовая страница">

<Grid>

<Hyperlink NavigateUri="Page2.xaml">Страница 2</Hyperlink>

</TreeViewItem>

<Hyperlink Click="LinkClicked">Страница 3</Hyperlink>

</TreeViewItem>

</TreeView>

</TextBox>

</Grid>

</Page>

Элемент <TextBox> с именем tbMessage будет использован далее для передачи строки сообщения на страницу Page3. С помощью контекстного меню необходимо создать в файле Page1.xaml. cs заготовку метода обработки события Click="LinkClicked", как иллюстрирует рисунок 3.14. Программный код заготовки метода приводится ниже.