cincopa_video_player
A Flutter package that wraps an HLS video stream with built‑in Cincopa analytics tracking. Easily embed Cincopa-powered video playback in your Flutter apps, send events on play/pause/timeupdate, and configure user and video metadata.
Features
- HLS playback: Stream
.m3u8sources via a Flutter-friendly widget. - Cincopa analytics: Automatically send
video.play,video.pause, and periodicvideo.timeupdateevents to Cincopa endpoints. - Configurable metadata: Pass user data (e.g.
email,acc_id) and video config (e.g.autoplay). - Customizable UI: Control
aspectRatio,key, and embed inside any layout.
Installation
In your Flutter app’s pubspec.yaml, add:
dependencies:
flutter:
sdk: flutter
cincopa_video_player:
^0.0.1 # or path/git reference to your local package
Then run:
flutter pub get
Usage
Import the package and use the CincopaVideoPlayer widget:
import 'package:flutter/material.dart';
import 'package:cincopa_video_player/cincopa_video_player.dart';
import 'dart:math';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
// Example HLS URL
String _hlsStreamUrl = 'https://rtcdn.cincopa.com/AcEDQoI4gGxV.m3u8';
String _videoTitle = 'Amazing Cincopa Video';
Key _videoPlayerKey = UniqueKey();
// User data for analytics
Map<String, String> get _userData {
final random = Random();
final id = random.nextInt(1000000);
return {
'email': 'user${id}@example.com',
'acc_id': '${1000 + id}',
};
}
void _switchVideo(String newUrl, String newTitle) {
setState(() {
_hlsStreamUrl = newUrl;
_videoTitle = newTitle;
_videoPlayerKey = UniqueKey();
});
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text(_videoTitle)),
body: Center(
child: Column(
children: [
AspectRatio(
aspectRatio: 16 / 9,
key: _videoPlayerKey,
child: CincopaVideoPlayer(
hlsUrl: _hlsStreamUrl,
userData: _userData
),
),
ElevatedButton(
onPressed: () => _switchVideo(
'https://rtcdn.cincopa.com/AcCDOtcj2pv-.m3u8',
'Another Cincopa Video',
),
child: const Text('Switch Video'),
),
],
),
),
),
);
}
}
API Reference
CincopaVideoPlayer
| Parameter | Type | Description |
|---|---|---|
hlsUrl |
String |
The .m3u8 stream URL to play. |
userData |
Map<String,String> |
Metadata for Cincopa analytics (email, acc_id). |
key |
Key? |
Optional key to force widget rebuilds. |
aspectRatio |
double? |
Aspect ratio for the player container. |
Example
See the full example/ directory for a working demo app that switches streams and shows analytics events in action.
Contributing
Feel free to open issues or PRs on GitHub. Please follow the Flutter package conventions and include tests for new features.
License
MIT © Cincopa
Libraries
- cincopa_video_player
- Expose everything your users need from one import: