Electron Windows增加托盘悬浮框功能
2021-03-07 22:26
标签：etc idt 步骤 code src 桌面 直接 cursor npoi 背景 在做Electron Windows 桌面应用时候，做鼠标悬浮到托盘图标上时显示一个悬浮框（例如做消息提醒），但因为Windows没有提供托盘mouse-enter/mouse-leave事件，无法直接做这个功能，考虑到还有mouse-move事件，弄个间接的方式实现。 实现步骤 1、监听mouse-move事件，当触发时，即也相当触发mouse-enter事件。 2、开始定时（100ms）获取托盘位置和鼠标位置，判断鼠标是否还在托盘图标里，当已不在时，触发mouse-leave事件并停止定时查询。 3、当mouse-enter时，显示悬浮窗口到托盘上方，当mouse-enter，隐藏悬浮窗口。 PS：悬浮窗口需要设置置顶属性，且不显示在任务栏。 具体代码 Electron Windows增加托盘悬浮框功能 标签：etc idt 步骤 code src 桌面 直接 cursor npoi 原文地址：https://www.cnblogs.com/lovesong/p/12813646.html
//判断鼠标是否还在托盘图标
trayBounds = tray.getBounds();
point = screen.getCursorScreenPoint();
if(!(trayBounds.x trayBounds.height))){
//已不在托盘，触发mouse-leave
}var leaveInter,
trayBounds,
point,
isLeave = true;
function checkTrayLeave(){
clearInterval(leaveInter)
leaveInter = setInterval(function(){
trayBounds = tray.getBounds();
point = screen.getCursorScreenPoint();
if(!(trayBounds.x trayBounds.height))){
//触发mouse-leave
clearInterval(leaveInter);
isLeave = true;
}
}, 100)
}
tray.on(‘mouse-move‘, () => {
if (isLeave) {
//触发mouse-enter
isLeave = false;
checkTrayLeave();
}
})
文章标题：Electron Windows增加托盘悬浮框功能
文章链接：http://soscw.com/index.php/essay/61523.html