AppMobiの幅と高さを判断するXDK

Question

私はAppMobi XDKを使いこなし、画面解像度に応じてさまざまなデバイスにスタイリングを適用したいと思っています。問題は、私のシミュレートされたデバイスの幅と高さを判断できないことです。助けてください

Answer 1

あなたはwindow.innerHeightとwindow.innerWidthに基づいてサイズを得ることができます。

XDKにappMobi.device.readyイベントが発生してから300ms +が経過するまで利用できない問題があります。

Answer 2

appMobi.device.readyがトリガされた後、Ianのコメントから300msかかる。

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();  

}  

}。