youtube_plyr_iframe 2.0.4-pre.1 youtube_plyr_iframe: ^2.0.4-pre.1 copied to clipboard
Fork of Youtube Player Iframe. Supports web & mobile platforms.
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:youtube_plyr_iframe/youtube_plyr_iframe.dart';
import 'pages/oldDemo.dart';
import 'pages/thumbnailDemo.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
runApp(YoutubeApp());
}
///
class YoutubeApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Youtube Plyr Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
iconTheme: const IconThemeData(color: Colors.blue),
),
debugShowCheckedModeBanner: false,
home: YoutubeAppDemo(),
);
}
}
///
class YoutubeAppDemo extends StatefulWidget {
@override
_YoutubeAppDemoState createState() => _YoutubeAppDemoState();
}
class _YoutubeAppDemoState extends State<YoutubeAppDemo> {
String videoID = "PuMz4v5PYKc";
List<Map<String, dynamic>> players = [
{
"videoID": "AOhFzDN3eMI",
"quality": ThumbnailQuality.max,
},
{
"videoID": "LRNuWYvRtac",
"quality": ThumbnailQuality.standard,
},
{
"videoID": "bhu0x4hoddA",
"quality": ThumbnailQuality.high,
},
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.blue,
title: Text("Demo"),
centerTitle: true,
automaticallyImplyLeading: true,
elevation: 0,
),
body: SafeArea(
child: SingleChildScrollView(
child: Container(
child: new Center(
child: Padding(
padding: EdgeInsets.all(15),
child: new Column(
// center the children
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Row(
children: [
ElevatedButton(
child: Text("Inline Demo"),
onPressed: () => Navigator.push(
context,
MaterialPageRoute(builder: (context) => OldDemo()),
),
),
SizedBox(
width: 10,
),
ElevatedButton(
child: Text("Thumbnail Demo"),
onPressed: () => Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ThumbnailDemo()),
),
),
],
),
Text("Livestream"),
ytPlayer("5qap5aO4i9A"),
Divider(),
Text("Single Player"),
ytPlayer("F1B9Fk_SgI0"),
Divider(),
Text("From String"),
ytPlayer(videoID),
Divider(),
Text("List View"),
for (var i in players)
ytPlayer(
i["videoID"],
),
Divider(),
Text("Row List"),
Wrap(
spacing: 8.0,
runSpacing: 4.0,
direction: Axis.horizontal,
children: [
ytPlayer("TyimCGEkiUc"),
Text(
"Hello World",
style: TextStyle(fontSize: 20),
),
],
),
],
),
),
),
),
),
),
);
}
void _showDialog(context, videoID) {
// flutter defined function
showDialog(
context: context,
builder: (BuildContext context) {
// return object of type Dialog
return YoutubeViewer(
videoID,
);
},
);
}
Widget ytPlayer(videoID) {
return Material(
color: Colors.transparent,
child: InkWell(
onTap: () {
_showDialog(
context,
videoID,
);
},
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Stack(
children: <Widget>[
LayoutBuilder(
builder: (context, constraints) {
if (kIsWeb && constraints.maxWidth > 800) {
return Container(
color: Colors.transparent,
padding: EdgeInsets.all(5),
width: MediaQuery.of(context).size.width / 2,
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: new Image.network(
YoutubePlayerController.getThumbnail(
videoId: videoID,
// todo: get thumbnail quality from list
quality: ThumbnailQuality.max,
webp: false),
fit: BoxFit.fill,
),
),
);
} else {
return Container(
color: Colors.transparent,
padding: EdgeInsets.all(5),
width: MediaQuery.of(context).size.width * 2,
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: new Image.network(
YoutubePlayerController.getThumbnail(
videoId: videoID,
// todo: get thumbnail quality from list
quality: ThumbnailQuality.max,
webp: false),
fit: BoxFit.fill,
),
),
);
}
},
),
],
),
Icon(
Icons.play_circle_filled,
color: Colors.white,
size: 55.0,
),
],
),
),
);
}
}
class YoutubeViewer extends StatefulWidget {
final String? videoID;
YoutubeViewer(this.videoID);
@override
_YoutubeViewerState createState() => _YoutubeViewerState();
}
class _YoutubeViewerState extends State<YoutubeViewer> {
late YoutubePlayerController _controller;
@override
void initState() {
super.initState();
_controller = YoutubePlayerController(
initialVideoId: widget.videoID!, // livestream example
params: YoutubePlayerParams(
//startAt: Duration(minutes: 1, seconds: 5),
showControls: true,
showFullscreenButton: true,
desktopMode: false,
autoPlay: true,
enableCaption: true,
showVideoAnnotations: false,
enableJavaScript: true,
privacyEnhanced: true,
useHybridComposition: true,
playsInline: false,
),
)..listen((value) {
if (value.isReady && !value.hasPlayed) {
_controller
..hidePauseOverlay()
..play()
..hideTopMenu();
}
if (value.hasPlayed) {
_controller..hideEndScreen();
}
});
_controller.onExitFullscreen = () {
_controller.close();
Navigator.of(context).pop();
};
}
@override
Widget build(BuildContext context) {
final player = YoutubePlayerIFrame();
return YoutubePlayerControllerProvider(
key: UniqueKey(),
controller: _controller,
child: AlertDialog(
insetPadding: EdgeInsets.all(10),
backgroundColor: Colors.black,
content: player,
contentPadding: EdgeInsets.all(0),
actions: <Widget>[
new Center(
child: TextButton(
child: new Text("Close"),
onPressed: () {
Navigator.of(context).pop();
},
),
),
],
),
);
}
}
///
/// For getting youtube player from anywhere
///
class YoutubePlayer extends StatefulWidget {
final String videoID;
YoutubePlayer(this.videoID);
@override
_YoutubePlayerState createState() => _YoutubePlayerState();
}
class _YoutubePlayerState extends State<YoutubePlayer> {
@override
Widget build(BuildContext context) {
return Material(
color: Colors.transparent,
child: InkWell(
onTap: () {
_showDialog(
context,
widget.videoID,
);
},
child: Stack(
alignment: Alignment.center,
children: <Widget>[
Stack(
children: <Widget>[
LayoutBuilder(
builder: (context, constraints) {
if (kIsWeb && constraints.maxWidth > 800) {
return Container(
color: Colors.transparent,
padding: EdgeInsets.all(5),
width: MediaQuery.of(context).size.width / 2,
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: new Image.network(
YoutubePlayerController.getThumbnail(
videoId: widget.videoID,
// todo: get thumbnail quality from list
quality: ThumbnailQuality.max),
fit: BoxFit.fill,
),
),
);
} else {
return Container(
color: Colors.transparent,
padding: EdgeInsets.all(5),
width: MediaQuery.of(context).size.width * 2,
child: ClipRRect(
borderRadius: BorderRadius.circular(10.0),
child: new Image.network(
YoutubePlayerController.getThumbnail(
videoId: widget.videoID,
// todo: get thumbnail quality from list
quality: ThumbnailQuality.max,
webp: false),
fit: BoxFit.fill,
),
),
);
}
},
),
],
),
Icon(
Icons.play_circle_filled,
color: Colors.white,
size: 55.0,
),
],
),
),
);
}
void _showDialog(context, videoID) {
// flutter defined function
showDialog(
context: context,
builder: (BuildContext context) {
// return object of type Dialog
return YoutubeViewer(
videoID,
);
},
);
}
}