Как предотвратить масштабирование CTRL и колеса прокрутки / трекпада во Flutter Web?

10.04.2021Рубрика: ВопросыАвтор: admin

Проблема

Если я использую CTRL + колесо прокрутки или щепотку для увеличения с помощью трекпада в Chrome (Windows), я вижу это странное поведение:

Где веб-приложение Flutter изменяет размер, но при этом оставляет артефакты.

Пример использования

Если я хочу переопределить прокрутку для увеличения / масштабирования трекпада, чтобы использовать его в моем веб-приложении Flutter для увеличения, например, холста, это не позволяет мне сделать это. Flutter не препятствует этому поведению по умолчанию, даже когда я реагирую на жесты масштабирования.

Итак, как мне предотвратить это?

Post Views: 135

См. также: Массовое отслеживание Twitter без стороннего программного обеспечения

1 dom flutter flutter-web html javascript

Комментарии: 1

creativecreatorormaybenot 10.04.2021 в 00:00

Этого можно просто предотвратить с помощью HTML DOM JavaScript:

// This prevents zooming in using CTRL + mouse wheel.
// See https://stackoverflow.com/a/67039291/6509751.
document.addEventListener('wheel', function(e) {
  e.ctrlKey && e.preventDefault();
}, {
  passive: false,
});

Просто добавьте это в тег <body> файла index.html вашего веб-приложения Flutter:

<script>
  // This prevents zooming in using CTRL + mouse wheel.
  // See https://stackoverflow.com/a/67039291/6509751.
  document.addEventListener('wheel', function(e) {
    e.ctrlKey && e.preventDefault();
  }, {
    passive: false,
  });
</script>

Ответить

Добавить комментарий