如何在不使用 -webkit-app-region 的情况下在 Electron 中移动无框窗口

问题描述

我一直试图在 false 上移动无框窗口，但现在我想通过拖动一个元素(标题栏)来移动 整个 窗口，我已经尝试过 -webkit-app-region: drag; 但它似乎不起作用，我也尝试过 https://www.npmjs.com/package/electron-drag 但它也不起作用.

I've been trying to move a frameless window on false but now I want to move the whole window just by dragging one element (the title bar), I've tried -webkit-app-region: drag; but it doesn't seem to work, I've also tried https://www.npmjs.com/package/electron-drag but it does't work either.

推荐答案

由于您的窗口是无框的，您可以使用属性 -webkit-app-region 有效，即使您的 IDE 说它不是.出于用户体验的考虑，您应该禁止文本选择并拖动标题栏内的按钮.

Since your windows are frameless you can use the property -webkit-app-region which is valid even though your IDE says it's not. You just should forbid the text selection and drag on buttons inside of your title bar too out of UX concerns.

.titlebar {
  -webkit-user-select: none;
  -webkit-app-region: drag;
}

.titlebar-button {
  -webkit-app-region: no-drag;
}

API 文档也提到了这一点 https://github.com/electron/electron/blob/master/docs/api/frameless-window.md#draggable-region

The API documentation mentions this too https://github.com/electron/electron/blob/master/docs/api/frameless-window.md#draggable-region

这篇关于如何在不使用 -webkit-app-region 的情况下在 Electron 中移动无框窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！