如何在Electron中实现父BrowserWindow移动时子窗口保持相对位置？

核心问题是Electron在Windows和Linux平台上，父窗口移动时不会自动同步子窗口的相对位置（macOS原生支持该特性），单纯监听move事件无法覆盖所有场景（比如系统快捷键调整窗口位置、程序API修改位置等），需要结合多事件监听+定期位置检查实现完全覆盖。

彻底解决方案步骤 #

1. 记录父子窗口的初始相对偏移量 #

创建子窗口时，先计算并保存子窗口相对于父窗口的位置偏移，避免每次直接设置同位置（适配子窗口在父窗口任意相对位置的需求）：

// 假设SearchWindow是父窗口，child_window是子窗口
const parentBounds = SearchWindow.getBounds();
const childBounds = child_window.getBounds();
// 保存相对偏移量
const offsetX = childBounds.x - parentBounds.x;
const offsetY = childBounds.y - parentBounds.y;

2. 监听父窗口的关键事件 #

除move事件外，补充监听resize、bounds-changed（Electron 14+支持）事件，覆盖更多位置/尺寸变化场景：

// 更新子窗口位置的通用方法
function updateChildPosition() {
  const [parentX, parentY] = SearchWindow.getPosition();
  child_window.setPosition(parentX + offsetX, parentY + offsetY, false);
}

// 监听窗口移动事件
SearchWindow.on('move', updateChildPosition);
// 监听窗口 resize 事件（父窗口尺寸变化可能影响相对位置）
SearchWindow.on('resize', updateChildPosition);
// 监听bounds-changed事件（Electron 14+，覆盖所有位置/尺寸变更场景）
SearchWindow.on('bounds-changed', updateChildPosition);

3. 添加定期位置检查兜底 #

部分系统级窗口位置变更（比如Windows Win+箭头贴边、Linux窗口管理器自动布局）可能不会触发Electron窗口事件，用定时器定期检查父窗口位置，对比上一次位置，有变化则更新子窗口：

let lastParentPos = SearchWindow.getPosition();
// 每100ms检查一次，可根据需求调整间隔
const positionCheckTimer = setInterval(() => {
  const currentPos = SearchWindow.getPosition();
  if (currentPos[0] !== lastParentPos[0] || currentPos[1] !== lastParentPos[1]) {
    updateChildPosition();
    lastParentPos = currentPos;
  }
}, 100);

// 窗口关闭时清除定时器，避免内存泄漏
SearchWindow.on('close', () => {
  clearInterval(positionCheckTimer);
});

4. 同步窗口显示状态（可选） #

如果需要子窗口与父窗口同步显示/隐藏，可补充监听show、hide事件：

SearchWindow.on('show', () => child_window.show());
SearchWindow.on('hide', () => child_window.hide());

注意事项 #

• 调用setPosition时第三个参数animate设为false，避免频繁移动时出现动画卡顿
• 定时器间隔建议设为100ms左右，兼顾响应及时性与资源占用
• 确保子窗口创建时已正确设置parent属性：new BrowserWindow({ parent: SearchWindow, ... })，否则子窗口不受父窗口管理

内容的提问来源于stack exchange，提问作者Raphael10