iOS/Android Phonegap - 智能手机肖像，平板电脑上的风景

我正在用Phonegap创建多设备多平台应用程序。iOS/Android Phonegap - 智能手机肖像，平板电脑上的风景

基本上，我有两种情况：

智能手机应被锁定到肖像模式。
片剂应锁定在风景模式。

我应该能够通过媒体查询自定义布局和布局，具体取决于设备是平板电脑还是智能手机（分别为横向或纵向）。我已经尝试了锁定为纵向，无论设备，然后使用CSS媒体查询和旋转变换，但我有两个问题，运行：

我一直没能找到一个媒体查询目标平板电脑和排除智能手机，反之，决议的范围似乎太稀少。
使用body{transform:rotate(90deg)}看起来像一个噩梦来钉住一切。

我也看了成：https://github.com/champierre/pg-plugin-screen-orientation但它似乎为Android将唯一的工作，我需要同时支持iOS和Android。

有没有人有这方面的经验？有关处理这个定位问题的任何建议？

来源

2013-05-07 Cenobyte321

我有同样的要求（iOS和Android，智能手机的肖像，风景的平板电脑）。你最终做了什么？ – user276648 2013-07-30 08:44:56

您可以使用navigator.userAgent来获取设备类型。例这样的事情：

var deviceType = (navigator.userAgent.match(/iPad/i)) == "iPad" ? "iPad" : (navigator.userAgent.match(/iPhone/i)) == "iPhone" ? "iPhone" : (navigator.userAgent.match(/Android/i)) == "Android" ? "Android" : (navigator.userAgent.match(/BlackBerry/i)) == "BlackBerry" ? "BlackBerry" : "null"; 

alert(navigator.userAgent);

或者你可以使用this page...

的指南后，您可以使用下面的代码来设置方向：

$(window).bind('orientationchange', function(event){ 

    if (/*is tablet*/) { 
    navigator.screenOrientation.set('landscape'); 
    } 
    else if (/* is smart phone */) { 
    navigator.screenOrientation.set('portrait'); 
    } 

    });

我希望上面的代码对你有帮助;）

来源

2013-05-07 17:18:38

谢谢！看起来是一个很好的起点。然而，简单的用户代理检测很难区分任何平板电脑和手机。我发现这个库：http://blog.mobileesp.com/这似乎是工作，我会做一些测试和更新的结果！ – Cenobyte321 2013-05-07 20:26:10

所以我已经能够在手机和平板电脑之间正确检测（稍后会发布代码），但我相信设置screenOrientation的解决方案仅适用于Android？第二块代码使用我已经探索过的Android专用插件？ https://github.com/champierre/pg-plugin-screen-orientation – Cenobyte321 2013-05-07 23:16:18

iOS/Android Phonegap - 智能手机肖像，平板电脑上的风景

回答

相关问题