День шестой. Application Bar
Вступление
В Windows Phone 7 есть специальный элемент - Application Bar (панель приложения), который представляет собой набор круглых значков в нижней части приложения.
Коснувшись значка, вы можете перейти на нужную страницу. При этом сами значки остаются на месте. По сути это схоже с полоской меню в обычных настольных приложениях.
Добавляем Application Bar (XAML)
Если вы создаете новый проект, то там уже есть заготовка для добавления Application Bar в приложение. Вам нужно снять комментарии с кода в файле MainPage.xaml file. Вернемся к нашему примеру и уберем комментарии:
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png"
Text="Button 1"/>
<shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png"
Text="Button 2"/>
<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="MenuItem 1"/>
<shell:ApplicationBarMenuItem Text="MenuItem 2"/>
</shell:ApplicationBar.MenuItems>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
Если вы создаете проект с нуля, то кроме указанного выше кода необходимо добавить пространства имен в (не забудьте установить также ссылки):
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
После того, как вы уберете комментарии, в программе появятся два значка на панели приложения. Запустите проект, чтобы убедиться в этом. Всего в Application Bar может содержаться от 1 до 4 значков. Высота панели равна 72 пикселам.
Кстати обратите внимание, что в коде для значков указаны пути к изображениям (напр. /Images/appbar_button1.png), которые не являются частью проекта. Если вы запустите проект, то в Application Bar будут выводиться значки X для ApplicationBarIconButtons. Безусловно, вы можете создать собственные значки, добавить их в проект и использовать их в своей программе. Но можно пойти другим путем и использовать уже готовые значки для этих целей. Откроем проект в Expression Blend и найдем объекты ApplicationBarIconButton в дереве объектов Objects and Timeline.
Щелкните на одном из них и изучите вкладку Properties.
Щелкнув по выпадающему списку IconUri, вы можете выбрать из множества предопределенных значков. Также вы можете задать текст для кнопок панели приложения.
Пусть вас не пугает, что стандартные значки имеют белый цвет на черном фоне. Если в телефоне будет использоваться светлая тема (о темах говорилось в прошлом занятии), то значки поменяют свой цвет на противоположный автоматически.
Вам нужно взять это на заметку, если собираетесь использовать собственные значки. О том, как создавать подобные значки, мы поговорим в одной из наших статей.
События для Application Bar
Теперь неплохо бы заставить кнопки-значки реагировать на наши действия. Добавим событие Click и его обработчик в коде.
[XAML]
<shell:ApplicationBarIconButton IconUri="/icons/appbar.favs.rest.png"
Text="Котята" Click="AppBarIconButton1_Click"/>
<shell:ApplicationBarIconButton IconUri="/icons/appbar.refresh.rest.png"
Text="Кошки" Click="AppBarIconButton2_Click"/>
[C#]
private void AppBarIconButton1_Click(object sender, EventArgs e)
{
PageTitle.Text = "котята";
}
private void AppBarIconButton2_Click(object sender, EventArgs e)
{
PageTitle.Text = "кошки";
}
Кроме значков на Application Bar вы можете видеть три точки (...). Если коснуться в этом месте, то откроется дополнительная выдвижная панель с текстовым меню. Повторное касание троеточия закроет панель. Сейчас там мы видим команды menuutem 1 и menuitem 2. Поступаем с ними аналогичным образом:
[XAML]
<shell:ApplicationBarMenuItem Text="Кто сказал мяу"
Click="AppBarMenuItem1_Click"/>
<shell:ApplicationBarMenuItem Text="Котенок по имени Гав"
Click="AppBarMenuItem2_Click"/>
[C#]
private void AppBarMenuItem1_Click(object sender, EventArgs e)
{
MessageBox.Show("Наверное, котенок");
}
private void AppBarMenuItem2_Click(object sender, EventArgs e)
{
MessageBox.Show("Странное имя для котенка");
}
В отличие от значков на панели, текстовых команд может быть больше и при этом поддерживается прокрутка.
Управляем прозрачностью Application Bar
Можно использовать свойство Opacity для изменения прозрачности панели. Если значение Opacity равно 1, то панель непрозрачна, если установить значение "0.5", то панель станет полупрозрачной.
Системная область
При запущенном приложении мы по-прежнему видим в верхней части экрана часы, уровень сигнала Wi-Fi, заряд батареи и другую системную информацию (на реальном устройстве, на эмуляторе ничего не отображается). Вы можете скрыть эту область, которая видима по умолчанию. Все, что нужно сделать - присвоить свойству Visible значение false.
shell:SystemTray.IsVisible="False"
Дополнительные сведения
Есть несколько значков панели приложения, которые устанавливаются вместе с Windows Phone Developer Tools. Вы можете найти эти значки в одном из следующих мест:
- На 32-битных операционных системах: C:\Program Files\Microsoft SDKs\Windows Phone\v7.0\Icons
- На 64-битных операционных системах: C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.0\Icons
Если вам необходимо создать собственный значок панеди приложения, то он должен соответствовать следующим требованиям:
- Размер 48 пикселей на 48 пикселей.
- Должен быть белого цвета на прозрачном фоне.
- Не включает в себя изображения круга, поскольку он отображается панелью приложения.
Реклама
