Шаблоны команд

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

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

Дополнительные сведения о различных поверхностях для команд в приложениях см. в разделе Создание макета пользовательского интерфейса.

Типы команд

Фильтр

Команды-фильтры по заданным условиям удаляют или скрывают содержимое, входящее в некоторый набор данных. Например, пользователь может показать в Магазине Windows только игры из категории "Приключения".

 

 

Сводка

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

 

 

Сортировка

Команды сортировки меняют порядок отображения содержимого в наборе данных. Например, в приложении для путешествий пользователь может отсортировать достопримечательности по их популярности.

 

 

Представление

Команды представления меняют стиль или метод отображения содержимого. Например, в приложении для поиска гостиниц пользователь может просматривать отели на карте, а не в списке.

 

 

Подсказка

Вы можете разместить на полотне подсказки, если они помогут пользователям. Например, в приложении "Почта" в Windows 8.1 есть команда "многоточие", которая указывает на наличие дополнительных параметров. Если щелкнуть ее, то появится панель приложения (которую также можно открыть стандартными средствами Windows).

 

 

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

 

 

Другие

Команда — это любой интерактивный элемент пользовательского интерфейса, который позволяет пользователю выполнить некоторое действие в текущем представлении. Вот несколько примеров.

 

 

Расположение команд

На полотне

Если команда (или меню команд) очень важна и постоянно необходима пользователю для выполнения основных сценариев, поместите ее на полотно. Например, в приложении "Почта" в Windows 8.1 основные команды, такие как "Ответить", "Создать" и "Удалить", отображаются на полотне при выборе почты.

 

 

Нижняя панель приложения

Иногда необходимо, чтобы команды не загромождали полотно и не мешали пользователю использовать содержимое приложения. С помощью нижней панели приложения можно отображать команды для пользователей по требованию. На нижней панели приложения отображаются команды, соответствующие пользовательскому контексту (как правило, для текущей страницы или выбранного объекта).

Нижняя панель приложения хорошо подходит как для команд, выполняющих одно действие, так и для команд с множественным выбором. Вы можете программировать ваше приложение так, чтобы панель приложения отображалась, когда пользователь выбирает объекты.

 

 

Рекомендации по размещению команд

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

• Предсказуемость. Будьте максимально последовательны при организации взаимодействия и размещении команд во всех представлениях вашего приложения.
• Эргономика. Подумайте, каким образом размещение определенных команд может ускорить или облегчить их действие.
• Эстетика. Ограничьте число команд, чтобы не усложнять вид панели приложения. Выбирайте понятные и предсказуемые значки. Текстовые метки делайте как можно короче.

Мы предлагаем следующие рекомендации по размещению команд.

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

 

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

 

Отображение или скрытие отключенных команд. Это команды, которые не важны при определенных обстоятельствах. Когда они все-таки отображаются, они не должны нарушать порядок расположения постоянных команд. В этом примере представление карты активно и соответствующие команды отображаются справа от набора команд просмотра.

 

Вставляйте команды выбора. Команды, отображающиеся, когда пользователь выбирает какие-либо объекты, переходят к левому краю панели, сдвигая любые команды, которые могут там находиться. Это делает команды выбора более заметными и доступными. В этом примере набор команд просмотра сдвигается вправо, чтобы освободить место для набора команд выбора.

 

Размещение общих команд

Некоторые команды являются общими и отображаются во многих приложениях. Чтобы обеспечить согласованность и повысить уверенность работы пользователя, следуйте этим рекомендациям при принятии решения о размещении общих команд на панели приложения.

Размещайте команды выбора у левого края, будь то контекстно-зависимые команды, появляющиеся при выборе, или команды, которые влияют на выбор объекта. В данном примере, прежде чем пользователь выделит что-либо, команда "Выделить все" отображается слева. После того как пользователь выделит что-либо, слева появляются другие команды выбора.

 

Размещайте команды создания у правого края панели. Это могут быть команды добавления, создания, составления или любые команды, создающие новый объект. Команды создания должны быть легко доступны для больших пальцев. В данном примере команда "Новая рецензия" позволяет создать новую рецензию по ресторанам. Другие команды, связанные с командой "Новая рецензия", размещаются рядом с ней слева. Глиф "+" следует использовать только для представления команды "Создать", и размещать его в каком-то другом месте панели приложения нельзя.

 

Размещайте команды удаления слева от команд создания. Используйте команды "Удалить" и "Создать", если ваше приложение предназначено для управления отдельными объектами, которые могут существовать вне вашего конкретного приложения (например, почтовое приложение или приложение для работы с камерой). Команды "Удалить" и "Создать" должны всегда отображаться в этой последовательности.

 

Размещайте команды удаления слева от команд добавления. Используйте команды "Удалить" и "Добавить", если ваше приложение предназначено для управления списками, например списком дел, списком городов в приложении прогноза погоды или списком отмеченных ресторанов. Команды "Удалить" и "Добавить" должны всегда отображаться в этой последовательности.

 

Размещайте команды очистки слева от команд создания. Используйте команду очистки, если вы выполняете деструктивное действие со всеми возможными элементами. Метка команды должна явно отражать действие, выполняемое командой, например "Очистить выделение".

 

Примеры размещения команд на нижней панели приложения см. в разделе, представляющем библиотеки макетов приложений Магазина Windows.

Группирование команд в меню

Иногда эффективнее группировать несколько команд в меню команд. Меню позволяют предлагать больше параметров, используя меньше пространства. Меню могут содержать интерактивные элементы управления.

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

 

Контекстные меню

Контекстные меню часто содержат действия с буфером обмена, например вырезание, копирование и вставку. Контекстные меню также могут содержать команды, применимые к содержимому, которое нельзя выбрать, например к изображению или веб-странице. Система предоставляет приложения со стандартными контекстными меню для работы с текстом и гиперссылками. При работе с текстом стандартное контекстное меню отображает команды буфера обмена. При работе с гиперссылками в стандартном меню отображаются команды копирования и открытия ссылки.

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

 

 

Примечание  

Использование чудо-кнопок

При разработке приложения Магазина Windows вы получаете четыре очень полезных команды в чудо-кнопках: "Поиск", "Поделиться", "Устройства" и "Параметры". Пользователи вызывают чудо-кнопки, проводя пальцем от правого края экрана или помещая указатель мыши в правый верхний или нижний угол экрана.

 

 

Поиск. Предоставьте пользователям возможность выполнять быстрый поиск содержимого в вашем приложении из любого места в системе, в том числе из других приложений.
Общий доступ. Предоставьте пользователям возможность открывать общий доступ к содержимому другим пользователям и приложениям, а также получать общее содержимое.
Пуск. Чудо-кнопка "Пуск" переводит пользователя на начальный экран. Приложения не взаимодействуют с этой чудо-кнопкой. Она работает автоматически и всегда одинаково.
Устройства. Предоставьте пользователям возможность наслаждаться изображениями, звуковыми и видеофайлами, передаваемыми вашим приложением на другие устройства их домашней сети.
Настройки. Объедините все настройки в одном месте и позвольте пользователям управлять параметрами вашего приложения так, как они привыкли.

 

Не допускайте дублирования функций контракта приложений на полотне или на панели вашего приложения.

Связанные разделы

Руководство по панелям приложения

Руководство по контекстным меню

Руководство по командам буфера обмена

Чудо-кнопки и контракты