CaptureController: phương thức getSupportedZoomLevels()

Cú pháp

getSupportedZoomLevels()

Parameters

Không có.

Return value

Một mảng số biểu diễn các mức thu phóng khác nhau mà bề mặt hiển thị đang được chụp hỗ trợ.

Exceptions

InvalidStateError DOMException

MediaStream dùng để chụp do lời gọi MediaDevices.getDisplayMedia() ban đầu trả về không còn chụp nữa, ví dụ vì các đối tượng MediaStreamTrack liên kết đã bị gọi stop().

NotSupportedError DOMException

Kiểu bề mặt đang được chụp không phải là tab trình duyệt.

Examples

Cách dùng getSupportedZoomLevels() cơ bản

Trong bản demo trực tiếp của chúng tôi, được trình bày trong Using the Captured Surface Control API, chúng tôi lấy các mức thu phóng được hỗ trợ của bề mặt hiển thị đang được chụp bằng cách chạy getSupportedZoomLevels(), lưu mảng kết quả vào biến tên là zoomLevels:

const zoomLevels = controller.getSupportedZoomLevels();

Giá trị này về sau được dùng trong một hàm tên là updateZoomButtonState(). Vấn đề mà điều này giải quyết là nếu bạn cố thu nhỏ xuống dưới mức thu phóng tối thiểu được hỗ trợ, hoặc phóng to vượt mức tối đa được hỗ trợ, thì decreaseZoomLevel()/increaseZoomLevel() sẽ ném ra InvalidStateError DOMException.

Hàm updateZoomButtonState() tránh vấn đề này bằng cách trước tiên bảo đảm cả hai nút "Zoom out" và "Zoom in" đều được bật. Sau đó nó thực hiện hai lần kiểm tra:

• Nếu mức thu phóng hiện tại bằng mức thu phóng tối thiểu được hỗ trợ (lưu ở giá trị đầu tiên của mảng zoomLevels), chúng tôi vô hiệu hóa nút "Zoom out" để người dùng không thể thu nhỏ thêm nữa.
• Nếu mức thu phóng hiện tại bằng mức thu phóng tối đa được hỗ trợ (lưu ở giá trị cuối cùng của mảng zoomLevels), chúng tôi vô hiệu hóa nút "Zoom in" để người dùng không thể phóng to thêm nữa.

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;
  }
}

Specifications

Browser compatibility

See also

• Screen Capture API
• MediaDevices.getDisplayMedia()
• Using the Captured Surface Control API