在 webkit(或电子)中禁用捏缩放

2022-01-10 00:00:00 webkit electron javascript html css

有没有办法在 electron 应用程序中禁用捏合缩放?

Is there any way to disable pinch zoom in an electron app?

我无法使用此处所述的普通 javascript 方法从 web 视图内部工作:https://stackoverflow.com/a/23510108/665261

I can't get it to work from inside the web-view with normal javascript methods as described here: https://stackoverflow.com/a/23510108/665261

似乎 --disable-pinch 标志是 电子不支持.

我尝试了各种方法:

  1. event.preventDefault() on javascript touchmove/mousemove 事件
  2. meta viewport HTML 中的标签
  3. -webkit-text-size-adjust 在 CSS 中
  4. 电子的标志/配置
  1. event.preventDefault() on javascript touchmove/mousemove events
  2. meta viewport tags in HTML
  3. -webkit-text-size-adjust in CSS
  4. flags/config for electron

有没有一般的 webkit 方法，或者特别是 electron?

Is there any method either for webkit in general, or electron in particular?

推荐答案

更新 2:

使用 webFrame.setZoomLevelLimits (v0.31.1+)在渲染过程(主进程和渲染进程的区别).因为 mac 上的智能缩放仍然适用于 document.addEventListener.

Use webFrame.setZoomLevelLimits (v0.31.1+) in render process (Differences Between Main Process and Renderer Process). Because smart zoom on mac still work with document.addEventListener.

示例 require('electron').webFrame.setZoomLevelLimits(1, 1)

更新:

deltaY 属性具有 float 值，但正常滚动事件返回 int 值.现在解决方案用ctrl键没有问题.

deltaY property for pinch zoom has float value, but normal scroll event return int value. Now solution has no problem with ctrl key.

演示2.

document.addEventListener('mousewheel', function(e) {
  if(e.deltaY % 1 !== 0) {
    e.preventDefault();
  }
});

<小时>

使用 Chromium monitorEvents(document) 我发现负责这个事件 mousewheel.我不知道，为什么 mousewheel 用捏缩放触发.下一步，找出普通滚动和捏缩放之间的区别.

Using Chromium monitorEvents(document) I found that is responsible for this event mousewheel. I don't know, why mousewheel triggered with pinch zoom. Next step, find difference between normal scroll and pinch zoom.

捏缩放有一个属性e.ctrlKey = true，普通滚动事件有e.ctrlKey = false.但是如果你按住 ctrl 键并滚动页面，e.ctrlKey 等于 true.

Pinch zoom has an attribute e.ctrlKey = true, and normal scroll event has e.ctrlKey = false. But if you hold down ctrl key and scroll a page, e.ctrlKey equal true.

我找不到更好的解决方案.:(

I couldn't find a better solution. :(

演示

document.addEventListener('mousewheel', function(e) {
  if(e.ctrlKey) {
    e.preventDefault();
  }
});

相关文章