在HTML5中检测iPad Mini

苹果的iPad Mini在很多方面都是iPad 2的小复制品。在JavaScript中，是窗口。navigator对象为Mini和iPad 2暴露相同的值。到目前为止，我为检测差异而进行的测试还没有成功。

为什么这很重要?

由于iPad Mini和iPad 2的屏幕像素相同，但实际尺寸(英寸/厘米)不同，它们的PPI(每英寸像素)也不同。

为了提供友好的用户界面，web应用程序和游戏会根据用户的拇指或手指位置调整某些元素的大小，因此，我们可能想要缩放某些图像或按钮以提供更好的用户体验。

到目前为止我尝试过的事情(包括一些非常明显的方法):

window.devicepixelratio CSS元素宽度，单位为cm CSS媒体查询(如分辨率和-webkit-device-pixel-ratio) SVG图形在类似的单位在设定的时间内进行各种CSS webkit转换，并使用requestAnimFrame计算呈现的帧数(我希望检测到可测量的差异)

我没办法了。你呢?

更新谢谢你的回复。我想对那些投票反对检测iPad mini和iPad 2的人发表评论，因为苹果有一个规则。好吧，这是我的理由，为什么我觉得知道一个人用的是iPad mini还是iPad 2真的很有意义。随你怎么解释我的推理。

The iPad mini is not only a much smaller device (9.7 inch versus 7.9 inch), but its form factor allows for a different usage. The iPad 2 is usually held with two hands when gaming unless you're Chuck Norris. The mini is smaller, but it is also much lighter and allows for gameplay where you hold it in one hand and use another to swipe or tap or whatnot. As a game designer and developer myself, I'd just like to know if it's a mini so I can choose to provide the player with a different controlscheme if I want (for instance after A/B testing with a group of players).

为什么?事实证明，大多数用户倾向于使用默认设置，所以当玩家第一次加载游戏时，不要使用虚拟拇指杆，而是在屏幕上放置一些基于点击的控制，这是我和其他游戏设计师希望能够做到的。

所以恕我说，这超出了粗手指/指导方针的讨论，这是苹果和所有其他供应商应该做的事情:允许我们唯一地识别你的设备，以不同的方式思考，而不是遵循指导方针。

当前回答

这让我想起了电影《均衡》中的一句话:

“你说，什么是最简单的方法来从一个文法教士那里拿走武器?” “你问他要吧。”

我们太习惯于为解决方案而斗争了，但有时候，问问自己可能更好。(我们通常不这么做是有充分理由的，但这总是一种选择。)这里的所有建议都很棒，但一个简单的解决方案可能是让你的程序在启动时询问他们使用的是哪台iPad。

我知道这个回答有点厚颜无耻，但我希望这能提醒我们，我们不必为所有事情而奋斗。(我已经做好了接受反对票的准备。: P)

一些例子:

操作系统安装期间的键盘检测有时无法检测到特定的键盘，所以安装程序必须询问。 Windows询问是否您连接的网络是家庭网络或公共网络。计算机无法识别即将使用它的人，所以它们需要用户名和密码。

祝你好运——我希望你能找到一个很棒的解决方案!如果你没有，不要忘记这一点。

2012-11-15 20:47:21

其他回答

是的，这是一个检查陀螺仪的好点。你可以很容易地做到

https://developer.apple.com/documentation/webkitjs/devicemotionevent

或者类似的东西

window.ondevicemotion = function(event) {
    if (navigator.platform.indexOf("iPad") != -1 && window.devicePixelRatio == 1) {
        var version = "";
        if (event.acceleration) version = "iPad2";
        else version="iPad Mini";

        alert(version);
    }
    window.ondevicemotion = null;
}

没有ipad来测试。

2012-11-14 10:47:41

这是一个疯狂的镜头，但iPad 2和iPad mini的区别之一是前者没有三轴陀螺仪。也许可以使用WebKit设备定向API来查看您可以从中获得什么样的信息。

例如，该页似乎建议您只有在设备具有陀螺仪时才能获得rotationRate值。

对不起，我不能给一个工作POC -我没有访问iPad mini。也许对这些定向api有更多了解的人可以在这里插话。

2012-11-14 10:17:53

你总是可以问用户?!

如果用户不能看到按钮或内容，那么就给他们一种自己管理缩放的方法。您总是可以在站点中构建一些缩放按钮，以使内容(文本/按钮)变大/变小。这将(几乎)保证适用于任何iPad当前的分辨率，也可能适用于苹果公司决定的任何未来分辨率。

2012-11-14 16:07:41

iPad 2和iPad Mini的电池大小不同。

If iOS 6 supports it, you can get the current battery level from 0.0..1.0 using window.navigator.webkitBattery.level. At some level either in hardware or software, that is likely calculated as CurrentLevel / TotalLevel, where both are ints. If so, that will result in a float which is a multiple of 1 / TotalLevel. If you take lots of battery level readings from both devices, and calculate battery.level * n you might be able to find a value of n where all the results start to be close to integers, which will give you iPad2TotalLevel and iPadMiniTotalLevel.

如果这两个数字不同，并且相互素数，那么在生产中您可以计算电池。* iPad2TotalLevel和电池。level * iPadMiniTotalLevel。更接近整数的值将指示正在使用的设备。

对不起，这个答案中有太多的如果!希望会有更好的事情发生。

2012-11-14 18:28:46

我通过创建一个iPad mini可以渲染的更大的画布来检测iPad mini，填充一个像素，然后读取颜色。iPad mini显示的颜色是“000000”。其他的都是渲染为填充色。

部分代码:

function rgbToHex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}
var test_colour = '8ed6ff';
working_context.fillStyle = '#' + test_colour;
working_context.fillRect(0,0,1,1);
var colour_data = working_context.getImageData(0, 0, 1, 1).data;
var colour_hex = ("000000" + rgbToHex(colour_data[0], colour_data[1], colour_data[2])).slice(-6);

我需要这个画布大小，所以它的特征检测在我的用例。

2015-10-26 16:37:20

在HTML5中检测iPad Mini

推荐文章

最新文章

标签