Full Screen Integration

The most common pattern: the channel takes the entire screen with native video playback.

Basic Setup

import com.bluebillywig.bbchannel.compose.BBChannelWithPlayerView
import com.bluebillywig.bbchannel.compose.BBChannelViewModel
import com.bluebillywig.bbchannel.compose.BBChannelCallbacks

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

    BBChannelWithPlayerView(
        channelUrl = "https://demo.bbvms.com/ch/channel_name.json",
        viewModel = viewModel,
        callbacks = BBChannelCallbacks(
            onReady = { println("Channel loaded") }
        )
    )
}

BBChannelWithPlayerView renders the channel with a native inline player at the top. Tapping a video plays it in the native player with hardware-accelerated playback and Chromecast support.

Loading State

Show a loading overlay while the channel initializes:

@Composable
fun ChannelScreen() {
    val viewModel = remember { BBChannelViewModel() }
    var isLoading by remember { mutableStateOf(true) }

    Box(modifier = Modifier.fillMaxSize().background(Color.Black)) {
        BBChannelWithPlayerView(
            channelUrl = "https://demo.bbvms.com/ch/channel_name.json",
            viewModel = viewModel,
            callbacks = BBChannelCallbacks(
                onReady = { isLoading = false }
            )
        )

        if (isLoading) {
            Box(
                modifier = Modifier.fillMaxSize().background(Color.Black),
                contentAlignment = Alignment.Center
            ) {
                CircularProgressIndicator(color = Color.White)
            }
        }
    }
}

Android Back Button

Automatic Handling

Use BackHandler from Compose to integrate with the channel's navigation:

@Composable
fun ChannelScreen(onExit: () -> Unit) {
    val viewModel = remember { BBChannelViewModel() }
    var canGoBack by remember { mutableStateOf(false) }

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

    BBChannelWithPlayerView(
        channelUrl = "https://demo.bbvms.com/ch/channel_name.json",
        viewModel = viewModel,
        callbacks = BBChannelCallbacks(
            onCanGoBackChange = { canGoBack = it }
        )
    )
}

When the user presses back:

1. If the channel can go back (detail → main), it navigates back
2. Otherwise, the default back behavior runs

Key Points

• Background color — Set the container background to black to avoid white flashes during load.
• Orientation — The channel is responsive and adapts to portrait and landscape.
• System bars — Use enableEdgeToEdge() in your Activity for full-screen immersive mode.