CaptureController: getSupportedZoomLevels() 方法

語法

getSupportedZoomLevels()

引數

無。

返回值

一個數字陣列，表示捕獲的顯示錶面支援的不同縮放級別。

異常

InvalidStateError DOMException

源自 MediaDevices.getDisplayMedia() 呼叫的捕獲的 MediaStream 不再進行捕獲，例如，因為相關的 MediaStreamTrack 物件已呼叫 stop() 方法。

NotSupportedError DOMException

正在捕獲的表面型別不是瀏覽器標籤頁。

示例

基本的 getSupportedZoomLevels() 用法

在我們透過 使用捕獲表面控制 API 展示的即時演示中，我們透過執行 getSupportedZoomLevels() 來獲取捕獲顯示錶面的支援的縮放級別，並將結果陣列儲存在一個名為 zoomLevels 的變數中。

const zoomLevels = controller.getSupportedZoomLevels();

這之後用於一個名為 updateZoomButtonState() 的函式。這個函式解決的問題是，如果您嘗試將縮放級別降低到低於支援的最低縮放級別，或者放大到高於支援的最高縮放級別，decreaseZoomLevel() / increaseZoomLevel() 將會丟擲一個 InvalidStateError DOMException。

updateZoomButtonState() 函式透過首先確保“縮小”和“放大”按鈕都已啟用來避免此問題。然後它進行兩次檢查：

• 如果當前縮放級別等於支援的最低縮放級別（儲存在 zoomLevels 陣列的第一個值中），我們將停用“縮小”按鈕，這樣使用者就無法進一步縮小了。
• 如果當前縮放級別等於支援的最高縮放級別（儲存在 zoomLevels 陣列的最後一個值中），我們將停用“放大”按鈕，這樣使用者就無法進一步放大了。

function updateZoomButtonState() {
  decBtn.disabled = false;
  incBtn.disabled = false;
  if (controller.zoomLevel === zoomLevels[0]) {
    decBtn.disabled = true;
  } else if (controller.zoomLevel === zoomLevels[zoomLevels.length - 1]) {
    incBtn.disabled = true;
  }
}

規範

瀏覽器相容性

另見

• Screen Capture API
• MediaDevices.getDisplayMedia()
• 使用 Captured Surface Control API