mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-23 20:01:01 +08:00
Listen to device orientation changes
Summary: Similar to iOS, send device orientation changes events. This does not have the `getCurrentOrientation` method, because it's not used. If necessary, we'll add it separately. This also adds a simple example for testing. We listen to orientation changes in `onGlobalLayout`, and check if the rotation of the device has changed. If it has, we emit the event. But: - `onGlobalLayout` (and `onConfigurationChanged` - which is the method usually used for checking for device orientation changes) is *not* called when the device goes from landscape to reverse landscape (same with portrait), as that is not a relayout / configuration change. We could detect if this happens with the help of an `OrientationEventListener`. However, this listener notifies you if the degree of the phone changes by a single degree, which means that you need to know by how many degrees the phone needs to change in order for the orientation to change. I haven't looked into how accurate this could be, but I suspect that in practice it would cause a lot of bugs. A simple `abgs` and google search reveals that everybody uses a different margin for detecting a rotation change (from 30 to 45 degrees), so I suspect that this won't work as expected in practice. Therefore, we're not using this here, and we're sticking to what android provides via `onConfigurationChanged`. If we find that we have issues because users need to know when the user goes from landscape to reverse landscape, then we'll have to revisit this. Reviewed By: foghina Differential Revision: D3797521 fbshipit-source-id: 62508efd342a9a4b41b42b6138c73553cfdefebc
This commit is contained in:
committed by
Facebook Github Bot 4
parent
5d240a8ed3
commit
f07ca31303
@@ -23,8 +23,8 @@
|
||||
'use strict';
|
||||
|
||||
export type UIExplorerExample = {
|
||||
key: string;
|
||||
module: Object;
|
||||
key: string,
|
||||
module: Object,
|
||||
};
|
||||
|
||||
const ComponentExamples: Array<UIExplorerExample> = [
|
||||
@@ -235,6 +235,10 @@ const APIExamples: Array<UIExplorerExample> = [
|
||||
key: 'NetInfoExample',
|
||||
module: require('./NetInfoExample'),
|
||||
},
|
||||
{
|
||||
key: 'OrientationChangeExample',
|
||||
module: require('./OrientationChangeExample'),
|
||||
},
|
||||
{
|
||||
key: 'PanResponderExample',
|
||||
module: require('./PanResponderExample'),
|
||||
|
||||
Reference in New Issue
Block a user