Урок 3: User Control, Forms(модальные и не модальные) и Drag&Drop

Сначало немного разъяснения. В Silverlight’e отсутствуют формы (диалоговые окна). Поэтому мы получим их функциональность, используюя юзер контролы и драгндроп.

Создадим проект Silverlight и файл страницы приведем к следующему виду:

Думаю, что тут недолжно вознуть никаих трудностей, не забудьте – поменяйте родительсктй класс страницы.

А вот далее, мы создадим Silverlight user control, а именно: зайдем в меню Project->Add New Item->Silverlight user control,  и назовем новый файл Form.xaml.

Среда Вам создала юзер контрол ну ОЧЕНЬ похожий с тем, который нам генерится при новом Silverlight проекте. Поэтому не долго думаюя, и поменяв родительский класс, мы слегка рихтуем сгенерированый файл xaml, до необходимого нам вида:

Этим мы придали нашему Silverlight user contol’у внешний вид формы. Создали две таблицы – строчки 1-22 и 10-18.

1-22 Это вся наша форма разделенная на header(заголовок) и клиентское место под контролы.

В строках 10-18 мы заголовок нашей таблицы разбиваем на две части (вставив новую таблицу), и добавляем туда название формы и кнопку. обратите внимание, что в строке 9 мы определили рамку с синим цветом заливки заголовка формы и назначили ей имя. Это нам понадобится для перетаскивания формы, чтобы мы могли таскать форму ТОЛЬКО за заголовок.

Если мы сейчас сбилдим проект мы ничего не увидим, т.к. на основную страницу мы не добавили наш контрол( форму). Для этого делаем следующее:

1) ОБЯЗАТЕЛЬНО сохраним или сбилдим проект иначе мы из основной формы не увидим нашу новую форму

2) В файл page.xaml мы должны добавить область видимости всей программы. Для этого в заголовок надо добавить:

Просто советую – начнете набирать – после xmlns выберите из выпадающего списка область видимости, а уже ПОТОМ добавлаете имя области видимости, в нашем случае это My_Namespace (кстати можете назвать как вам будет удобно).

3) И, собственно, добавление контрола на основную форму, для этого просто начинаете набирать тег нашей области видимости и если Вы все правильно сделали и сохранились перед этим – Вам выпадет название класса нашего юзер контрола в качестве возможного тега:

Собственно и все. Правда, видите, мы не указывали координаты нашего контрола, поэтому он расположился в начале координат нашей страницы. И кроме того мы его пока скрыли – добавив свойство Visibility=”Collapsed”.

А вот теперь, мы сделаем так, чтобы при нажатии на кнопку у нас высвечивалась наша новая форма.

Кнопочу зарытия на нашей форме помните? Сделаем так чтобы она закрывала нашу форму (в файле Forms.xaml.cs):

Теперь наша форма показывается и скрывается. Обратите внимание на ТРИ момента с формами такого типа:

1) Они создаются при старте приложения и уничтожаются при зарытии приложения. Они находятся в памяти – их просто НЕ ВИДНО.

2) В функции закрытия скрывать по логике должно объект sender, то есть – кнопку, а закрывает весь контрол. Пока не разобрался почему – может кто объяснит? Зарание спасибо

3) Обратите внимаение с каким Z ордером у вас вводится на страницу ваша форма чтобы не было перекрытия.

Собственно, осталось только добавить нам перетаскивание нашей формы мышкой. Очень подробно это описано в документации SDK. Нам же просто достаточно добавить к нашей форме три фунции:

И собственно тела функций обработки этих событий. (ДОБАВТЕ ВЫСОТУ ДЛЯ КОНТРОЛА С ИМЕНЕМ Header – иначе не заработает):

Собственно билдим и наслаждаемся нашей маленькой формочкой:

Если у Вас возникнет желание сделать ресайз формы – просто добавте по контуру формы патч. И обработайте событие аналогично драгндропу.

А что же делать если нам необходима модальная форма? Очень просто добавте просто прямоугольник который не даст доступа к основной странице. подробности здесь. Добавлю просто, что можно сделать полную прозрачность и добавить перетаскивание – очень не плохо смотрится.