確定AppMobi中的寬度和高度XDK

Question

我很喜歡AppMobi XDK，並希望根據屏幕分辨率在不同的設備上應用一些樣式。問題是我無法確定我的任何模擬設備的寬度和高度。請幫助

Answer 1

您可以根據window.innerHeight和window.innerWidth獲取大小。

XDK中存在一個問題，它在appMobi.device.ready事件觸發後300ms內無法使用。

Answer 2

從Ian評論它需要300ms後appMobi.device.ready觸發。

在index.html文件中，只需在onDeviceReady函數內添加setTimeout即可。

var onDeviceReady=function(){ 
    //Size the display to 768px by 1024px 
    // AppMobi.display.useViewport(768,1024); 
    //hide splash screen 
    AppMobi.device.hideSplashScreen(); 

    setTimeout(setDisplayScreen, 300); 

}; 

在我的情況下，我只是想在頁面的底部有腳註，我已經把它設置在PX。

function setDisplayScreen(){ 
    var dHeight = window.innerHeight; 
    document.getElementById("footer").style.top = dHeight - 70 + "px"; 

} 

它工作得很好。 在頁腳出現之前有一小段延遲，但這並不壞。

Answer 3

問題是設備準備就緒時窗口高度不正確。這種精細工作對我來說：

VAR onDeviceReady =函數（）{

intel.xdk.device.setRotateOrientation("any"); 
intel.xdk.device.setAutoRotate(true); 

setTimeout(setDisplayScreen, 300); 

function setDisplayScreen() { 
    var dHeight = window.innerHeight; 
     $('body').css('height', dHeight) 
    intel.xdk.device.hideSplashScreen();  

}  

};