Выделение текста и изображений

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

Важные API: Windows.UI.Xaml.Input, Windows.UI.Input

Полезные советы

• Используйте глифы шрифтов при реализации собственного пользовательского интерфейса захвата. Захват — это сочетание двух шрифтов пользовательского интерфейса Segoe, доступных на уровне системы. Использование ресурсов шрифтов упрощает отрисовку проблем с разными значениями dpi и хорошо работает с различными платой масштабирования пользовательского интерфейса. При реализации собственных захватов они должны делиться следующими характеристиками пользовательского интерфейса:

  • Циклическая фигура
  • Видимый на любом фоне
  • Согласованный размер

• Предоставьте поле вокруг выбранного содержимого для размещения пользовательского интерфейса захвата. Если приложение включает выделение текста в регионе, который не сдвигается или прокрутки, разрешает поле захвата 1/2 на левой и правой сторонах текстовой области и 1 высоту захвата на верхней и нижней сторонах текстовой области (как показано на следующих изображениях). Это гарантирует, что весь пользовательский интерфейс захвата предоставляется пользователю и минимизирует непреднамеренное взаимодействие с другим пограничным пользовательским интерфейсом.

  

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

• Не разрешайте выбор элементов пользовательского интерфейса, таких как элементы управления, метки, изображения, собственное содержимое и т. д. Как правило, приложения Windows разрешают выбор только в определенных элементах управления. Такие элементы управления, как кнопки, метки и логотипы, недоступны для выбора. Оцените, является ли выбор проблемой для вашего приложения и, если да, определите области пользовательского интерфейса, где следует запретить выбор.

Дополнительные рекомендации по использованию

Выделение текста и манипуляция особенно подвержены проблемам взаимодействия с пользователем, представленным сенсорным взаимодействием. Мышь, перо или перо и перо и ввод клавиатуры очень детализированы: щелчок мыши или контакт пера или пера или пера, как правило, сопоставляется с одним пикселем, а клавиша нажимается или не нажимается. Сенсорные входные данные не детализированные; Трудно сопоставить всю поверхность пальцем с определенным расположением x-y на экране, чтобы точно поместить текст.

Рекомендации и рекомендации

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

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

Выделение текста

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

Редактируемое и не редактируемое содержимое

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

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

Редактируемое содержимое

Касание в левой половине слова помещает курсор в непосредственное левое место слова, а касание в правой половине помещает курсор в непосредственное правое место в правой части слова.

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

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

На следующих изображениях показано, как вызывать контекстное меню, касаясь выделения или захвата (можно также использовать нажатие и удержание).

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

 

Не редактируемое содержимое

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

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

Манипуляция с объектами

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

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

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

Редактор изображений с обрезкой захватов.

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

Для разработчиков

• Пользовательские взаимодействия с пользователем

Примеры

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

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

• Входные данные: пример событий ввода пользователей XAML

• Входные данные: пример возможностей устройств

• Входные данные: пример тестирования нажатия касания

• Пример прокрутки, сдвига и масштабирования XAML

• Входные данные: пример упрощенного рукописного ввода

• Входные данные: пример манипуляций и жестов

• Пример ввода сенсорного ввода DirectX