关于 electron 无边框窗口拖动的问题

[7075]

有没有一个比较好的库或者源码，可以实现非 css 样式方式的窗体的拖动呢（程序有多个窗体）？
需要至少可以兼容 win，macos

[lswl66]

哈哈哈你之前是怎么拖动的？

[7075]

@lswl66 css 样式，问题多的一批啊

[leohxj]

https://www.electronjs.org/docs/api/frameless-window

用这个窗体模式,然后自己 html+css 绘制顶部

[yangheng4922]

那就监听鼠标拖动 js 控制窗口位置

[7075]

@leohxj 嗯嗯，已经实现了无边框窗体，主要是不想用他自带的 css 样式实现拖动。希望窗口所有位置可以拖动，又不影响所有的 dom 元素的事件响应（ css 样式会干扰页面交互事件）。

[7075]

@yangheng4922 有没有现成的库或者源码？~

[yangheng4922]

@7075 #6 没有
全局 addEventListener 一下鼠标事件 setPosition 移动窗口

[xudaolong]

类似代码，仅做参考
```
const getSize = debounce(() => {
const win = BrowserWindow.getFocusedWindow()
const [width, height] = win.getSize()
return { win, width, height }
}, 500, {
'leading': true,
'trailing': false
})

ipcMain.on('windowMoving', (e, { mouseX, mouseY }) => {
const { x, y } = screen.getCursorScreenPoint()
const { win, width, height } = getSize()
if (win && !win.isMaximized()) {
win.setBounds({
width,
height,
x: x - mouseX,
y: y - mouseY
})
}
})
```

[7075]

thanks ！ i'll give it a try ！

[7075]

@xudaolong 多谢，试试先~

[codehz]

不用那个样式的话会有很多边界问题要处理。。比如考虑下鼠标移动过快，超过窗口区域
还有用户预期的 aero 效果（指移动到屏幕边界的贴合效果，分屏操作等）这些都是很难在纯粹的 js 层面解决的。。。

[7075]

@codehz 是的，尴尬的是，如果用了，相关的元素完全无法响应任何鼠标事件。。。。。。了解到有个库 electron-drag，有用过吗？