Chrome扩展开发：如何调整现有窗口为半屏并在右侧打开新窗口

要实现将现有Chrome窗口调整为屏幕一半大小，并在另一侧打开新窗口的需求，你可以通过Chrome扩展的windows和system.displayAPI来完成，具体代码和说明如下：

核心实现代码 #

chrome.action.onClicked.addListener(async () => {
  // 获取主屏幕的可用区域信息（排除任务栏等系统UI占用空间）
  const displays = await chrome.system.display.getInfo();
  const primaryDisplay = displays.find(d => d.isPrimary);
  const { width: screenWidth, height: screenHeight, left: screenLeft, top: screenTop } = primaryDisplay.workArea;
  const halfScreenWidth = Math.floor(screenWidth / 2);

  // 获取当前活动的Chrome窗口
  const currentWindow = await chrome.windows.getCurrent();

  // 将当前窗口调整为屏幕左半部分
  await chrome.windows.update(currentWindow.id, {
    width: halfScreenWidth,
    height: screenHeight,
    left: screenLeft,
    top: screenTop,
    state: 'normal' // 强制窗口退出最大化状态，确保尺寸调整生效
  });

  // 在屏幕右半部分创建新窗口
  await chrome.windows.create({
    url: "your-target-url", // 替换为你要打开的页面URL
    type: "panel",
    width: halfScreenWidth,
    height: screenHeight,
    focused: true,
    left: screenLeft + halfScreenWidth,
    top: screenTop
  });
});

关键配置与注意事项 #

• 权限声明：必须在扩展的manifest.json中添加以下权限：

  {
    "permissions": ["windows", "system.display"]
  }
  

• 自适应窗口位置：如果需要根据当前窗口的位置决定调整方向（比如当前窗口在右半屏就保留右半，新窗口开在左半），可以添加判断逻辑：

  // 判断当前窗口是否偏向屏幕右半
  const isCurrentOnRight = currentWindow.left + currentWindow.width / 2 > screenLeft + screenWidth / 2;
  // 调整当前窗口的位置和新窗口的位置
  const currentWindowLeft = isCurrentOnRight ? screenLeft + halfScreenWidth : screenLeft;
  const newWindowLeft = isCurrentOnRight ? screenLeft : screenLeft + halfScreenWidth;
  

• 窗口类型兼容：type: "panel"在部分系统或Chrome版本中可能存在显示限制，若出现问题可替换为"popup"或"normal"类型。

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