Разработка Windows 8.1 приложений. Новые контролы (часть 1)

Эта вторая статья из серии “Разработка приложений под Windows 8.1” . Эта серия предназначена для разработчиков, желающих узнать о новые возможности ОС Windows 8.1.

1. Введение.
2. Новые элементы управления.
3. AppBar, темы и навигация.
4. Windowing.
5. Поиск, люди и контракты.
6. Тайлы и система уведоления с Azure.
7. Синтез речи, PDF и PlayTo.
8. Магазин Windows и упаковка приложений.

Введение

По выходу Windows 8, в WinRT были введены новые элементы управления, такие как GridView, ListView, или SemanticZoom. Тем не менее, с ними было не так просто создавать приложения, с передовым дизайном и богатым содержанием.

Вы никогда не пробовали добавить Bing приложения (путешествия, новости и т.д), простой выбор даты или гиперссылку, всплывающие меню в свое творение?

В Windows 8.1 вводятся новые элементы управления и возможности, которые помогут вам создавать действительно стоящие приложения. Сделать макет приложения Bing теперь можно в считанные минуты. Выбора даты и гиперссылки теперь полностью интегрированы во фреймворк. Последнее, но не менее важными, стали обновления “старых” контролов, таких как WebView и другие.

Во второй статье, мы рассмотрим каждый из этих новых элементов управления.

Hub

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

В Windows 8, вы, вероятно, привыкли иметь GridView с сгруппированных элементов, чтобы сделать это. Это было сложным и трудоемким.

В принципе, Hub представляет собой набор HubSection. У каждой секции есть три важных свойства:

1. Header: используется для получения или задания заголовка раздела
2. Background: используется для получения или установки фона
3. ContentTemplate: используется для получения или установки содержимого секции

Hub полностью заполняет экран. Чтобы изменить заголовок страницы и кнопку возврата, у него есть свойство Header.

Результат

У Hub и HubSection также есть свойство HeaderTemplate, который вы можете использовать для задания заголовка.

Интерактивные заголовки

По умолчанию заголовок раздела — просто текст. Если вы хотите, чтобы пользователь использовал их в качестве ссылки, чтобы перейти к конкретному разделу вашего приложения, вы можете использовать IsHeaderInteractive. Установив его в True, заголовок преобразуется в кнопку, которая выглядит как текст, после чего символ шеврона.

В приведенном выше примере, я установил IsHeaderInteractive в True. Когда пользователь нажимает на него, событие SectionHeaderClick срабатывает и вызывается Hub_SectionHeaderClick. Можно получить выбранный раздел и, в соответствии с его заголовком, перенаправить пользователя на другую страницу.

Hub и SemanticZoom

Так как Hub реализует ISemanticZoomInformation интерфейс, его можно легко использована в паре с SemanticZoom.

Чтобы получить заголовки, у Hub есть свойство SectionHeaders, которые предоставит вам объект типа IObservableVector <object>.

Результат

Вертикальная ориентация

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

В приведенном выше примере, я определил обработчик события SizeChanged. Когда срабатывает событие и если приложение меньше, чем 500px, я изменяю ориентацию Hub control’а для отображения разделов в вертикальной ориентации.

Наконец, у Hub control’a есть свойство DefaultSectionIndex, которую можно использовать для установки индекса раздела по умолчанию (начиная с 0).

DatePicker, TimePicker

DatePicker

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

Формат строки довольно необычно, но IntelliSense поможет вам выбрать нужный формат.

Если вы хотите скрыть месяц, день или год, вы можете использовать MonthVisible, DayVisible и YearVisible свойствами.

Вы также можете добавить заголовок.

Ниже приведены некоторые другие полезные свойства:

• CalendarIdentifier: используется для определения календарной системы (григорианский, иврит, японский, …)
• Orientation: вертикальная или горизонтальная (значение по умолчанию)
• MinYear / MaxYear: используется для установки минимального и максимального значения года

Также у DatePicker есть событие DateChanged, которое срабатывает при изменении даты.

Наконец, если вы хотите получить или установить дату программно, вы можете использовать свойство Date типа DateTimeOffset.

TimePicker

TimePicker так же легко использовать, как и DatePicker. Вот его наиболее важных свойства:

• Time: объект TimeSpan, используется для получения или установки выбора времени
• ClockIdentifier: используется для получения или установки системных часов (на 24 или 12 часовой основе)
• Header: используется для определения заголовка
• MinuteIncrement: приращение времени. Например, со значением значение 5, минуты будут отображаться в формате: 0, 5, 10,15 …

Также, как и DatePicker, у TimePicker есть событие TimeChanged, которое срабатывает, когда пользователь выбирает новое время.

На этом первая часть статьи о новых контролах заканчивается. Совсем скоро вашему вниманию будет предоставлено вторая часть.

Ссылка на источник: Developing a Windows 8.1 application (2/8): new controls