Главная » Silverlight » Загрузка пользовательских элементов управления

0

Базовая идея "самодельной" навигации состоит в программном изменении содер­жимого, отображаемого на странице Silverlight. Обычно изменение выполняется путем манипуляции контейнерами или элементами ContentControl. Для этого не нужно соз­давать огромное количество элементов управления и манипулировать ими в коде, на­много легче задача решается с помощью разметки XAML. Необходим способ создания и загрузки отдельных элементов управления, каждый из которых размещается в отдель­ном файле XAML и представляет отдельную страницу.

В следующих разделах вы увидите два варианта данного метода. В первом приме­ре пользовательские элементы управления загружаются на существующую страницу. Такой подход оптимален для интерфейсов, имеющих общие элементы (например, пане­ли инструментов или информационные панели). Во втором примере демонстрируется замена всего содержимого текущей страницы.

Внедрение пользовательских элементов управления на страницу

Многие приложения Silverlight основаны на одной странице, выполняющей функции главного окна всего приложения. Вы можете изменить часть страницы путем загрузки нового содержимого, имитируя таким образом навигацию.

Один из примеров указанного способа — страница меню, используемая в большин­стве примеров данной книги. В ней элемент управления Grid применяется для разбие­ния страницы на два раздела, отделенных друг от друга горизонтальным элементом GridSplitter. В верхнем разделе приводит­ся список страниц, которые можно посетить. При выборе пункта списка соответствующее содержимое загружается в нижний раздел (рис. 7.1).

Загрузить пользовательский элемент управления динамически несложно. Нужно лишь создать экземпляр соответствующего класса и добавить его в подходящий кон­тейнер. Обычно в качестве контейнера ис­пользуются элементы Border, ScrollViewer, StackPanel и Grid. На рис. 7.1 использу­ется элемент Border, наследующий класс ContentControl и рисующий рамку с помо­щью свойств BorderBrush и BorderThickness.

<UserControl x:Class="Navigation.MenuPage" xmlns="http: //schemas .microsoft . com/winfx/2006/xaml/

presentation"

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

"clr-namespace:System.Windows.Controls; assembly=System.Windows.Controls">

Рис. 7.1. Окно, в котором пользователь­ские элементы управления загружаются динамически

<Grid x:Name="LayoutRoot" Background="White" Margin="5"> <Grid.RowDefinitions> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> <RowDefinition Height="3*"></RowDefinition> </Grid.RowDefinitions>

CListBox Grid.Row="0"

SelectionChanged="lstPages_SelectionChanged">

</ListBox>

<basics:GridSplitter Grid.Row="l" Margin="0 3" HorizontalAlignment="Stretch" Height="2"></basics:GridSplitter>

<Border Grid.Row="2" BorderBrush="SlateGray"

BorderThickness="l" x:Name="borderPlaceholder" Background="AliceBlue">

</Border> </Grid>

</User Control>

В данном примере элемент Border имеет имя borderPlaceholder. Оно используется для отображения нового пользовательского элемента управления Раде2 области Border.

Раде2 newPage = new Page2();

borderPlaceholder.Child = newPage;

В контейнерах других типов можно использовать не Child, а другие свойства. Например, некоторые контейнеры Silverlight размещают много элементов управления и, соответственно, предоставляют для этого не свойство Child, а коллекцию Children. Сначала нужно очистить коллекцию, а потом добавить в нее новые элементы управле­ния. Приведенный ниже код делает то же, что и предыдущий, но вместо свойства Child в нем используется коллекция, добавляемая в единственную ячейку панели Grid.

Раде2 newPage = new Page2 ();

gridPlaceholder.Children.Clear();

gridPlaceholder.Children.Add(newPage);

Если создать элемент Grid, не объявив ни строк, ни столбцов, в нем будет установле­на единственная пропорциональная ячейка, занимающая все доступное пространство. Следовательно, добавление элемента управления в Grid приведет к тому же результа­ту, что и в Border.

В разных примерах используются немного разные коды навигации, потому что не­обходимо учитывать типы добавляемых элементов управления. Для выяснения типа код проверяет объект ListBoxltem, на котором произошел щелчок мышью. При созда­нии соответствующего пользовательского объекта используется рефлексия.

private void lstPages_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

// Получение выбранного элемента

string newPageName = ((ListBoxltem) e.

Addedlterns[0])-Content.ToString() ;

// Создание экземпляра страницы

Type type = this. GetType () ;

Assembly assembly = type.Assembly;

UserControl newPage = (UserControl)assembly.Createlnstance ( type.Namespace + "." + newPageName);

// Вывод страницы на экран

borderPlaceholder.Child = newPage;

)

За исключением кода рефлексии, для установки свойства Border. Chi Id и выво­да единственного пользовательского элемента управления используется аналогичная процедура.

Сокрытие элементов

Создавать динамические страницы, как в предыдущем примере, можно не только Добавляя и удаляя содержимое. Его можно временно скрыть. Это делается с помощью свойства Visibility, определенного в базовом классе UIElement и наследуемого всеми элементами.

panel.Visibility = Visibility.Collapsed;

В свойстве Visibility используется перечисление, содержащее два элемента: Visible и Collapsed (в WPF есть третий элемент — Hidden, который скрывает элемент, но на его месте выводит мерцающий маркер; в Silverlight элемент Hidden не поддер­живается). Свойство Visibility можно установить для каждого элемента страницы от­дельно, однако легче скрыть весь контейнер (например, объект Border, StackPanel или Grid).

Когда элемент скрыт, он не занимает места на странице и не получает фокус вво­да. Остальное содержимое контейнера повторно размещается, занимая освободивше­еся пространство (конечно, если содержимое не позиционировано с фиксированными координатами на холсте Canvas).

Совет. Во многих приложениях используются панели, которые плавно сворачиваются или "убегают" в сторону. Для создания подобных эффектов необходимо применить средства анимации, встроенные в Silverlight. Процедура анимации плавно изменяет элемент, который нужно скрыть. Например, она сжимает или перемещает элемент. По завершении анимации свойству visibility нужно присвоить значение, скрывающее элемент (см. главу 10).

Источник: Мак-Дональд, Мэтью. Silverlight 3 с примерами на С# для профессионалов. : Пер. с англ. —- М. : ООО «И.Д. Вильяме», 2010. — 656 с. : ил. — Парал. тит. англ.

По теме:

  • Комментарии