Skip to main content

Compose Multiplatform widget

If your app's UI is built with Compose Multiplatform, use the storifyme-kmp-compose companion artifact to mount the widget as a composable. The composable internally wraps the native View (AndroidView on Android, UIKitView on iOS) so rendering is still done by the production native widget.

Dependency​

Add the Compose companion module alongside the base SDK:

shared/build.gradle.kts
kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("com.storifyme.sdk:kotlin-multiplatform-sdk:<latest_version>")
            implementation("com.storifyme.sdk:kotlin-multiplatform-sdk-compose:<latest_version>")
        }
    }
}

You also need the Compose Multiplatform plugin (org.jetbrains.compose) applied to your shared module — the standard CMP setup.

Usage​

The composable signature is the same on every platform:

import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import com.storifyme.kmp.compose.StorifyMeWidget
import com.storifyme.kmp.config.StorifyMeWidgetConfig
import com.storifyme.kmp.events.StorifyMeExperienceListener
import com.storifyme.kmp.events.StorifyMeWidgetListener

@Composable
fun StoriesPanel(
    widgetListener: StorifyMeWidgetListener,
    experienceListener: StorifyMeExperienceListener? = null,
) {
    StorifyMeWidget(
        widgetId = 74L,
        modifier = Modifier.fillMaxWidth().height(220.dp),
        config = StorifyMeWidgetConfig().setSegments(listOf("featured")),
        widgetListener = widgetListener,
        experienceListener = experienceListener,
    )
}

All five listener parameters are nullable. Pass null for a category to use its global listener registered on StorifyMe; unset categories use the native default behavior.

Recomposition behavior​

When widgetId changes (because your state changes), the composable rebuilds the underlying native view for the new id. This is the right behavior in the common case where you switch which widget a panel shows — but be aware that the rebuild is not free (it tears down the StoriesView / StorifyMeWidget and creates a new one).

The widget is configured and listeners are attached when the native view is created. If you need to replace the full configuration, unmount/remount the composable.

Initialization is still global​

StorifyMeWidget {} only mounts a widget — it does not initialize the SDK. Call StorifyMe.init(...) once at app launch from your normal startup code; the composable will wait until init is complete before loading.

Choosing between the composable and the factory​

Use StorifyMeWidget {} from storifyme-kmp-compose. Layout, modifiers, and state flow are all idiomatic Compose. Recommended when your app is fully CMP.

Both paths render the same underlying native widget — pick whichever fits your app's UI architecture.