Getting Started

The BB Channel Compose SDK embeds Blue Billywig video channels in Jetpack Compose apps. Channels include swim lanes, grids, carousels, search, and detail pages — all rendered in a WebView with a native bridge for seamless integration.

Compatibility

Requirement	Minimum Version
Android API	24+
Kotlin	1.9+
Jetpack Compose	1.5+
Compose BOM	2024.01+

Package Access

BBChannelCompose is distributed as a pre-built AAR from a private GitHub repository. Contact Blue Billywig to receive access.

Installation

Add the Blue Billywig Maven repository to your settings.gradle.kts:

dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven {
            url = uri("https://maven.pkg.github.com/bluebillywig/channel-sdks")
            credentials {
                username = providers.gradleProperty("bb.maven.user").orNull
                    ?: System.getenv("BB_MAVEN_USER")
                password = providers.gradleProperty("bb.maven.token").orNull
                    ?: System.getenv("BB_MAVEN_TOKEN")
            }
        }
    }
}

Then add the dependency to your module-level build.gradle.kts:

dependencies {
    implementation("com.bluebillywig:bbchannel-compose:<version>")
}

Authentication

Set credentials in ~/.gradle/gradle.properties:

bb.maven.user=YOUR_GITHUB_USERNAME
bb.maven.token=YOUR_GITHUB_PAT

The PAT needs read:packages scope.

## Quick Start

```kotlin
import androidx.compose.runtime.Composable
import com.bluebillywig.channel.compose.BBChannelView
import com.bluebillywig.channel.compose.BBChannelViewModel
import com.bluebillywig.channel.compose.BBChannelCallbacks

@Composable
fun ChannelScreen() {
    val viewModel = BBChannelViewModel()

    BBChannelView(
        channelUrl = "https://demo.bbvms.com/ch/1152.json",
        viewModel = viewModel,
        callbacks = BBChannelCallbacks(
            onReady = {
                println("Channel loaded")
            },
            onMediaPlay = { media ->
                println("Playing: ${media.title} — clip ${media.clipId}")
            }
        )
    )
}

Channel URL

Channel URLs follow this format:

https://{publication}.bbvms.com/ch/{channelId}.json

Where {publication} is your Blue Billywig publication name and {channelId} is the numeric channel ID.

Configuration Options

Pass a BBChannelOptions to customize behavior:

val options = BBChannelOptions(
    autoPlay = false,
    searchBar = true,
    noStats = false,
    playout = "default",
    jwt = "eyJ..."
)

BBChannelView(
    channelUrl = "https://demo.bbvms.com/ch/1152.json",
    options = options,
    viewModel = viewModel,
    callbacks = callbacks
)

Property	Type	Description
autoPlay	Boolean?	Auto-play the first video. Default: true.
searchBar	Boolean?	Show the search bar. Default: from channel config.
noStats	Boolean?	Disable analytics/statistics. Default: false.
playout	String?	Override the playout used for players.
jwt	String?	JWT for authenticated/restricted content.
rpcToken	String?	RPC token (legacy, prefer jwt).
nativePlayerMode	Boolean?	Use native player instead of WebView player. Default: false.

Events

Handle events via BBChannelCallbacks:

val callbacks = BBChannelCallbacks(
    onReady = {
        println("Channel is ready")
    },
    onMediaPlay = { media ->
        println("Playing: ${media.clipId}")
    },
    onNavigate = { event ->
        println("Page: ${event.pageType}, can go back: ${event.canGoBack}")
    },
    onError = { error ->
        println("Error [${error.code}]: ${error.message}")
    }
)

Navigation

Use the view model to control navigation:

// Navigate to a detail page
viewModel.navigateTo(page = "detail", clipId = "4701337")

// Go back
viewModel.goBack()

// Search
viewModel.search("keyword")

// Check if back navigation is available
if (viewModel.canGoBack) {
    viewModel.goBack()
}

tip

Integrate with Android's system back button using BackHandler:

BackHandler(enabled = viewModel.canGoBack) {
    viewModel.goBack()
}

Deep Linking

Open the channel at a specific page by passing initialNavigationState:

BBChannelView(
    channelUrl = "https://demo.bbvms.com/ch/1152.json",
    initialNavigationState = BBNavigationState(
        page = "detail",
        clipId = "4701337"
    ),
    viewModel = viewModel,
    callbacks = callbacks
)

Supported pages: main, detail (requires clipId), overview (requires clipListId), search (requires query).

Authentication

For restricted content, pass a JWT in options or update it at runtime:

// Via options
val options = BBChannelOptions(jwt = "eyJ...")

// At runtime
viewModel.setJwt("eyJ...")

Architecture

The Compose SDK uses the same WebView bridge architecture as the React Native SDK. See Architecture for details on the split bundle design, WebView bridge, and native mode detection.

What's Next

• API Reference — complete type and method reference
• Native Player Guide — use BB Native Player SDK for native playback