Flutter Channels SDK: Get Started

The Flutter Channels SDK lets you embed a fully branded video streaming experience inside a Flutter app on both iOS and Android.

1.0 | What is it?

The Flutter Channels SDK (bb_channel) lets you embed a complete Blue Billywig Channel (with swim lanes, carousels, search, and detail pages) directly in a Flutter app. It uses the native player under the hood, so users get hardware-accelerated playback with full Chromecast and Picture-in-Picture support on both iOS and Android.

If you are already using the Flutter Player SDK for standalone video playback, the Channels SDK builds on top of it. Both can be used together: the player for individual videos and the Channels SDK for curated content experiences.

2.0 | Features

• Branded video portal with custom colors, fonts, and logo
• Multiple layout options: swim lanes, grids, carousels, and featured headers
• Built-in search across all content
• Detail pages with related videos
• Native playback on iOS and Android
• Chromecast support
• Picture-in-Picture support
• Full ad support (VAST, VPAID, Google IMA)
• Deep linking to specific videos or pages
• Analytics and event tracking
• JWT authentication for restricted content

3.0 | Getting started

The Channels SDK is available as a public package on pub.dev. No access token is required.

3.1 | Add the dependency

Run the following command in your project directory:

flutter pub add bb_channel

Alternatively, add it manually to your pubspec.yaml:

dependencies:
  bb_channel: ^8.53.0

Then fetch packages:

flutter pub get

3.2 | iOS setup

Set the minimum deployment target to 14.0 in your ios/Podfile:

platform :ios, '14.0'

Then install CocoaPods dependencies:

cd ios && pod install && cd ..

3.3 | Android setup

Add the Blue Billywig Maven repository to your android/build.gradle:

allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url 'https://maven.bluebillywig.com/releases' }
    }
}

3.4 | Minimal example

Here is the simplest way to embed a channel:

import 'package:bb_channel/bb_channel.dart';

BBChannelWithPlayer(
  channelUrl: 'https://yourpublication.bbvms.com/ch/1234.json',
  onReady: () => print('Channel loaded'),
  onMediaPlay: (m) => print('Playing: ${m.title}'),
)

The channelUrl is the standard Blue Billywig channel endpoint; find it in the OVP under Channels.

4.0 | Programmatic control

Use a BBChannelController to control the channel from outside the widget:

final controller = BBChannelController();

BBChannelWithPlayer(
  channelUrl: 'https://yourpublication.bbvms.com/ch/1234.json',
  controller: controller,
);

// Play a specific video by clip ID
controller.playVideo('1234567');

// Trigger a search
controller.search('news');

// Read the current navigation state
final state = await controller.getNavigationState();

5.0 | Configuration options

The BBChannelWithPlayer widget accepts the following properties:

6.0 | System requirements

• Flutter 3.19+
• Dart 3.3+
• iOS 14.0+
• Android API 21+

7.0 | Also available for Android, iOS, and React Native

The Channels SDK is also available for other platforms:

• Jetpack Compose (Android), via Maven: Jetpack Compose guide
• SwiftUI (iOS), via Swift Package Manager: SwiftUI guide
• React Native, via npm: React Native guide

All SDKs share the same feature set and connect to the same channel configuration.