リンク「 http://public.dhe.ibm.com/software/mobile-solutions/worklight/docs/v610/05_03_Supporting_multiple_form_factors_using_Worklight_skins.pdf 」を参照して、Android デバイス用の Worklight ランタイム スキンのサンプルを作成しています。携帯電話/タブレットにスキンを適用するために JS、CSS、および HTML を変更しました。これは Worklight Preview で正常に動作することがテストされています。
しかし、実際のデバイスで同じコードを実行しようとすると、期待どおりに適切な出力が得られません。その理由は、skinLoader.js の「getSkinName()」機能が有効な結果を返さないためです。デバイスがモバイルかタブレットかを検出するために次のコードを使用しようとしましたが、両方の関数が無効な出力を出しました。
UserAgent を使用してデバイスを検出します。 //常に「android.phone」スキンを返します。
function getSkinName() {
var userAgent = navigator.userAgent;
var skinName = "default";
alert(userAgent);
//android tablet
if(userAgent.toLowerCase().indexOf("android") != -1 &&
userAgent.toLowerCase().indexOf("mobile") == -1){
skinName = "default";
alert("tablet!");
}
//android phone
else if(userAgent.toLowerCase().indexOf("android") != -1 &&
userAgent.toLowerCase().indexOf("mobile") != -1){
skinName = "android.phone";
alert("phone!");
}
return skinName;
}
デバイスの幅を使用してデバイスを検出します: //方向を超えて正しく動作しません
function getSkinName() {
var skinName = "default";
var hres = screen.width || window.innerWidth || 320;
var ratio = window.devicePixelRatio || 1;
if (ratio == 0) {
ratio = 1;
}
var virtWidth = hres / ratio;
if (virtWidth >= 640) {
skinName = "android.tablet";
}
return skinName;
}
適切に機能するように getSkinName() を修正することについての考えを共有してください。