问题标签 [device-orientation]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
4 回答
46563 浏览

android - Android 手机方向概览,包括指南针

一段时间以来,我一直试图了解 Android 方向传感器。我以为我明白了。然后我意识到我没有。现在我想(希望)我再次对它有更好的感觉,但我仍然不是 100%。我将尝试解释我对它的不完整的理解,如果我在部分错误或填写任何空白处,希望人们能够纠正我。

我想我站在经度 0 度(本初子午线)和纬度 0 度(赤道)。这个位置实际上是在非洲海岸附近的海域,但请耐心等待。我把手机放在脸前,让手机底部指向我的脚;我面向北方(朝向格林威治),因此电话的右侧指向东方,指向非洲。在这个方向(参考下图)我有 X 轴指向东方,Z 轴指向南方,Y 轴指向天空。

现在,手机上的传感器允许您在这种情况下计算出设备的方向(而不是位置)。这部分一直让我感到困惑,可能是因为在我接受它确实有效之前,我想了解它是如何工作的。手机似乎使用两种不同技术的组合来确定其方向。

在我开始之前,想象一下你站在那块假想的 0 度纬度和经度的土地上,站在上面提到的方向。还想象一下,你被蒙上眼睛,你的鞋子被固定在操场上的环形交叉路口。如果有人从背后推你,你会向前(朝北)摔倒并伸出双手来阻止摔倒。同样,如果有人推你的左肩,你会用右手摔倒。您的内耳有“重力传感器” (youtube 剪辑),可让您检测您是向前/向后跌倒,还是向左/向右跌倒或跌倒(或向上!!)。因此,人类可以检测到与手机相同的 X 轴和 Z 轴周围的对齐和旋转。

现在想象有人现在在环形交叉路口将你旋转 90 度,这样你现在面向东方。您正在绕 Y 轴旋转。这个轴是不同的,因为我们无法从生物学上检测到它。我们知道我们有一定的角度,但我们不知道相对于地球磁北极的方向。相反,我们需要使用外部工具……磁罗盘。这使我们能够确定我们所面对的方向。我们的手机也是如此。

现在这款手机还配备了一个 3 轴加速度计。我没有了解它们实际上是如何工作的,但我想象它的方式是将重力想象为从天而降的恒定且均匀的“雨”,并将上图中的轴想象为可以检测流过的雨水量的管子。当手机直立时,所有的雨水都会流过 Y '管'。如果手机逐渐旋转,使其屏幕面向天空,流过 Y 的雨量将减少到零,而流过 Z 的音量将稳步增加,直到流过的雨量达到最大。同样,如果我们现在将手机倾斜到一侧,X 管最终将收集到最大量的雨水。因此,根据手机的方向,通过测量流过 3 个管子的雨水量,您可以计算出方向。

这款手机还有一个电子罗盘,其行为类似于普通罗盘——它的“虚拟指针”指向磁北。Android 会合并来自这两个传感器的信息,因此每当生成a SensorEventof时,数组都有 值 [0]:方位角 - (磁北以东的罗盘方位) 值 [1]:俯仰,绕 x 轴旋转(是手机向前或向后倾斜) 值[2]:滚动,围绕 y 轴旋转(手机是向左侧还是右侧倾斜)TYPE_ORIENTATIONvalues[3]


所以我认为(即我不知道)Android 给出方位角(罗盘方位)而不是第三个加速度计读数的原因是罗盘方位更有用。我不确定他们为什么不推荐使用这种类型的传感器,因为现在看来您需要为SensorEvents 类型的系统注册一个侦听器TYPE_MAGNETIC_FIELD。事件的value[]数组需要传递到SensorManger.getRotationMatrix(..)方法中以获取旋转矩阵(见下文),然后将其传递到SensorManager.getOrientation(..)方法中。有谁知道为什么Android团队不推荐使用Sensor.TYPE_ORIENTATION?是效率问题吗?这就是对类似问题的评论之一所暗示的内容,但您仍然需要在development/samples/Compass/src/com/example/android/compass/CompassActivity.java示例。

我现在想谈谈旋转矩阵。(这是我最不确定的地方)所以上面我们有来自 Android 文档的三个数字,我们将它们称为 A、B 和 C。

