如何在Electron中跟踪BrowserWindow的拖动?

时间:2016-11-13 22:19:58

标签: node.js electron

我有一个BrowserWindow的实例。我想知道什么时候在屏幕上拖动/移动窗口。

我已尝试使用已移动的事件,但该事件仅在窗口移动后被触发。拖动窗口时不会触发它。

如何跟踪拖动窗口的时间?

4 个答案:

答案 0 :(得分:1)

我有同样的问题,我以另一种方式解决了它。 我创建了一个无框架的BrowserWindow,我用我想要的图标和我想要的监听器在这个窗口加载的网页中创建了我的“系统栏”。

这很好用而且不贵。

    let wX;
    let wY;
    let dragging = false;
    $('#systembar').mousedown(function (e) {
        ipcRenderer.send('asynchronous-message', 'down')
        dragging = true;
        wX = e.pageX;
        wY = e.pageY;
    });

    $(window).mousemove(function (e) {
        e.stopPropagation();
        e.preventDefault();
        if (dragging) {
            var xLoc = e.screenX - wX;
            var yLoc = e.screenY - wY;

            try {
                remote.BrowserWindow.getFocusedWindow().setPosition(xLoc, yLoc);
            } catch (err) {
                console.log(err);
            }
        }
    });

    $('#systembar').mouseup(function () {
        dragging = false;
        ipcRenderer.send('asynchronous-message', 'up')
    });

答案 1 :(得分:0)

电子API似乎无法跟踪拖动过程中的实际窗口位置。

但是,您可以在可拖动窗口区域中的mousedown中跟踪鼠标光标移动,而不是尝试跟踪窗口本身的新位置。

代码大纲:

  • 检测拖动事件
  • 检查拖动区域内的拖动事件是否
  • 使用mousemove事件
  • 跟踪鼠标光标移动

答案 2 :(得分:0)

您可以不断检查window.screenXwindow.screenY值是否已更改。以下内容:

function onScreenMove(cb) {

    var lastScreenX;
    var lastScreenY;

    function detectScreenMove() {
        if (lastScreenY !== window.screenY || lastScreenX !== window.screenX) {
            lastScreenY = window.screenY;
            lastScreenX = window.screenX;
            cb();
        }
        requestAnimationFrame(detectScreenMove);
    }
    requestAnimationFrame(detectScreenMove);
}

onScreenMove(function() {
    // do something
});

据我所知,阅读screenX / screenY值的过程并不是非常昂贵,因此您不会杀死处理器。

不幸的是,Object.observe()已经离开了v50的Chrome版本,所以看起来并没有更多"#34;检查window属性更改的方法。

答案 3 :(得分:0)

每当窗口移动一个像素时,move的{​​{1}}(和moved)事件就会被发出。如果拖动并移动窗口,则会持续触发BrowserWindow事件,直到鼠标停止。

当检测到move时,您可以将窗口的位置视为

move

然后根据需要使用这些职位