Complete integration example | FastPix Developer Documentation

A full example showing how to set up the FastPix Flutter Player with video playback, configuration, and resource cleanup.

Full app example

This example demonstrates a complete Flutter app with player initialization, playback, and cleanup:

import 'package:fastpix_player/fastpix_video_player.dart';
import 'package:flutter/material.dart';
void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Fastpix Player Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: const FastPixPlayerDemo(),
    );
  }
}
class FastPixPlayerDemo extends StatefulWidget {
  const FastPixPlayerDemo({super.key});
  @override
  State<FastPixPlayerDemo> createState() => _FastPixPlayerDemoState();
}
class _FastPixPlayerDemoState extends State<FastPixPlayerDemo> {
  late FastPixPlayerController controller;
  @override
  void initState() {
    super.initState();
    // Create HLS data source
    final dataSource = FastPixPlayerDataSource.hls(
      playbackId: 'your-playback-id-here',
      title: 'Sample HLS Stream',
      description: 'A sample HLS stream from FastPix',
      thumbnailUrl: 'https://www.example.com/thumbnail.jpg',
    );
    final configuration = FastPixPlayerConfiguration();
    controller = FastPixPlayerController();
    controller.initialize(dataSource: dataSource, configuration: configuration);
  }
  @override
  Widget build(BuildContext context) {
    return FastPixPlayer(
      controller: controller,
      width: 350,
      height: 200,
      aspectRatio: FastPixAspectRatio.ratio16x9,
    );
  }
  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }
}

Key points

The FastPixPlayerController is created in initState and disposed in dispose to prevent memory leaks.
FastPixPlayerDataSource.hls() constructs the data source using a playback ID. Optional fields include title, description, thumbnailUrl, token, customDomain, and qualityControl.
FastPixPlayerConfiguration() uses default settings. Customize it with controlsConfiguration, autoPlayConfiguration, and qualityConfiguration.
The FastPixPlayer widget renders the video. Set width, height, and aspectRatio to control the layout.

Replace 'your-playback-id-here' with your actual FastPix playback ID.