3. Градиентная заливка.

Выделите в дереве объектов элемент LayoutRoot и примените к нему какую-нибудь градиентную заливку (в светлых тонах). Для этого на вкладке Brushes панели Properties выберите в качестве способа заливки Gradient brush и для обеих позиций градиента (маркеры внизу) задайте по цвету (рис. 20.5).

Рис. 20.5. Установка заливки

Далее, выбрав инструмент Gradient Tool с панели инструментов, поверните направление цветового градиента примерно на 45 градусов (рис. 20.6).

Рис. 20.6. Настройка направления градиента цвета

4. Добавление текста.

Выберите в дереве объектов LayoutRoot и на панели инструментов сделайте двойной щелчок по TextBlock. Добавится блок текста. Чтобы увидеть его достаточно крупно в окне конструктора, используйте масштабирование (вращение колеса мыши) и панорамирование (перетаскивание холста при выбранном инструменте Pan - в большинстве режимов, за исключением редактирования текста, панорамирование легко временно включить нажатием пробела). Введите произвольную строку заголовка и щёлкните мышью за пределами блока - его размер будет подобран автоматически. Затем позиционируйте его вверху по центру и сделайте достаточно крупным, установив размер шрифта на вкладке Text панели Properties и применив начертание Bold. Выберите подходящий цвет на вкладке Brushes. К редактированию текста можно всегда вернуться, выбрав инструмент TextBlock.

Часть 2. Добавление страницы и стиля

1. Создание навигационной страницы.

На панели Projects щёлкните правой кнопкой мыши по имени приложения и выберите из контекстного меню команду Add New Item (добавить новый элемент к проекту).

Рис. 20.7. Добавление нового элемента к проекту

В открывшемся окне выберите Page в качестве добавляемого элемента, дайте странице имя AnimatePosition и нажмите OK (рис. 20.8).

Рис. 20.8. Создание навигационной страницы

Добавленная страница содержит таблицу LayoutRoot без заливки.

2. Добавление текстового блока и стиля.

На странице AnimatePosition будет размещено несколько крупных текстовых блоков, которые "прилетят" на свои места в момент при открытии страницы.

Добавьте текстовый блок, но перед тем как применять к нему какое-либо форматирование, создайте стиль (Меню Object - Edit Style - Create Empty). Дайте стилю понятное имя и определите его в приложении (Application) - тогда он будет доступен на всех страницах (рис. 20.9).

Рис. 20.9. Создание стиля

Окно конструктора теперь находится в режиме редактирования стиля - показан только активный элемент. Две кнопки вверху позволяют переключаться из режима редактирования страницы в режим редактирования стиля (рис. 20.10).

Рис. 20.10. Переключение режима редактирования страницы и стиля

Установите крупный (порядка 40pt) размер шрифта, полужирное начертание и какую-нибудь контрастирующую с фоном главной страницы заливку. Добавьте тень: нажмите на вкладке Appearance панели Properties кнопку New напротив слова Effect и в появившемся окне выберите DropShadowEffect. После этого выйдите из редактирования стиля.

Добавьте ещё 2-3 текстовых блока с произвольным текстом и примените к ним созданный стиль. Для этого каждый блок сначала следует выделить, а затем выбрать стиль через меню Object - Edit Style - Apply Resource. Разместите объекты на странице произвольным образом (для перемещения используйте инструмент Selection с панели инструментов) - например, так, как показано на рис. 20.11.

Рис. 20.11. Текстовые блоки с применённым стилем

Теперь, если изменить стиль, изменятся и все элементы, к которым он применён.