ReactNative SDK 3.7.1

Sample Code

The quickest and simplest way to kickstart your journey with the ReactNative SDK is by downloading and experimenting with our full-featured sample code:

• ReactNative Sample Code

IMPORTANT

In the above sample codes, the strings __YOUR_USER_ID__ and __YOUR_API_KEY__ should be replaced by your own User ID and API Key repectively. Please contact us to obtain your User ID and API Key.

SDK Installation

In your ReactNative project, install the SDK with the npm install or yarn add commands:

npm

npm install "https://sdk.panoptic.ai/npm/react-native-vital-sign-plugin-3.7.1.tgz"

yarn

yarn add "https://sdk.panoptic.ai/npm/react-native-vital-sign-plugin-3.7.1.tgz"

TIP

If you are using Yarn v2 or later, you might need to include the package name in the command, such as yarn add vital-sign-camera@"https://sdk.panoptic.ai/npm/react-native-vital-sign-plugin-3.7.1.tgz".

Project Integration (for iOS)

For iOS Deployment Target 12 or above

This version of SDK support iOS 11 or above. If targeting iOS 12 or above, one of the dependencies ZIPFoundation needs to have deployment target of iOS 11. Please update the Podfile to force ZIPFoundation's deployment target to 11:

post_install do |installer|
    installer.pods_project.targets.each do |target|
      target.build_configurations.each do |config|
        if target.name == 'ZIPFoundation' || target.name == 'PromiseKit'
          config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '11.0'
        else
          config.build_settings['IPHONEOS_DEPLOYMENT_TARGET'] = '12.4'
        end      
        # Force CocoaPods targets to always build for x86_64
        config.build_settings['ARCHS[sdk=iphonesimulator*]'] = 'x86_64'
      end
    end
end

Use static framework linking

Add the following to Podfile use static framework linking:

use_frameworks! :linkage => :static

Also, disable Flipper by removing or commenting out the fipper_configuration line:

# Note that if you have use_frameworks! enabled, Flipper will not work and
# you should disable the next line.
# use_flipper!()

Camera Permission

When developing for iOS, you need to allow the app to use the camera by specifying the following in the file Info.plist:

<key>NSCameraUsageDescription</key>
<string>Use for measuring vital signs</string>

TIP

In Info.plist, the string "Use for measuring vital signs" is an example description of the camera usage. You should specify your own description that matches the usage of your application.

Project Integration (for Android)

Add the following dependencies to app/build.gradle:

dependencies {

    // Add the following dependencies.
    implementation files('../../node_modules/react-native-vital-sign-plugin/android/libs/vital-sign-engine-debug.aar')

    // ...
}

Camera Permission

When developing for Android, you need to allow the app to use the camera by specifying the following in the file AndroidManifest.xml:

<uses-permission android:name="android.permission.CAMERA" />

What's new

3.7.1 (22-Jan-2024)

• Fixed the blank camera problem on some Android devices.
• Added enableAgeProjection property. If it is not set, default is true.
• The property device is changed to optional.
• Improved iOS simulator support.

IMPORTANT

To avoid the Android blank camera problem, please update the code to pass in the correct device to the component. It is because some Android devices do not have the wide-screen-camera. An althernative to fix the problem is to omit the device property and let the SDK to select the correct camera. For detail, please refer to the sample code.