react-native-motion-manager

CMMotionManager包装器
授权协议 未知
开发语言 Objective-C JavaScript
所属分类 手机/移动开发、 手机开发包
软件类型 开源软件
地区 不详
投 递 者 楚洋
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

react-native-motion-manager 是 CMMotionManager 对 react-native 的封装, 是 React Native 的动力传感器(加速计,陀螺计,磁力计)组件。

添加到你的项目:

  1. npm install react-native-motion-manager@latest --save

  2. 在 XCode 的项目导航右击  LibrariesAdd Files to [your project's name]

  3. 转到 node_modulesreact-native-motion-manager 然后添加 RNMotionManager.xcodeproj

  4. 在 XCode 项目导航选择你的项目,添加 libRNMotionManager.a 到你项目的 Build PhasesLink Binary With Libraries

  5. 在项目导航中点击 RNMotionManager.xcodeproj 然后转向 Build Settings 标签。确保  'All' 勾选上 (替代 'Basic')。查看 Header Search Paths 确保它包括 $(SRCROOT)/../react-native/React$(SRCROOT)/../../React - ,把两个都标记为 recursive

  6. 运行你的项目 (Cmd+R)

Api

安装

var {
    Accelerometer,
    Gyroscope,
    Magnetometer
} = require('NativeModules');
var {
  DeviceEventEmitter // will emit events that you can listen to
} = React;

Accelerometer

Accelerometer.setAccelerometerUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('AccelerationData', function (data) {
  /**
  * data.acceleration.x
  * data.acceleration.y
  * data.acceleration.z
  **/
});
Accelerometer.startAccelerometerUpdates(); // you'll start getting AccelerationData events above
Accelerometer.stopAccelerometerUpdates();

Gyroscope

Gyroscope.setGyroUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('GyroData', function (data) {
  /**
  * data.rotationRate.x
  * data.rotationRate.y
  * data.rotationRate.z
  **/
});
Gyroscope.startGyroUpdates(); // you'll start getting AccelerationData events above
Gyroscope.stopGyroUpdates();

Magnetomer

Magnetometer.setAccelerometerUpdateInterval(0.1); // in seconds
DeviceEventEmitter.addListener('MagnetometerData', function (data) {
  /**
  * data.magneticField.x
  * data.magneticField.y
  * data.magneticField.z
  **/
});
Magnetometer.startMagnetometerUpdates(); // you'll start getting AccelerationData events above
Magnetometer.stopMagnetometerUpdates();
  • 原文地址:Animated Transition in React Native! 原文作者:Jiří Otáhal 译文出自:掘金翻译计划 本文永久链接:github.com/xitu/gold-m… 译者:talisk 校对者:foxxnuaa 这篇文章有近 15k 的浏览量。对某些人来说,这可能没什么,但对我来说是一个很大的动力。这正是我决定构建 Pineapple — Financial

 相关资料
  • React Motion 是一个 React 弹性动画库,使用 0-10 的弹性参数进行动画处理: import {Motion, spring} from 'react-motion';// In your render...<Motion defaultStyle={{x: 0}} style={{x: spring(10)}}>  {value => <div>{value.x}</div>

  • 我在全球范围内安装了react native,并确认安装在Windows 10上。然后,我在PowerShell中运行react-native命令来安装materials kit和vector图标。这些包的安装失败,该目录不再被视为react本机项目目录。因此,我必须重新安装react native。 如何在不导致系统卸载react native的情况下安装materials kit和vector

  • 今天,我使用“React-Native-Firebase”和“Native-Base”包创建了一个(空的)Android应用程序。它在调试模式下工作,但在释放模式下发生崩溃。 重现问题的步骤: > 创建新应用程序

  • 我是的初学者,通过遵循本教程,尝试在我的android应用程序中安装

  • 当我尝试使用以下命令生成发布版本时: CDAndroid&&./Gradlew汇编 在以下目录中生成一个apk文件:

  • 每一行中的项目将根据其文本大小而有所不同。Flatlist用于呈现项目。 TagView.js 风格 结果 但这里的项目没有用设备宽度包装。有没有包装内容物?