- 20 Nov 2024
- 3 Minutes To Read
-
Print
-
DarkLight
-
PDF
Integrate Whatfix Mobile SDK with Jetpack Compose
- Updated On 20 Nov 2024
- 3 Minutes To Read
-
Print
-
DarkLight
-
PDF
To create Whatfix Mobile in-app experiences on your Jetpack Compose apps, you need to first set up Whatfix Mobile. Add the Whatfix Mobile SDK provided for Android devices to the source code of your app and then create and publish content.
Prerequisites
- API Key
- The minimum API version support for Whatfix Mobile SDK is API 16. But Whatfix Mobile works only for API levels greater or equal to 21.
- The highest tested API level is 35, which corresponds to Android OS 14.
- An Android 5.0 or newer device or emulator with Google Play services installed.
- Android Studio
- Your project should be using AndroidX. For more information on updating AndroidX from the Android Support Library see, Google's AndroidX migration guide.
- On Android, Whatfix Mobile uniquely identifies the screens of native apps by using properties of elements such as resource-id, content description, and tag on each screen. These properties improve element recognition, thereby enhancing screen identification across all Android elements. However, these identifiers are not available by default for Jetpack Compose views.
To tag Jetpack Compose elements, use the following code, which adds a modifier to an existing Jetpack Compose element and serves as a unique identifier for the element:
modifier = Modifier.wfxView("TAG_NAME");
Integration steps for Jetpack Compose
Use the following steps to integrate the Whatfix Mobile SDK in your Jetpack Compose project:
Ensure that you complete both the steps, to create and test the in-app experience in your integrated build.
Step 1: Integrate Whatfix Mobile SDK
a. Add Dependencies
Add the Whatfix Mobile library's dependency to your module (app-level) Gradle file (usually app/build.gradle) as shown in the following code snippet:
Leap SDK is hosted at mavenCentral. Make sure to add mavenCentral in your repositories.
repositories {
mavenCentral()
}
dependencies {
//Leap SDK
implementation 'is.leap.android.compose:sdk:2.0.4'
}
For more information on the latest version of the Jetpack Compose project, see Jetpack Compose Changelog.
b. Start the Whatfix Mobile SDK
Start the Whatfix Mobile SDK in your Application class inside the onCreate() function.
For more information on creating the Application class, see Create Application Class
Leap.start("<YOUR_API_KEY>");
Step 2: Enable the Creator Mode in your app
To create in-app experiences in the Whatfix Mobile Studio, you have to enable the Creator mode in your app. This is done by integrating the Whatfix Mobile Creator SDK.
a. Add dependencies
- The Whatfix Mobile Creator SDK must be removed before the app goes live on the Play Store.
- While both Whatfix Mobile Creator SDK and Whatfix Mobile SDK need to be integrated in the development and testing versions, the production version should only have the Whatfix Mobile SDK.
repositories {
mavenCentral()
}
dependencies {
//Leap Developer SDK
implementation 'is.leap.android.compose:creator-sdk:2.0.4'
}
For more information on the latest version of the Jetpack Compose project, see Jetpack Compose Changelog.
b. Start the Whatfix Mobile Creator SDK
Start the Whatfix Mobile Creator SDK in your Application class inside the onCreate()function.
For more information on creating the Application class, see Create Application Class
LeapCreator.start("<YOUR_API_KEY>");
Proguard Rules
If you are using Proguard for your builds, use the following rules in your proguard-rules.pro file,
-dontwarn is.leap.android.**
-keep class is.leap.android.** {*;}
If you are using Android Gradle Plugin (AGP) version 8.0 or newer, it may be necessary to include specific OkHttp rules in your proguard-rules.pro file. This step is crucial to ensure the proper execution of release builds, as the LeapCreator SDK relies on the OkHttp library. The required rules are as following:
#For Okhttp
-dontwarn okhttp3.internal.platform.**
-dontwarn org.conscrypt.**
-dontwarn org.bouncycastle.**
-dontwarn org.openjsse.**
For more information, see Okhttp R8 / ProGuard.
After integrating the code, you can start creating your in-app experience using Whatfix Mobile.
-
WebView Support: If you want Whatfix Mobile to run in the Activity/Fragment which contains WebView, then see WebView Support.
-
Chrome tabs Support: Chrome tabs are not supported as it doesn't support javascript injection.
-
Help with Audio Ducking: Whatfix Mobile supports audio ducking but if you have ExoPlayer. For more information on ducking audio on that window, see Audio Ducking.
-
For more information on setting up Whatfix Mobile callbacks, see Setup Whatfix Mobile Callbacks.
-
For more information on setting up Segmentation, see Add Custom Properties for User Segments.