ScreenDetails
ScreenDetails 接口是 窗口管理 API 的一部分，它表示用户设备上所有可用屏幕的详细信息。
可以通过 Window.getScreenDetails() 方法访问这些信息。
注意: ScreenDetails 是一个实时对象，这意味着它会随着可用屏幕的变化而更新。因此，您可以持续查询同一个对象以获取更新后的值，而不必反复调用 getScreenDetails()。
实例属性
继承其父级 EventTarget 的属性。
currentScreen只读 实验性-
一个单独的
ScreenDetailed对象，表示当前浏览器窗口所在屏幕的详细信息。 screens只读 实验性-
一个
ScreenDetailed对象的数组，每个对象都表示用户设备上可用屏幕的详细信息。注意:
screens仅包含“扩展”显示器，不包含镜像显示器的信息。
事件
currentscreenchange实验性-
当窗口的当前屏幕发生变化时触发——例如可用宽度或高度，或方向。
screenschange实验性-
当屏幕连接或断开与系统的连接时触发。
示例
基本屏幕信息访问
调用 Window.getScreenDetails() 时，将要求用户授予管理其所有显示器上窗口的权限（可以使用 Permissions.query() 查询 window-management 来检查此权限的状态）。如果用户授予了权限，则返回一个 ScreenDetails 对象。该对象包含用户系统上所有可用屏幕的详细信息。
下面的示例将在每个可用显示器上打开一个全尺寸窗口。
js
const screenDetails = await window.getScreenDetails();
// Open a window on each screen of the device
for (const screen of screenDetails.screens) {
openWindow(
screen.availLeft,
screen.availTop,
screen.availWidth,
screen.availHeight,
url,
);
}
响应可用屏幕的变化
您可以使用 screenschange 事件来检测可用屏幕何时发生变化（例如，插入或拔出屏幕时），报告该变化，并更新窗口布局以适应新的配置。
js
const screenDetails = await window.getScreenDetails();
// Return the number of screens
let noOfScreens = screenDetails.screens.length;
screenDetails.addEventListener("screenschange", () => {
// If the new number of screens is different to the old number of screens,
// report the difference
if (screenDetails.screens.length !== noOfScreens) {
console.log(
`The screen count changed from ${noOfScreens} to ${screenDetails.screens.length}`,
);
// Update noOfScreens value
noOfScreens = screenDetails.screens.length;
}
// Open, close, or rearrange windows as needed,
// to fit the new screen configuration
updateWindows();
});
规范
| 规范 |
|---|
| 窗口管理 # api-screendetails-interface |
浏览器兼容性
加载中…