Bildschirmausrichtung Capacitor Plugin

@capgo/capacitor-screen-orientation verwenden

Interface des Capacitor Screen Orientation Plugins.

Installieren

bun add @capgo/capacitor-screen-orientation
bunx cap sync

bunx cap sync kopiert den nativen code des Plugins in deine nativen Projekte. Nach jedem Plugin-Upgrade erneut ausführen.

Importieren

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

API auf einen Blick

Methode	Beschreibung
orientation	Die aktuelle Bildschirmausrichtung abrufen.
lock	Die Bildschirmausrichtung auf einen bestimmten Typ fixieren.
unlock	Die Bildschirmausrichtung entsperren.
startOrientationTracking	Tracking der Geräteausrichtung mit Bewegungssensoren starten.
stopOrientationTracking	Tracking der Geräteausrichtung mit Bewegungssensoren stoppen.
isOrientationLocked	Prüfen, ob die Ausrichtungssperre aktuell aktiviert ist.
isDeviceFoldable	Auf Änderungen der Bildschirmausrichtung lauschen.
getFoldState	Den aktuellen Faltzustand auslesen.
getHingeAngle	Den Scharnierwinkel in Grad auslesen.
getReservedRegions	Den Faltzustand und alles, was den Bildschirm verdeckt, auslesen.
getBarPlacement	Auslesen, wo das iPhone Duo native Tab-Bars und Toolbars platziert.
setVerticalBarBehavior	Wähle aus, ob iPhone Duo die Statusleisten dieser App zur Seite verschieben darf.
getSizeClass	Lies die Window Size Classes aus.

Beispiele

orientation()

Die aktuelle Bildschirmausrichtung abrufen.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

const result = await ScreenOrientation.orientation();
console.log('Current orientation:', result.type);

lock()

Die Bildschirmausrichtung auf einen bestimmten Typ fixieren.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

// Standard lock
await ScreenOrientation.lock({ orientation: 'landscape' });

// Lock with motion tracking on iOS
await ScreenOrientation.lock({
  orientation: 'portrait',
  bypassOrientationLock: true
});

unlock()

Die Bildschirmausrichtung entsperren.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

await ScreenOrientation.unlock();

startOrientationTracking()

Tracking der Geräteausrichtung mit Bewegungssensoren starten.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

await ScreenOrientation.startOrientationTracking({
  bypassOrientationLock: true
});

// Listen for changes
ScreenOrientation.addListener('screenOrientationChange', (result) => {
  console.log('Orientation changed:', result.type);
});

stopOrientationTracking()

Tracking der Geräteausrichtung mit Bewegungssensoren stoppen.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

await ScreenOrientation.stopOrientationTracking();

isOrientationLocked()

Prüfen, ob die Ausrichtungssperre aktuell aktiviert ist.

import { ScreenOrientation } from '@capgo/capacitor-screen-orientation';

// Start motion tracking first
await ScreenOrientation.startOrientationTracking({
  bypassOrientationLock: true
});

// Check lock status
const status = await ScreenOrientation.isOrientationLocked();
if (status.locked) {
  console.log('Orientation lock is ON');
  console.log('Physical:', status.physicalOrientation);
  console.log('UI:', status.uiOrientation);
}

Die Tabelle oben listet die 13 Kernmethoden auf. Listener- und Version-Helper sowie der vollständige Contract jeder Methode sind in der GitHub Repository.

Events abonnieren

addListener gibt ein Handle zurück. Rufe handle.remove() auf, wenn der Screen unmountet, oder ScreenOrientation.removeAllListeners() auf, um alle Listener zu entfernen.

Vollständige Referenz

• GitHub Repository
• Dokumentation
• API-Referenz

Weiter mit der Verwendung von @capgo/capacitor-screen-orientation

Wenn du es nutzt @capgo/capacitor-screen-orientation verwenden , um natives Media- und Interface-Verhalten zu planen, verbinde es mit @capgo/capacitor-screen-orientation für die Implementierungsdetails in @capgo/capacitor-screen-orientation, Erste Schritte für die Implementierungsdetails in Erste Schritte, @capgo/capacitor-live-activities verwenden für die native Funktion in „@capgo/capacitor-live-activities verwenden“, @capgo/capacitor-live-activities für die Implementierungsdetails in @capgo/capacitor-live-activities und Verwendung von @capgo/capacitor-video-player für die native Funktionalität in „Verwendung von @capgo/capacitor-video-player.“