A = SensorManger.getRotationMatrix(..) 方法图,代表世界坐标系

B = SensorEvent API 使用的坐标系。

C= SensorManager.getOrientation(..) 方法图

所以我的理解是,A 代表“世界坐标系”,我认为它是指地球上的位置以(纬度,经度)和可选(高度)的形式给出的方式。X 是“东”坐标,Y 是“北”坐标。Z 指向天空,代表高度。

手机坐标系如图B所示是固定的。它的 Y 轴总是指向顶部。手机不断计算旋转矩阵,并允许两者之间的映射。那么我认为旋转矩阵将 B 的坐标系转换为 C 的想法是否正确?因此,当您调用SensorManager.getOrientation(..)方法时,您使用的values[]数组的值对应于图 C。当手机指向天空时,旋转矩阵是单位矩阵(矩阵数学等价于 1),这意味着在设备对齐时不需要映射与世界坐标系。

行。我想我现在最好停下来。就像我之前说的那样,我希望人们会告诉我我在哪里搞砸了或帮助了人们(或者让人们更加困惑!)

0 投票
31 回答
384764 浏览

javascript - 检测视口方向,如果方向是纵向显示警告消息,建议用户使用说明

我正在建立一个专门针对移动设备的网站。特别是有一个页面最好在横向模式下查看。

有没有办法检测访问该页面的用户是否以纵向模式查看它,如果是,则显示一条消息,通知用户该页面最好以横向模式查看?如果用户已经在横向模式下查看它,则不会出现任何消​​息。

所以基本上,我希望网站检测视口方向,如果方向是Portrait ,然后显示一条警告消息,建议用户最好在横向模式下查看此页面。

0 投票
5 回答
12867 浏览

objective-c - 如何将某些视图的自动旋转限制为单一方向,同时允许其他视图的所有方向?

这个问题是关于 iOS 设备旋转和 UINavigationController 中的多个受控视图。有些视图应该被限制为纵向,有些应该可以自由地自动旋转。如果您尝试使用三个视图创建最简单的设置,您会注意到自动旋转行为有一些非常讨厌的怪癖。然而,这个场景非常简单,所以我认为我要么没有正确地执行自动旋转,要么我忘记了一些东西。

我有一个非常基本的演示应用程序,它展示了它的奇怪之处,我制作了一个视频来展示它的实际效果。

设置非常基本:三个视图控制器称为FirstViewControllerSecondViewController并且ThirdViewController都扩展了一个AbstractViewController显示带有类名称的标签,并且shouldAutorotateToInterfaceOrientation:当设备处于纵向时返回 YES。SecondViewController 覆盖 this 方法以允许所有旋转。所有三个具体类都添加了一些彩色方块,以便能够通过将控制器推入/弹出UINavigationController. 到目前为止,我会说一个非常简单的场景。

如果您以纵向或横向方向握住设备,这就是我不仅想要实现的结果,而且也是期望的结果。在第一张图片中,您看到所有视图都是“直立的”,而在第二张图片中,您看到只有第二个视图控制器反向旋转了设备的方向。需要明确的是,应该可以从横向模式下的第二个视图导航到第三个视图,但是因为第三个仅支持纵向,所以它应该只以纵向显示。查看结果是否正常的最简单方法是查看载条的位置。

纵向模式下设备的预期视图方向 横向模式下设备的预期视图方向

但是这个问题在这里,因为实际结果完全不同。根据您旋转设备时所处的视图,以及根据您接下来导航到的视图,视图不会旋转(具体而言,该didOrientFromInterfaceOrientation:方法永远不会被调用)。如果您在第二个中处于横向并导航到第三个,它将具有与第二个相同的方向(=坏)。但是,如果您从第二个导航回第一个,屏幕将旋转到“强制”纵向模式,并且载体栏将位于设备的物理顶部,无论您如何握住它。视频更详细地展示了这一点。

横向模式下设备的实际视图方向

我的问题是双重的:

  1. 为什么第一个视图控制器旋转回来,而不是第三个?
  2. 当您只希望某些视图自动旋转而不希望其他视图自动旋转时,需要做什么才能从您的视图中获得正确的行为?

干杯,EP。

编辑:作为悬赏之前的最后手段,我完全重写了这个问题,使其更短、更清晰,并希望能更有吸引力地给出答案。

