Bug description
I have created a production app using this plugin and I have to thank you for all the great work you have done with it, but I found an issue on iOS devices only and that is when the fullscreen button is clicked the app crashes on some iOS versions (before 13) it doesn't even print error logs and on other iOS versions (13) the app rotates but the video keeps stuttering and showing weird behavior.
This issue only happens on iOS devices, Android devices are not affected by it at all.
Code
I am posting the code I am using, maybe it is an implementation error (I doubt it since it works perfectly fine on Android)
youtube_player.dart
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';
class YoutubePlayerContainer extends StatefulWidget {
const YoutubePlayerContainer(
{Key key, @required this.youtubeController, @required this.thumbnail})
: super(key: key);
final YoutubePlayerController youtubeController;
final String thumbnail;
@override
_YoutubePlayerContainerState createState() => _YoutubePlayerContainerState();
}
class _YoutubePlayerContainerState extends State<YoutubePlayerContainer> {
bool loading;
@override
void initState() {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitDown,
DeviceOrientation.portraitUp,
DeviceOrientation.landscapeLeft,
DeviceOrientation.landscapeRight
]);
loading = true;
super.initState();
}
@override
Widget build(BuildContext context) {
return Stack(children: [
Center(
child: YoutubePlayer(
bottomActions: <Widget>[
CurrentPosition(),
ProgressBar(isExpanded: true),
],
controller: widget.youtubeController,
showVideoProgressIndicator: true,
onReady: () async {
await Future.delayed(Duration(milliseconds: 700));
setState(() {
loading = false;
});
},
progressIndicatorColor: Theme.of(context).primaryColor,
),
),
if (loading)
Center(
child: Container(
height: 60,
width: 60,
child: CircularProgressIndicator(
strokeWidth: 6,
),
),
),
]);
}
@override
void dispose() {
widget.youtubeController.dispose();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitDown,
DeviceOrientation.portraitUp,
]);
super.dispose();
}
}
And here is where I call the previous widget passing in the controller
YoutubePlayerContainer(
thumbnail: thumbnail,
youtubeController: YoutubePlayerController(
initialVideoId:
YoutubePlayer.convertUrlToId(videoUrl),
flags: YoutubePlayerFlags(enableCaption: false)),
)
Technical Details:
@Ayman-Kortobaa hi, I am also facing the same issue, any work around solution
@Ayman-Kortobaa hi, I am also facing the same issue, any work around solution
The only workaround which really doesn't achieve what I wanted was to remove the fullscreen button and make the screen rotatable, the code snippets are in the original post. I hope someone can find a better workaround or a solution.
@srinivasii I have found a better workaround and it works perfectly, using RotatedBox, I'll post the whole code snippet below because I hope that it helps.
I am not closing the issue yet as the default behaviour of the plugin is causing it.
Here's the code:
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';
class YoutubePlayerContainer extends StatefulWidget {
const YoutubePlayerContainer({Key key, @required this.youtubeController})
: super(key: key);
final YoutubePlayerController youtubeController;
@override
_YoutubePlayerContainerState createState() => _YoutubePlayerContainerState();
}
class _YoutubePlayerContainerState extends State<YoutubePlayerContainer> {
int _rotation;
@override
void initState() {
_rotation = 0;
super.initState();
}
@override
Widget build(BuildContext context) {
return RotatedBox(
quarterTurns: _rotation,
child: Stack(
children: <Widget>[
SizedBox.expand(
child: YoutubePlayer(
bottomActions: <Widget>[
IconButton(
icon: Icon(
_rotation == 0 ? Icons.fullscreen : Icons.fullscreen_exit,
color: Colors.white,
),
onPressed: () async {
widget.youtubeController.pause();
if (_rotation == 0) {
setState(() {
_rotation = 1;
});
} else {
setState(() {
_rotation = 0;
});
}
},
),
RemainingDuration(),
ProgressBar(isExpanded: true),
CurrentPosition(),
],
controller: widget.youtubeController,
showVideoProgressIndicator: true,
progressIndicatorColor: Theme.of(context).primaryColor,
),
),
Align(
alignment: Alignment.topRight,
child: IconButton(
icon: Icon(
Icons.close,
color: Colors.white,
),
onPressed: () => Navigator.of(context).pop(),
),
),
],
),
);
}
@override
void dispose() {
widget.youtubeController.dispose();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitDown,
DeviceOrientation.portraitUp,
]);
super.dispose();
}
}
Should fix with v7.0.0. Feel free to reopen if the issue persists.