Device Posture API
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Experimentell: Dies ist eine experimentelle Technologie
berprfen Sie die Browser-Kompatibilittstabelle sorgfltig vor der Verwendung auf produktiven Webseiten.
Die Device Posture API ermglicht es Entwicklern, Benutzeroberflchen zu erstellen, die sich an die Haltung eines faltbaren Gerts anpassen und auf Haltungsnderungen reagieren.
In diesem Artikel
- Konzepte und Verwendung
- CSS-Funktionen
- Schnittstellen
- Beispiele
- Spezifikationen
- Browser-Kompatibilitt
- Siehe auch
Konzepte und Verwendung
Faltbare Gerte stellen Entwickler vor einzigartige Designherausforderungen sie knnen wie ein normaler Flachbildschirm oder wie ein Buch verwendet werden. Darber hinaus verfgen einige ber einen einzigen gefalteten Bildschirm, whrend andere zwei Bildschirme mit einem Scharnier in der Mitte haben. Es muss darauf geachtet werden, dass der Inhalt nicht durch das physische Scharnier verdeckt wird oder aufgrund der Nhe zur zentralen Falte schwer lesbar ist.
Die Device Posture API definiert Haltungen, die den aktuellen physischen Faltzustand eines Gerts anzeigen. Die derzeit verfgbaren Haltungen sind:
continuous-
Zeigt einen Flachbildschirmzustand an. Faltbare Gerte sind
continuous, whrend sie flach sind; entweder vollstndig geffnet oder vollstndig geschlossen. Nicht faltbare Gerte werden als flach betrachtet und sind daher immercontinuousdies schliet nahtlose gebogene Displays sowie Standard-Desktop-, Laptop-, Tablet- und Mobilbildschirme ein.
[Eine Auswahl an Flachbildschirmen, darunter Mobiltelefone und Tablets, sowie ein nahtlos gebogenes Display] folded-
Zeigt einen gefalteten Bildschirmzustand an. Faltbare Gerte sind
folded, whrend sie in einer Buch- oder Laptop-Haltung verwendet werden.
[Eine Auswahl an gefalteten Bildschirmen, darunter faltbare Mobiltelefone und Tablets in Buch- und Laptop-Haltungen]
![[Eine Auswahl an Flachbildschirmen, darunter Mobiltelefone und Tablets, sowie ein nahtlos gebogenes Display]](https://developer.mozilla.org/en-US/docs/Web/API/Device_Posture_API/continuous-screens.png){kind=link}
![[Eine Auswahl an gefalteten Bildschirmen, darunter faltbare Mobiltelefone und Tablets in Buch- und Laptop-Haltungen]](https://developer.mozilla.org/en-US/docs/Web/API/Device_Posture_API/folded-screens.png){kind=link}
Die Device Posture API enthlt Funktionen, mit denen Sie Skripte ausfhren und Layouts je nach aktueller Gertehaltung und Haltungsnderungen variieren knnen.
CSS-Funktionen
device-posture@media-Funktion-
Erkennt die aktuelle Haltung des Gerts.
Schnittstellen
DevicePosture-
Reprsentiert die Haltung des Gerts und bietet Zugriff auf den aktuellen Haltungstyp und ein
change-Ereignis, das bei einer Haltungsnderung ausgelst wird.
Erweiterungen zu anderen Schnittstellen
-
Der Einstiegspunkt fr die Device Posture API gibt das
DevicePosture-Objekt des Browsers zurck.
Beispiele
Ein vollstndiges Beispiel mit allen Funktionen finden Sie im Demo zur Device Posture API.
Wenn mglich, sollten Sie dies auf einem faltbaren Gert ansehen. Aktuelle Entwicklertools des Browsers ermglichen die Emulation faltbarer Gerte, beinhalten jedoch keine Emulation teilweise gefalteter Gerte nur vollstndig geffnete oder geschlossene daher wird immer continuous zurckgegeben.
Spezifikationen
| Spezifikation |
|---|
| Device Posture API # dom-deviceposture |
Browser-Kompatibilitt
Siehe auch
- Viewport Segments API
- Origin trial fr Foldable APIs auf developer.chrome.com (2024)