React Native (Android/ iOS)

Step by step guide to help you with Leap React Native Library Integration
This guide will help you set up the Leap platform for Android/iOS devices. You can follow the steps below to integrate Leap SDK before using your dashboard to create in-app experiences.
Prerequisites
You will need the API key.
For React Native, you need to add tags to the views. Here is how you can do it.​
Leap ReactNative SDK is incompatible with managed workflow. If you are using expo to start your react-native project, please make sure to eject to the bare workflow.​
Android
The minimum API version support for Leap SDK is API 16. But Leap works only for API levels greater or equal to 21.
An Android 5.0 or newer device or emulator with Google Play services installed.
Leap ReactNative SDK only supports androidX so your project should be using react native version 0.61.0 and above.
iOS
Leap SDK's minimum deployment target is iOS 10. But Leap works only for devices running on iOS 11 and above
SDK Installation
Note: Ensure that you complete both the steps in order to create and test the in-app experience in your integrated build.
Step 1. Integrate Leap SDK
1.a Add Leap dependency
Download leap-react-native package from npm using the following command
Android
iOS
// Using npm
npm install leap-react-[email protected]1.6.1 --save
​
// Using yarn
yarn add leap-react-[email protected]1.6.1
// Using npm
npm install leap-react-[email protected]1.6.1 --save
​
// Using yarn
yarn add leap-react-[email protected]1.6.1
​
cd ios && pod install
​
// To update Leap iOS SDK once installed, run the following command
pod update
For release notes check here​
1.b Start Leap SDK
To start Leap add the following inside componentDidMount() {} in your App.js
Android
iOS
import LeapReactNative from 'leap-react-native';
​
export class App extends React.Component {
	componentDidMount() {
		Platform.select({
			android: () => LeapReactNative.start('API_KEY')
		})()
	}
}
​
import LeapReactNative from 'leap-react-native';
​
export class App extends React.Component {
	componentDidMount() {
		Platform.select({
			ios: () => LeapReactNative.start('API_KEY')
		})()
	}
}
​
Step 2. Enable 'Creator mode' in your app
To create in-app experiences in the Leap Studio, you will need to enable the 'Creator mode' in your app. This can be done by integrating the Leap Creator SDK.
2.a Add Dependencies
Note - The Leap Creator SDK must be removed before going live to PlayStore
Download leap-creator-react-native package from npm using the following command
Android
iOS
// Using npm
npm install leap-creator-react-[email protected]1.6.1 --save
​
// Using yarn
yarn add leap-creator-react-[email protected]1.6.1
// Using npm
npm install leap-creator-react-[email protected]1.6.1 --save
​
// Using yarn
yarn add leap-creator-react-[email protected]1.6.1
​
cd ios && pod install
​
// To update Leap creator iOS SDK once installed, run the following command
pod update
2.b Start Leap Creator SDK
To start Leap creator add the following inside componentDidMount() {} in your App.js
Android
iOS
import LeapCreatorReactNative from 'leap-creator-react-native';
​
export class App extends React.Component {
	componentDidMount() {
		Platform.select({
			android: () => LeapCreatorReactNative.start('API_KEY')
		})()
	}
}
​
import LeapCreatorReactNative from 'leap-creator-react-native';
​
export class App extends React.Component {
	componentDidMount() {
		Platform.select({
			ios: () => LeapCreatorReactNative.start('API_KEY'),
		})()
	}
}
​
Prerequisites
Last modified 1mo ago