Взаємодія з допомогою сенсорного екрану - uwp app developer, microsoft docs
В цій статті
Проектуйте додаток з урахуванням того, що сенсорний ввід буде головним методом введення для користувачів. Якщо ви використовуєте елементи управління UWP, то для підтримки сенсорної панелі, миші і пера не потрібне додаткове програмування, оскільки додатки UWP надають таку підтримку безкоштовно.
Однак майте на увазі, що призначений для користувача інтерфейс, оптимізований для сенсорного введення, не завжди буде краще традиційного інтерфейсу. І той і інший мають свої переваги і недоліки в технології та застосуванні. Переходячи до переважно сенсорному інтерфейсі, важливо розуміти основні відмінності між сенсорним введенням (в тому числі сенсорною панеллю) і введенням за допомогою пера, миші і клавіатури.
Багато пристроїв оснащені мультисенсорними екранами, які підтримують використання одного або декількох пальців (або сенсорних контактів) для введення даних. Сенсорні контакти і їх переміщення інтерпретуються як сенсорні жести і маніпуляції для підтримки різних видів взаємодії з користувачем.
В універсальній платформі Windows (UWP) існує ряд різних механізмів для обробки сенсорного введення, що дозволяє вам створювати сучасні методи взаємодії, які ваші користувачі можуть впевнено застосовувати. Тут ми розглянемо основи використання сенсорного введення в додатках UWP.
Для сенсорного взаємодії потрібні 3 речі:
- Сенсорний дисплей.
- Прямий дотик (або близьке взаємодія, якщо дисплей забезпечений безконтактними датчиками і підтримує виявлення наведення) з одного або декількох пальців до екрану.
- Переміщення точок контакту (або відсутність такого - в залежності від порогового значення часу).
Вхідні дані, що виводяться датчиком дотику, можуть:
- інтерпретуватися як фізичний жест для безпосередньої взаємодії з одним або декількома елементами призначеного для користувача інтерфейсу (наприклад, для зсуву, повороту, зміни розміру або переміщення), на противагу цьому взаємодія з елементом через його вікно властивостей, діалогове вікно або іншу можливість для користувача інтерфейсу називається непрямою маніпуляцією;
- розпізнаватися як альтернативний метод введення, такий як миша або перо;
- використовуватися для доповнення або зміни різних аспектів інших методів введення, наприклад розмиття розчерку пера.
Сенсорний ввід зазвичай передбачає пряму маніпуляцію елементом на екрані. Елемент негайно відповідає на будь-який сенсорний контакт в рамках своєї області перевірки та реагує відповідно на будь-який подальший рух сенсорних контактів, в тому числі видалення.
Нестандартні жести сенсорного введення і взаємодії слід розробляти з особливою акуратністю. Вони повинні бути інтуїтивно зрозумілими і виявляються, мати швидкий відгук і забезпечувати впевненість користувача під час роботи з вашим додатком.
Переконайтеся, що функції програми надаються узгоджено на всіх підтримуваних типах пристроїв введення. При необхідності використовуйте будь-яку форму режиму непрямого введення, наприклад текстовий введення для взаємодій з допомогою клавіатури або можливості призначеного для користувача інтерфейсу для миші і пера.
Пам'ятайте, що традиційні пристрої введення (такі як миша і клавіатура) знайомі і звичні безлічі користувачів. Вони можуть забезпечувати швидкість роботи, точність і тактильну зворотний зв'язок, недосяжні для сенсорного управління.
Надання унікальних і різноманітних процедур взаємодії для всіх пристроїв введення забезпечить підтримку максимально широкого діапазону можливостей і параметрів, завдяки чому ваші програми будуть мати успіх у найширшої аудиторії, залучаючи до себе більше клієнтів.
Порівняння вимог, що пред'являються до взаємодії з сенсорним екраном
У цій табличці вказано деякі відмінності між пристроями введення, які слід враховувати при розробці додатків UWP, оптимізованих для сенсорного введення.
Надає дані для всіх подій покажчика.
У наступному прикладі показано, як використовувати події PointerPressed. PointerReleased і PointerExited для обробки взаємодії в формі торкання на об'єкті Rectangle.
Спочатку в XAML створюється об'єкт Rectangle з ім'ям touchRectangle.
Далі вказуються прослуховувачі для подій PointerPressed. PointerReleased і PointerExited.
Нарешті, обробник подій PointerPressed збільшує параметри Height і Width об'єкта Rectangle. в той час, як обробники подій PointerReleased і PointerExited повертають параметри Height і Width до початкових значень.
події маніпуляції
Використовуйте події маніпуляції, якщо в додатку потрібно забезпечити підтримку взаємодії за допомогою декількох пальців або взаємодій, які потребують дані про швидкість.
За допомогою подій маніпуляцій можна виявляти такі взаємодії, як перетягування, масштабування і утримування.
Ось список подій маніпуляцій і аргументи пов'язаних подій.
Подія або клас
Надає дані для події ManipulationCompleted.
Жест складається з серії подій маніпуляції. Кожен жест починається з події ManipulationStarted. наприклад при дотику користувача до екрану.
Далі запускаються одне або кілька подій ManipulationDelta. Наприклад, якщо торкнутися екрана, а потім провести по ньому пальцем. Нарешті, після завершення взаємодії викликається подія ManipulationCompleted.
Примітка. Якщо у вас немає сенсорного монітора, ви можете перевірити код подій маніпуляцій в симуляторі, використовуючи інтерфейс миші і її коліщатка.
Наступний приклад показує, як використовувати події ManipulationDelta для обробки взаємодії в формі ковзання на об'єкті Rectangle і його переміщення по екрану.
Спочатку в XAML створюється об'єкт Rectangle з ім'ям touchRectangle. властивості Height і Width якого мають значення 200.
Потім створюється глобальний параметр TranslateTransform з ім'ям dragTranslation для перетворення Rectangle. Прослуховувач подій ManipulationDelta вказується на об'єкті Rectangle. і параметр dragTranslation додається до параметру RenderTransform об'єкта Rectangle.
Нарешті, в обробнику подій ManipulationDelta положення об'єкта Rectangle оновлюється шляхом застосування TranslateTransform до властивості Delta.
переслані події
рекомендації
- Розробляйте додатки з урахуванням того, що сенсорне взаємодія є пріоритетним методом введення.
- Забезпечте візуальну зворотний зв'язок для всіх видів взаємодії (дотик, перо, стилус, миша та ін.).
- Оптимізуйте націлювання за допомогою настройки розмірів цілей торкання, форми області контакту, проведення і гойдання.
- Оптимізуйте точність завдяки використанню точок прикріплення і напрямних "рейок".
- Підготуйте підказки і маркери, щоб поліпшити точність торкання для щільно упакованих елементів призначеного для користувача інтерфейсу.
- По можливості не використовуйте взаємодія, залежне від часу (приклад правильного використання - дотик і утримання).
- По можливості не використовуйте кількість пальців для розрізнення маніпуляцій.