Screen Orientation

EOL Notice

Screen Orientation will reach its end-of-life on July 1, 2024, and will no longer receive updates or support. Please see Support Policy for additional information.

The Screen Orientation plugin provides the ability to set or lock the screen orientation (landscape or portrait), as well as detect when the orientation has changed.

Installation

If you have not already setup Ionic Enterprise in your app, follow the one-time setup steps.

Next, install the plugin:

Capacitor

npm install @ionic-enterprise/screen-orientation
npx cap sync

Cordova

ionic cordova plugin add @ionic-enterprise/screen-orientation 

Index

Classes

• ScreenOrientation

---

Classes

ScreenOrientation

usage:

import { ScreenOrientation } from '@ionic-enterprise/screen-orientation/ngx';

constructor(private screenOrientation: ScreenOrientation) { }

...

// get current
console.log(this.screenOrientation.type); // logs the current orientation, example: 'landscape'

// set to landscape
this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.LANDSCAPE);

// allow user rotate
this.screenOrientation.unlock();

// detect orientation changes
this.screenOrientation.onChange().subscribe(
  () => {
      console.log("Orientation Changed");
  }
);

advanced: Accepted orientation values:

Value

Description

portrait-primary

The orientation is in the primary portrait mode.

portrait-secondary

The orientation is in the secondary portrait mode.

landscape-primary

The orientation is in the primary landscape mode.

landscape-secondary

The orientation is in the secondary landscape mode.

portrait

The orientation is either portrait-primary or portrait-secondary (sensor).

landscape

The orientation is either landscape-primary or landscape-secondary (sensor).

ORIENTATIONS

● ORIENTATIONS: object

Convenience enum for possible orientations

Type declaration

ANY: string

LANDSCAPE: string

LANDSCAPE_PRIMARY: string

LANDSCAPE_SECONDARY: string

PORTRAIT: string

PORTRAIT_PRIMARY: string

PORTRAIT_SECONDARY: string

---

type

● type: string

Get the current orientation of the device.

---

lock

▸ lock(orientation: string): Promise<any>

Lock the orientation to the passed value. See below for accepted values

Parameters:

Name	Type	Description
orientation	string	The orientation which should be locked. Accepted values see table above.

Returns: Promise<any>

---

onChange

▸ onChange(): Observable<void>

Listen to orientation change event

Returns: Observable<void>

---

unlock

▸ unlock(): void

Unlock and allow all orientations.

Returns: void

---

---