MediaTrackSettings: screenPixelRatio 屬性

實驗性: 這是一項實驗性技術
在生產中使用此技術之前,請仔細檢查瀏覽器相容性表格

MediaTrackSettings 字典的 screenPixelRatio 屬性是一個數字,表示捕獲顯示錶面的畫素的物理大小(以其物理解析度顯示)與捕獲螢幕上的 CSS 畫素的邏輯大小(以其邏輯解析度顯示)之比。它不能用作約束或功能。

此屬性允許使用 螢幕捕獲 API 的應用程式透過以邏輯解析度(或裝置無關解析度)傳送螢幕捕獲的影片來節省資源。

一個表示螢幕畫素比的數字。

這是透過將捕獲螢幕上縮放比例為 1.0 且 CSS 畫素大小為 1.0CSS 畫素除以捕獲的 顯示錶面的畫素垂直大小來計算的。

描述

螢幕上應用作業系統(OS)縮放是很常見的,例如,當顯示器是高解析度顯示器時,您希望圖形以與標準解析度顯示器相同的物理尺寸顯示。應用縮放之前的解析度稱為邏輯解析度,應用縮放之後的解析度稱為物理解析度

如果傳送方的捕獲螢幕被縮放,則物理解析度大於邏輯解析度,因此視訊會議應用程式可以透過以下方式節省頻寬和 CPU:

  1. 移除作業系統對捕獲顯示錶面的縮放。
  2. 以邏輯解析度傳送螢幕捕獲的影片。
  3. 在遠端客戶端接收後重新應用縮放,將其尺寸調整回物理解析度。

screenPixelRatio 屬性描述了畫素的物理大小與 CSS 畫素的邏輯大小之比,因此允許應用程式計算應用了多少縮放因子,然後將影片限制為邏輯大小。

例如

  • 如果捕獲的顯示錶面正在標準解析度螢幕上顯示,其中物理畫素尺寸與 CSS 畫素尺寸大致相同,則 screenPixelRatio 將返回 1
  • 但是,如果捕獲的顯示錶面正在高 DPI 解析度螢幕上顯示,其中物理畫素尺寸大約是 CSS 畫素尺寸的兩倍,則 screenPixelRatio 將返回 2

示例

基本 screenPixelRatio 用法

在此示例中,應用程式定義了一個常量 RESOLUTION_LIMIT,它代表傳送應用程式應以邏輯解析度而不是物理解析度傳送影片的縮放因子。

screenPixelRatio 超過此限制時,應用程式使用 screenPixelRatio 值根據物理解析度計算邏輯解析度,然後將捕獲的 MediaStreamTrack 限制為邏輯解析度。

js
const RESOLUTION_LIMIT = 1.5;

async function startCapture() {
  const stream = await navigator.mediaDevices.getDisplayMedia({
    video: true,
  });
  const track = stream.getVideoTracks()[0];
  const settings = track.getSettings();
  const capabilities = track.getCapabilities();

  if (settings.screenPixelRatio > RESOLUTION_LIMIT) {
    const physicalWidth = capabilities.width.max;
    const physicalHeight = capabilities.height.max;
    const logicalWidth = physicalWidth / settings.screenPixelRatio;
    const logicalHeight = physicalHeight / settings.screenPixelRatio;
    await track.applyConstraints({
      width: logicalWidth,
      height: logicalHeight,
    });
  }
}

規範

規範
螢幕捕獲
# dom-mediatracksettings-screenpixelratio

瀏覽器相容性

另見