React-Native 모바일 애플리케이션에서 각속도 감지하기

Question

모바일 애플리케이션에서 사용자가 휴대 전화를 돌리는 속도와 방향을 감지하는 기능을 만들고 싶습니다. 나는 이것이 각속도라고 생각하지만, 틀렸다면 나를 교정 해주십시오.

가치가있는 점은 Expo 개발 도구 및 Expo 가속도계 API를 사용하여 반응 - 네이티브 (Create-Reactive-Native-App)를 사용하여이 아이디어를 실험하고 있습니다. https://docs.expo.io/versions/v15.0.0/sdk/accelerometer.html

제 질문은 아마도 더 근본적인 것입니다. 휴대 전화가 회전하는 속도와 방향을 안정적으로 감지 할 수 있습니까? 필자가 작성한 코드 솔루션은 서로 다른 모바일 장치간에 일관된 값을 제공합니까?

그렇다면 그럴듯한 위업이라면 어떻게 그런 값을 결정할 수 있습니까? 내가 밀리 세컨드에서 밀리 세컨드까지의 값을 비교할 것인가?

내 머리를 맡길 수 있도록 도와 주셔서 감사합니다.

Answer 1

정확한 용어가 확실하지 않지만 자이로 스코프 API를 사용하고 'Z 값'을 모니터링함으로써 내가 찾고있는 가치를 달성 할 수있었습니다. 여기에 제 작업 예제가 있습니다. (expo으로 실행해야 함)

import React from 'react'; 
import Expo, { 
    Gyroscope, 
} from 'expo'; 

import { Text, TouchableOpacity, View } from 'react-native'; 

export default class Test extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     gyroscopeData: { 
     x: 0, 
     y: 0, 
     z: 0 
     }, 
    } 
    } 
    componentDidMount() { 
    this._toggle(); 
    } 

    componentWillUnmount() { 
    this._unsubscribe(); 
    } 

    _toggle =() => { 
    if (this._subscription) { 
     this._unsubscribe(); 
    } else { 
     this._subscribe(); 
    } 
    } 
    _slow =() => { 
    Gyroscope.setUpdateInterval(1000); 
    } 

    _fast =() => { 
    Gyroscope.setUpdateInterval(16); 
    } 
    _subscribe =() => { 
    this._subscription = Gyroscope.addListener((result) => { 
     this.setState({gyroscopeData: result}); 
    }); 
    } 

    _unsubscribe =() => { 
    this._subscription && this._subscription.remove(); 
    this._subscription = null; 
    } 
    render() { 
    let { x, y, z } = this.state.gyroscopeData; 
    return (
     <View> 
     {/*<Text> x: {round(x)}</Text>*/} 
     {/*<Text> y: {round(y)}</Text>*/} 
     <Text> z: {z}</Text> 

     <View> 
      <TouchableOpacity onPress={this._toggle}> 
      <Text>Toggle</Text> 
      </TouchableOpacity> 
      <TouchableOpacity onPress={this._slow}> 
      <Text>Slow</Text> 
      </TouchableOpacity> 
      <TouchableOpacity onPress={this._fast}> 
      <Text>Fast</Text> 
      </TouchableOpacity> 
     </View> 
     </View> 
    ); 
    } 
} 
function round(n) { 
    if (!n) { 
    return 0; 
    } 

    return Math.floor(n * 100)/100; 
}