Open a-l-l-a-n opened 3 years ago
Could you share sample of your code? I think that you refresh Iframe so theres your delay with black screen. Please also fill information about which package do you use.
@PcolBP Here's the code. I'm using a pageview and for each page I'm passing a link and creating a new youtube player widget. The audio with delayed video, issue does not happen if I enable youtube controls. It only happens if I disable youtube controls.
Here's the code
import 'dart:developer';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:youtube_player_iframe/youtube_player_iframe.dart';
import 'widgets/meta_data_section.dart';
import 'widgets/play_pause_button_bar.dart';
import 'widgets/player_state_section.dart';
import 'widgets/source_input_section.dart';
import 'widgets/volume_slider.dart';
Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
runApp(YoutubeApp());
}
///
class YoutubeApp extends StatelessWidget {
var link = [
"xKT3deiaLEk",
"gtm7m4tLUn0",
"xKT3deiaLEk",
"gtm7m4tLUn0",
];
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Youtube Player IFrame Demo',
theme: ThemeData(
brightness: Brightness.dark,
primarySwatch: Colors.deepPurple,
scaffoldBackgroundColor: Colors.black,
),
debugShowCheckedModeBanner: false,
home: PageView.builder(
scrollDirection: Axis.horizontal,
controller: PageController(),
itemBuilder: (BuildContext context, int itemIndex) {
return YoutubeAppDemo(link[0]);
},
),
);
}
}
///
class YoutubeAppDemo extends StatefulWidget {
final _link;
YoutubeAppDemo(this._link);
@override
_YoutubeAppDemoState createState() => _YoutubeAppDemoState();
}
class _YoutubeAppDemoState extends State<YoutubeAppDemo> {
late YoutubePlayerController _controller;
@override
void initState() {
super.initState();
_controller = YoutubePlayerController(
initialVideoId: widget._link,
params: const YoutubePlayerParams(
playlist: [],
startAt: const Duration(minutes: 0, seconds: 0),
showControls: true,
showFullscreenButton: true,
desktopMode: false,
privacyEnhanced: true,
useHybridComposition: false,
),
);
}
@override
Widget build(BuildContext context) {
const player = YoutubePlayerIFrame();
return YoutubePlayerControllerProvider(
// Passing controller to widgets below.
controller: _controller,
child: Scaffold(
body: LayoutBuilder(
builder: (context, constraints) {
return ListView(
children: [
Stack(
children: [
player,
const Controls(),
],
),
],
);
},
),
),
);
}
@override
void dispose() {
_controller.close();
super.dispose();
}
}
///
class Controls extends StatelessWidget {
///
const Controls();
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_space,
// MetaDataSection(),
_space,
// SourceInputSection(),
_space,
PlayPauseButtonBar(),
_space,
//VolumeSlider(),
_space,
// PlayerStateSection(),
],
),
);
}
Widget get _space => const SizedBox(height: 10);
}
After copying your code and test, problem not occur. Player plays as it should, haven't notice black screen. Only blinking of widgets below. So it may be problem on your side.
@PcolBP It's doesn't happen often. But It occurs. If you keep testing repeatedly for 10 times , this issue happens one time on a real device. I've only used page view other than the plugin. Do you think the issue is on my phone only ?
@a-l-l-a-n it really rare cases when problem depends on phone. I think the problem is on platform_view and holding state. I also had problems with black screen on my side, solved it already but it was connected with holding controller state. Pageview has this to itself that its frees from resources a widget that you don't see and render new when when you will eneter it. Have you tried to add Key to in this case YoutubeAppDemo?
@PcolBP I don't know a lot about keys. Thanks for you reply. Can you suggest some keys to try in Pageview ? I'm just a real beginner
In that case I belieave that you dont need to get access to context of widget so use UniqueKey()
YoutubeAppDemo(
link[0],
key: UniqueKey(),
);
YoutubeAppDemo(
this._link, {
Key? key,
}) : super(key: key);
@PcolBP Really appreciate your time for answering. I've tried it and no luck. I'll figure some other way out. Thanks
When I play the youtube video, the audio of the video plays fine but the video is first black and comes a few seconds later . But both the video and audio are in sync. But the video appear visually later in the screen.
Can you help me with this bug?
I get these logs while playing... create MediaCodec video decoder, mime video/x-vnd.on2.vp9
Edit1: The audio with delayed video issue doesn't happen when I turned on the youtube controls. It only happens if I turned off youtube controls.