SDK Jetpack Compose Support

Article
11/22/2024

Important

Check the supported Jetpack Compose versions in Platform/Framework Support Matrix.

SDK Initialization

To integrate Clarity with Jetpack Compose use the package, com.microsoft.clarity:clarity-compose instead of com.microsoft.clarity:clarity.

Note: You can find the latest version here.

repositories {
   mavenCentral()
}

dependencies {
   implementation 'com.microsoft.clarity:clarity-compose:3.+'
}

All the remaining initialization procedures remain the same for clarity-compose as clarity. Refer to remaining procedures in Android SDK initialization.

Note

Any features or support available in the corresponding clarity version also apply to the clarity-compose version. For example, clarity:3.0.0 supports Android API levels specified at Platform/Framework Support Matrix. The same applies to clarity-compose:3.0.0.

Masking and Unmasking

To apply masking with Composable, use the clarityMask or clarityUnmask modifiers.

import com.microsoft.clarity.modifiers.clarityMask
import com.microsoft.clarity.modifiers.clarityUnmask

...

Column(
    modifier = Modifier.clarityMask()
) {
    ...
    OutlinedButton(
        modifier = Modifier.clarityUnmask()
    ) {
        ...
    }
}

In this example, Column and all its children are masked except for OutlinedButton is unmasked.