I have a flutter app that has a package called youtube_player_iframe to show youtube videos inside the app, recently some videos don’t work -like the attatched image- but work normally on youtube, when I reupload the same video to youtube it works in the app, what could be the problem?
The videos are unlisted with no age restriction and put to not for kids option when uploaded.
The console shows No errors
I tried changing the youtube_player_iframe package version with no benefit, tried changing the video settings on youtube but still, uploading the video for the first time won’t work but a second upload will solve the problem.
Here is a video that doesn’t work: https://youtu.be/WYs3V-GPPAk
Here is the code used:
Consumer2<VideosProvider, CommentsProvider>(
builder: (context, videosProvider, commentsProvider, child) {
return YoutubePlayerScaffold(
autoFullScreen: false,
controller: videosProvider.ytController,
aspectRatio: 16 / 9,
builder: (BuildContext context, Widget player) {
return Stack(
children: [
///----------------------///
///----App BackGround----///
///----------------------///
const BackGround(),
///------------///
///----Body----///
///------------///
SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
SizedBox(height: 8.h),
///--------------///
///----AppBar----///
///--------------///
MyAppBar(
title: videosModel.title,
onBack: () async {
videosProvider.ytController.pauseVideo();
if (commentsProvider.showComments) {
commentsProvider.setShowComments(false);
}
},
actions: [
if (context
.watch<VideosProvider>()
.isShowHalfScreen())
IconButton(
onPressed: () =>
videosProvider.swapWidgetsInSplitView(),
icon: const Icon(Icons.flip),
),
],
),
SizedBox(height: 12.h),
///--------------------///
///----Video Player----///
///--------------------///
Stack(
alignment: Alignment.center,
children: [
Stack(
alignment: Alignment.bottomCenter,
children: [
Listener(
onPointerDown: (_) {
if (videosProvider.isFullScreen) return;
videosProvider.toggleControllersVisible(true);
videosProvider.cancelControllerTimer();
},
onPointerUp: (_) {
if (videosProvider.isFullScreen) return;
videosProvider.resetControllerTimer();
},
child: GestureDetector(
onTap: () {
if (videosProvider.isFullScreen) return;
if (!videosProvider.isControllersVisible) {
videosProvider
.toggleControllersVisible(true);
}
},
behavior: HitTestBehavior.opaque,
child: Stack(
alignment: Alignment.center,
children: [
IgnorePointer(
ignoring: true,
child: player,
),
if (!videosProvider.isFullScreen)
const TopActionsPlayer(),
],
),
),
),
///-----------------///
///----VideoControllers----///
///-----------------///
if (!videosProvider.isFullScreen)
const Controllers(),
],
),
///-----------------///
///----User Code----///
///-----------------///
if (!videosProvider.isShowWatermarkFullScreen)
Positioned.fill(
child: LayoutBuilder(
key: Key(videosProvider
.isShowHalfScreen()
.toString()),
builder: (context, constraints) {
return BouncingAnimationWidget(
speed: 0.3,
screenHeight: constraints.maxHeight,
screenWidth: constraints.maxWidth,
child: IgnorePointer(
ignoring: true,
child: Text(
"${Provider.of<AutheProvider>(context, listen: false).usersModel.name}n${Provider.of<AutheProvider>(context, listen: false).usersModel.code}",
textAlign: TextAlign.center,
style: TextStyle(
color: AppColors.mainWhite
.withOpacity(0.6),
fontSize: Sizes.allSize(context) / 70,
shadows: const [
Shadow(
color: Colors.grey,
blurRadius: 2.0,
offset: Offset(2.0, 2.0),
),
],
),
),
),
);
},
),
),
],
),
///---------------------///
///----Comments View----///
///---------------------///
Visibility(
visible: !commentsProvider.showComments,
replacement: CommentsSection(
commentsProvider: commentsProvider,
videosModel: videosModel,
),
///--------------------------///
///----Ratting && Buttons----///
///--------------------------///
child: RattingButtonsSection(
commentsProvider: commentsProvider,
videosModel: videosModel,
),
),
],
),
),
],
);
},
);
}),
void startVideo(String videoUrl) async {
ytController = YoutubePlayerController.fromVideoId(
videoId: YoutubePlayerController.convertUrlToId(videoUrl)!,
autoPlay: true,
params: const YoutubePlayerParams(
showControls: false,
showVideoAnnotations: false,
enableCaption: false,
showFullscreenButton: true,
pointerEvents: PointerEvents.none,
enableJavaScript: true,
),
);
ytController.setFullScreenListener(
(isFullScreen) {
Future.delayed(const Duration(milliseconds: 500), () {
isShowWatermarkFullScreen = isFullScreen;
});
this.isFullScreen = isFullScreen;
},
);
ytController.videoStateStream.listen((event) {
final iPosition = event.position.inSeconds;
positionD = event.position;
final iDuration = ytController.metadata.duration.inSeconds;
durationD = ytController.metadata.duration;
double iCurrentPos =
iPosition == 0 || iDuration == 0 ? 0 : iPosition / iDuration;
position = iPosition;
duration = iDuration;
currentPos = iCurrentPos;
int stopWatchedTime = 0;
stopwatch.start();
stopWatchedTime = (stopwatch.elapsedMilliseconds / 1000).round();
if (stopWatchedTime >= 63) {
stopwatch.reset();
speakCode();
}
if (ytController.value.playerState != PlayerState.playing) {
stopwatch.reset();
}
notifyListeners();
});
}
//we call start in didChangeDependencies
Yousef Khalaf is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
1