How to get device width and height in Ionic using TypeScript?
Try using window.innerHeight and window.innerWidth to get height and width of the device respectively.
You can use the Platform information for this.
Internally the platform
uses the window.innerWidth
and window.innerHeight
but
Using this method is preferred since the dimension is a cached value, which reduces the chance of multiple and expensive DOM reads.
Ionic 4/5
Docs: https://ionicframework.com/docs/angular/platform#width-number
import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';
@Component({...})
export MyApp {
constructor(platform: Platform) {
platform.ready().then(() => {
console.log('Width: ' + platform.width());
console.log('Height: ' + platform.height());
});
}
}
Ionic 2/3
Docs: https://ionicframework.com/docs/v3/api/platform/Platform/#width
import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
@Component({...})
export MyApp {
constructor(platform: Platform) {
platform.ready().then(() => {
console.log('Width: ' + platform.width());
console.log('Height: ' + platform.height());
});
}
}