0 投票
3 回答
8805 浏览

android - Android:理解函数remapCoordinateSystem

我一直在尝试理解这两行代码

我阅读了 的文档remapCoordinateSystem(),但是我迷路了。

谁能向我解释到底是做什么getRotationMatrixremapCoordinateSystem?特别是SensorManager.AXIS_XSensorManager.AXIS_MINUS_Z

0 投票
1 回答
2253 浏览

jquery - 在加载时评估orientationEvent?

我正在开发一个网络应用程序,它需要我根据orientationEvent 更改内容。到目前为止,它运行良好,在我改变方向时改变和设置内容。但是,我需要orientationEvent 也可以触发onLoad。这可能吗?

0 投票
1 回答
6545 浏览

jquery - 评估orientationEvent并设置一个值?

如果在发生方向更改时触发了 onChange 函数,我如何在 onChange 中设置一个值来更新 jquery 选择器。例如:

0 投票
1 回答
457 浏览

iphone - iPhone 的 UITabBar 作为应用程序窗口的一部分;旋转设备时的问题

我有一个 iPhone 应用程序,它使用导航控制器来显示顶栏(带有标题和后退按钮,等等......)。

UITabBar在应用程序窗口中添加了一个,可以在它的各个部分之间切换。我没有将标签栏添加到 ViewController 的每个视图中,而是将标签栏添加到应用程序窗口中。

(当我在 ViewController 中使用它时,控制器之间的切换使标签栏向左/向右滑动,当动画弹出/推送发生时,以及整个视图)。

因此,我添加了UITabBarMainWindow.xib并将其绑定到应用程序委托的变量。在我的didFinishLaunchingWithOptions方法中,我添加了以下代码:

调整主(navigationController's)视图的大小,以使 TabBar 可见。

当我旋转设备时,问题就出现了——我的视图被拉伸到全窗口并且我失去了显示 TabBar 的能力。

我在 ViewController 中添加了一个- (void) didRotateFromInterfaceOrientation:(UIInterfaceOrientation) fromInterfaceOrientation方法,代码如下:

它调整视图的大小,并将标签栏移动到视图的上/下部分(我在这里只允许纵向/纵向倒置方向)。问题是,我的 TabBar 也颠倒了,而且它不再可点击。

如下图所示:

标签栏倒置

有谁知道如何处理这种情况?或者,如何让标签栏不绑定到视图控制器,同时又能流畅地处理界面的旋转?

0 投票
2 回答
1342 浏览

html - 如何防止移动Safari中的方向改变后获得额外的宽度

在 iPad 上的 Mobile Safari 中,更改设备方向后出现一些奇怪的行为。这是我的测试文件:

您可以通过以下 URL 在 Mobile Safari 中查看它:

http://fiddle.jshell.net/eterps/jsTqj/show/

当我使用 iPad 纵向访问 URL 并做出一些滑动手势时,页面不会滚动,这是正确的。

但是,当我将设备旋转到横向模式并做出一些滑动手势时,我在右侧获得了额外的空间,没有明显的原因。

但更奇怪的是,当我重新启动移动 Safari 并在一直处于横向时转到 URL 时,右侧的额外空间不存在。

为什么方向改变后会出现右侧的多余空间?我该如何预防呢?

0 投票
3 回答
1275 浏览

ios - 如何正确发布`UIDeviceOrientationDidChangeNotification`?

我正在尝试UIViewController通过设备方向通知我重新应用布局。为此,我将发布UIDeviceOrientationDidChangeNotification到默认中心。它有效,但没有旋转动画。我想我错过了一些东西。我怎样才能UIDeviceOrientationDidChangeNotification正确发布?

0 投票
0 回答
1317 浏览

iphone - 设备旋转手动旋转视图

我使用此方法根据方向手动旋转一些视图和子视图:

现在这适用于从横向旋转到纵向但是如果我尝试旋转到横向框架 CGRect 没有任何逻辑意义(它看起来像(200,-50,宽度,高度)。我也必须努力设置纵向框架,如果我得到 self.view.frame 或边界或其他任何我检查的框架,每次旋转时它都会改变。

有没有更好的方法来设置更合乎逻辑且不硬编码的框架?