Рекомендации по проектированию сенсорной панели

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

Для взаимодействия с сенсорной панелью требуется следующее:

• Стандартная сенсорная панель или сенсорная панель Windows Precision Touchpad.

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

• Прямой контакт одного или нескольких пальцев на сенсорной панели.

• Перемещение контактов касания (или их отсутствие на основе порогового значения времени).

Входные данные, предоставляемые датчиком сенсорной панели, могут быть следующими:

• Интерпретируется как физический жест для прямого управления одним или несколькими элементами пользовательского интерфейса (например, сдвигом, поворотом, изменением размера или перемещением). В отличие от этого, взаимодействие с элементом через окно свойств или другое диалоговое окно считается непрямой манипуляцией.
• Распознан как альтернативный метод ввода, например мышь или перо.
• Используется для дополнения или изменения аспектов других методов ввода, таких как смежение росчерка рукописного ввода, нарисованного пером.

Сенсорная панель объединяет косвенные много сенсорные входные данные с точным вводом указателя устройства, например мышью. Это сочетание делает сенсорной панель подходит как для пользовательского интерфейса, оптимизированного для сенсорного ввода, так и для небольших целевых объектов приложений для повышения производительности и классической среды. Оптимизируйте дизайн приложения Windows для сенсорного ввода и получите поддержку сенсорной панели по умолчанию.

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

Жесты и рекомендации, рассмотренные в этом разделе, помогут гарантировать, что ваше приложение поддерживает ввод сенсорной панели легко и с минимальным кодом.

Язык сенсорной панели

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

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

^{Стандартные параметры сенсорной панели\}

^{Параметры Windows\ Precision\ Touchpad\}

Ниже приведены некоторые примеры жестов, оптимизированных для сенсорной панели, для выполнения распространенных задач.

Оборудование

Запросите возможности устройства мыши (MouseCapabilities), чтобы определить, какие аспекты пользовательского интерфейса приложения могут напрямую получить доступ к оборудованию сенсорной панели. Мы рекомендуем предоставить пользовательский интерфейс для ввода сенсорного и мыши.

Дополнительные сведения о запросах возможностей устройств см. в разделе "Идентификация устройств ввода".

Визуальный отзыв

• При обнаружении курсора сенсорной панели (через события перемещения или наведения указателя мыши) отображается пользовательский интерфейс, зависящий от мыши, чтобы указать функциональные возможности, предоставляемые элементом. Если курсор сенсорной панели не перемещается в течение определенного периода времени или если пользователь инициирует сенсорное взаимодействие, пользовательский интерфейс сенсорной панели постепенно исчезает. Это обеспечивает очистку и отключение пользовательского интерфейса.
• Не используйте курсор для обратной связи наведения указателя мыши, отзывы, предоставляемые элементом, достаточно (см. раздел "Курсоры" ниже).
• Не отображайте визуальный отзыв, если элемент не поддерживает взаимодействие (например, статический текст).
• Не используйте прямоугольники фокуса с взаимодействиями с сенсорной панелью. Зарезервировать их для взаимодействия с клавиатурой.
• Одновременно отображать визуальные отзывы для всех элементов, представляющих один и тот же целевой объект ввода.

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

Курсоры

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

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

Если вам нужно настроить курсор мыши:

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

Связанные статьи

• Обработка входных данных указателя
• Определение устройств ввода

Примеры

• Базовый пример входных данных
• Пример ввода с низкой задержкой
• Пример режима взаимодействия пользователя
• Пример визуальных элементов фокуса

Архивные примеры

• Входные данные: пример возможностей устройств
• Входные данные: пример событий ввода пользователей XAML
• Пример прокрутки, сдвига и масштабирования XAML
• Входные данные: жесты и манипуляции с помощью ЖестаRecognizer