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

Статья
01/10/2024

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

touchpad

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

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

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

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

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

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

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

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

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

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

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

standard touchpad settings

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

windows precision touchpad settings

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

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

Срок	Description
Три пальца касание	Предпочтения пользователя для поиска с помощью Кортана или отображения Центра уведомлений.
Три пальца слайда	Пользователь предпочтет открыть представление задач виртуального рабочего стола, показать рабочий стол или переключиться между открытыми приложениями.
Касание одного пальца для первичного действия	Используйте один палец для касания элемента и вызова его основного действия (например, запуска приложения или выполнения команды).
Коснитесь двух пальцев, чтобы щелкнуть правой кнопкой мыши	Коснитесь двумя пальцами одновременно на элементе, чтобы выбрать его и отобразить контекстные команды.
Два пальца слайда для сдвига	Слайд используется в основном для взаимодействия с сдвигом, но также может использоваться для перемещения, рисования или записи.
Закрепление и растяжение для масштабирования	Жесты сжатия и растяжения обычно используются для изменения размера и семантического масштабирования.
Нажатие одного пальца и слайд для переупорядочения	Перетащите элемент.
Нажатие одного пальца и слайд для выбора текста	Чтобы выбрать его, нажмите в области выбора текста и слайда. Дважды коснитесь, чтобы выбрать слово.
Зона слева и правой кнопкой мыши	Эмулировать функции левой и правой кнопки устройства мыши.

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

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

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

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

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

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

Курсоры

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

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

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

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