Before every video I am getting a black screen which I am not sure why is it appearing.
At first I thought it is due to the internet connection or something but that does not seem to be affecting it at all.
I am getting video urls from the stream.
Screen:
class _PageViewBuilderState extends State<PageViewBuilder> {
int _currentPage = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: StreamBuilder<QuerySnapshot<Map<String, dynamic>>>(
stream:
FirebaseFirestore.instance.collection('Videourls').snapshots(),
builder: (ctx, snapshot) {
if (snapshot.hasError) {
const Center(
child: Text('Unknown Error'),
);
}
return !snapshot.hasData
? const Center(
child: CircularProgressIndicator(),
)
: PageView.builder(
scrollDirection: Axis.vertical,
itemCount: snapshot.data!.docs.length,
onPageChanged: (int page) {
setState(() {
_currentPage = page;
});
},
itemBuilder: (BuildContext context, int index) {
return VideoWidget(
urlVideo: snapshot.data!.docs[index].get('url'),
);
},
);
}),
);
}
}
class VideoWidget extends StatefulWidget {
VideoWidget({
required this.urlVideo,
Key? key,
}) : super(key: key);
final String urlVideo;
@override
State<VideoWidget> createState() => _VideoWidgetState();
}
class _VideoWidgetState extends State<VideoWidget> {
VideoPlayerController? INvideoPlayerController;
@override
void initState() {
super.initState();
INvideoPlayerController = VideoPlayerController.network(widget.urlVideo)
..setLooping(true)
..initialize().then((value) => INvideoPlayerController?.play());
}
@override
void dispose() {
INvideoPlayerController?.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Stack(alignment: Alignment.center, children: [
AspectRatio(
aspectRatio: MediaQuery.of(context).size.width /
MediaQuery.of(context).size.height,
child: INvideoPlayerController != null
? VideoPlayer(INvideoPlayerController!)
: Container(),
),
Column(children: [
SizedBox(
height: (3 / 4) * MediaQuery.of(context).size.height,
),
Row(children: [
SizedBox(
width: (4 / 5) * MediaQuery.of(context).size.width,
),
Column(children: [
IconButton(
alignment: Alignment.topCenter,
iconSize: 30,
color: Colors.black,
onPressed: () async {
final url = Uri.parse(widget.urlVideo);
final response = await http.get(url);
final bytes =
response.bodyBytes;
final temp = await getTemporaryDirectory();
final path = '${temp.path}/video.mp4';
File(path)
.writeAsBytesSync(bytes);
await Share.shareFiles([path],
text: 'Check out this \n\n');
},
icon: const Icon(Icons.share)),
Text(
'Share',
style: TextStyle(fontWeight: FontWeight.bold, fontSize: 20),
)
]),
]),
])
]);
}
}
What I have tried:
I tried separating the widget from the tree to decrease the build so that it increases the speed did not work.