React Native plugin for QuickPose ML pose estimation SDK. Provides real-time body tracking, fitness rep counting, range of motion measurement, and skeleton overlays on iOS and Android.

npm install @quickpose/react-native

cd ios && pod install

The podspec automatically pulls QuickPose iOS pods (QuickPoseCore, QuickPoseCamera, QuickPoseSwiftUI).

No extra steps — Gradle resolves QuickPose + CameraX dependencies automatically.

Register for a free SDK key at https://dev.quickpose.ai.

import { QuickPoseView } from '@quickpose/react-native';

<QuickPoseView
  sdkKey="your-key-here"
  features={['overlay.wholeBody']}
  useFrontCamera={true}
  style={{ flex: 1 }}
  onUpdate={(event) => {
    const { results, feedback } = event.nativeEvent;
    // results = [{ feature: string, value: number }]
    // feedback = string | null
  }}
/>

Side variants: append .left or .right (e.g. raisedFingers.left).

Every feature accepts a QuickPoseStyle via the featureStyles prop, keyed by the feature string. An optional #variant suffix names a styled variant of the same feature (overlay.wholeBody#glow).

<QuickPoseView
  features={['overlay.wholeBody']}
  featureStyles={{
    'overlay.wholeBody': {
      color: '#00FF88',
      relativeLineWidth: 1.5,
      lineCap: 'round',
      linePattern: 'dashed',
      shadow: {color: '#00FF88', radius: 14, offsetX: 0, offsetY: 0},
      outline: {color: '#000000', relativeWidth: 0.3},
      imageFill: Image.resolveAssetSource(require('./flames.png')).uri,
      fontName: 'Bungee-Regular',
      letterSpacing: 0.08,
      conditionalColors: [{min: 120, color: '#00FF00'}],
    },
  }}
/>

See the QuickPose styling docs for what each option draws. imageFill reveals an image through the skeleton's lines, points and labels; fontName and letterSpacing style the measurement labels; a shadow with zero offset in the line's own color renders as a glow.

Each example is a complete React Native app that depends on @quickpose/react-native via "file:.." (local symlink). No npm publish required to run them.

• React Native environment setup (Xcode, Android Studio, etc.)
• CocoaPods (gem install cocoapods)
• A free SDK key from https://dev.quickpose.ai
• Physical device for camera access (iOS Simulator / Android Emulator won't work)

# 1. Install JS dependencies
cd example-basic
npm install

# 2. Add your SDK key in App.tsx (replace "YOUR SDK KEY HERE")

# 3. iOS
cd ios && pod install && cd ..
npx react-native run-ios --device

# 4. Android (physical device connected via USB)
npx react-native run-android

Minimal demo — whole body overlay in ~50 lines of React Native code. Mirrors the native iOS BasicDemo.

Fitness exercise with real-time feedback text and progress bar. Demonstrates fitness.frontRaises with the onUpdate callback. Mirrors the native iOS FeedbackDemo.

Full feature picker with category menus, rep counter, and hold timer. Browse all overlay, ROM, fitness, and input features at runtime. Mirrors the native iOS/Android PickerDemo.

The original AwesomeProject — a manual bridge reference for users who want full control over the native bridge code. Does not use the plugin; bridge files are embedded directly in the app.

• React Native >= 0.60
• iOS 15+
• Android SDK 26+ (physical device required for camera)

• iOS SDK: https://github.com/quickpose/quickpose-ios-sdk
• Android SDK: https://github.com/quickpose/quickpose-android-sdk
• Documentation: https://docs.quickpose.ai
• SDK Keys: https://dev.quickpose.ai