Need help upgrading to Ionic Framework 4.0? Get assistance with our Enterprise Migration Services EXPLORE NOW

Screen Orientation

Improve this doc

Cordova plugin to set/lock the screen orientation in a common way.

Requires Cordova plugin: cordova-plugin-screen-orientation. For more info, please see the Screen Orientation plugin docs.

Repo: https://github.com/apache/cordova-plugin-screen-orientation

Installation

  1. Install the Cordova and Ionic Native plugins:
    $ ionic cordova plugin add cordova-plugin-screen-orientation
    $ npm install --save @ionic-native/screen-orientation@4
    
  2. Add this plugin to your app's module

Supported platforms

Usage

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

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");
   }
);

Instance Members

ORIENTATIONS

Convenience enum for possible orientations

onChange()

Listen to orientation change event

Returns: Observable<void>

lock(orientation)

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

Param Type Details
orientation string

The orientation which should be locked. Accepted values see table above.

Returns: Promise<any>

unlock()

Unlock and allow all orientations.

type

Get the current orientation of the device.

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).

API

Native

General