getWindowSegmentsAPI JavaScript pour les appareils à deux écrans (déconseillée)

Important

Les fonctionnalités et l’aide décrites dans cet article sont en préversion publique et peuvent faire l’objet de modifications importantes avant leur lancement en disponibilité générale. Microsoft ne donne aucune garantie, expresse ou implicite, concernant les informations fournies ici.

Attention

Cette API JavaScript est uniquement disponible dans la version stable actuelle (version 95) avec l’indicateur de fonctionnalités Web expérimentales activé. La syntaxe indiquée sur cette page sera dépréciée en faveur d’une nouvelle syntaxe.

Microsoft Edge Beta, Dev et les canaux d’initiés des canaries (96.0.1054.5 ou versions ultérieures), ainsi que les versions préliminaires de Google Chrome, utilisez une version mise à jour de cette syntaxe où a été remplacé par .

Visitez la nouvelle API documenatation pour écrire sur la dernière API.

La window.getWindowSegments() méthode retourne un tableau contenant les DOMRect s de toutes les zones d’affichage sur lesquelles la fenêtre du navigateur est fractionnée.

Syntaxe

let screens = window.getWindowSegments();

console.log(screens.length);

/**
 * Output:
 * Surface Duo with browser spanning: 2
 * Surface Duo with browser and another app side-by-side: 1
 * Desktops, Macs, Etc: 1
 **/

Durée de vie de l’API

La valeur retournée par Window.getWindowSegments() est un instantané immuable de l’état de l’appareil au moment où la méthode a été appelée, si l’utilisateur a modifié l’état d’étendue ou a fait pivoter l’appareil, les segments de fenêtre récupérés précédemment ne sont pas valides.

Les développeurs peuvent écouter l’événement de fenêtre resize ou orientationchange détecter si le navigateur a été redimensionné ou s’il a subi une rotation.

Exemple

/**
 * Browser state: spanning on duo device
 **/
let screens = window.getWindowSegments();

console.log(screens.length); // prints 2

/**
 * Some time later.. user resizes the browser
 *
 * Browser state: residing on 1 display
 **/

window.addEventListener('resize', () =>{
   screens = window.getWindowSegments();
   console.log(screens.length); // prints 1
});