Question

我正在Windows Phone上使用Phonegap构建应用程序。在我添加的CSS中

@-ms-viewport {
    width: device-width;
}

正在解决720p和1080p分辨率的问题。当我开始构建时，我注意到在某些模拟器上，视口和缩放是完美的，而在其他模拟器上则非常糟糕，就像视口根本不起作用一样。模拟器适用于Windows Phone 8.0和8.1。

有人知道如何修复不同操作系统的视口吗？

Answer 1

我有类似的问题。我通过将其添加到CordovaView.xaml.cs

来解决它

string os = Environment.OSVersion.ToString();
string result = Regex.Replace(os, "[A-Za-z ]", "");
return new Uri(AppRoot + "www/index.html#os=" + result, UriKind.Relative);

而不是：

return new Uri(AppRoot + "www/index.html", UriKind.Relative);

然后在我的index.html中根据操作系统版本加载不同的css文件：

try {
    var os = window.location.hash.slice(window.location.hash.indexOf('#') + 1).replace('os=', '').substr(0, 5);
    if (os == '8.0.1') {
        document.writeln('<link rel="stylesheet" href="static/styles/windows_8.css" />');
    } else {
        document.writeln('<link rel="stylesheet" href="static/styles/windows_8_1.css" />');
    }
} catch (e) {
    document.writeln('<link rel="stylesheet" href="static/styles/windows_8_1.css" />');
}

windows_8.css：

@-ms-viewport {
   width: 480px;
   height: 800px;
}

windows_8_1.css：

@-ms-viewport {
   width: device-width;
}

我希望，这有帮助。它对我有用。

Phonegap Winodows Phone 8.0和8.1视口问题

1 个答案: