Screen Orientation

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:

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

Index#

Classes#


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:

NameTypeDescription
orientationstringThe 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