electron vue 透明桌面事件穿透
electron 透明桌面事件穿透网上有很多方式都不怎么理想,这里有个新方式
我这里用到了remote ,引用的包是 @electron/remote
在主流程main.js下引用
import { screen } from 'electron'
ipcMain.handle('get-screen-point', () => screen.getCursorScreenPoint());
在渲染流程中,这里是vue
import { ipcRenderer } from 'electron'
import { BrowserWindow } from '@electron/remote'
const win = BrowserWindow.getFocusedWindow()
let t = null
mounted () {
window.addEventListener('mousemove', event => {
this.handleMouseMov(event, this)
});
},
methods: {
getScreenPoint: () => {
return ipcRenderer.invoke('get-screen-point')
},
handleMouseMov: (e, _this) => {
console.log(e, document)
if (e.target === document.documentElement) {
win.setIgnoreMouseEvents(true);
if (t) clearInterval(t);
t = setInterval(async () => {
_this.getScreenPoint().then(point => {
const elem = document.elementFromPoint(
Math.floor(point.x),
Math.floor(point.y)
);
if (elem !== document.documentElement) {
win.setIgnoreMouseEvents(false);
clearInterval(t);
}
})
}, 150);
}
else {
win.setIgnoreMouseEvents(false);
}
}
},
在样式中
body,html{
pointer-events: none
}
// 不穿透层
#noPo{
pointer-events: auto;
}
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
页:
[1]