Skip to main content

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