Кордова: Как получить ширину и высоту приложения?

Question

Мне нужно использовать JavaScript, чтобы получить ширину и высоту окна для моего приложения android cordova.

Я попытался $(window).width() and $(window).height() из библиотеки JQuery, но результаты темпераментны:

Я проверяю на Nexus 7, и когда я открываю приложение в портретном режиме я ширина = 600, высота = 888.

когда я повернуть устройство на альбомную и пересчитывать размеры не меняются, когда они должны были поменять местами, и когда я повернуть устройство, чтобы вернуться к портрету я ширина = 960, высота = 528.

Я очень смущен по этому результату, и это заставляет меня думать, что я использую неправильный код. Я был бы очень благодарен за помощь или предложения.

Вот функция для получения размеров экрана:

function getDimensions() { 
    //Gets height and width of web browser 
    var height = $(window).height(); 
    var width = $(window).width(); 

    //Stores dimensions in array of form [width,height] 
    var dimensions = [width,height]; 

    return dimensions; 
} 

Вот где я проверить размеры после вращения:

function onOrientationChange() { 
    var dimensions = getDimensions(); 
    console.log("rotation width " + dimensions[0] + " height " + dimensions[1]); 
} 

Answer 1

Try: вар ш = window.innerWidth; var h = window.innerHeight; Я знаю, что это работает в веб-браузере

Answer 2

Вы должны работать с orientationchangeсобытия:

Событие orientationchange срабатывает, когда ориентация устройства изменилось.

И свойство Window.orientation, который содержит число, представляющее текущую ориентацию (проверьте изображение ниже для получения более подробной информации).

Обратите внимание!: window.orientation возвращает undefined в настольных браузерах. Так что PLS тест на эмулятор или устройство.

Решение:

1. Приложить orientationchange событие глобального объекта окна.
2. Проверьте значение ориентации и выполните некоторую логику внутри.

window.addEventListener("orientationchange", orientationChange); 
 

 
function orientationChange() { 
 
    switch (window.screen.orientation) { 
 
    case "landscape-primary": 
 
     //your function over here: getDimensions(); 
 
     break; 
 
    case "portrait-primary": 
 
     //your function over here: getDimensions(); 
 
     break; 
 
    default: 
 
     break; 
 
    } 
 
}