I'm trying to create a simple app where I can iterate between video clips. Each videoClip is described by a file location, a start time, and an end time (Durations). When I switch from one clip to another, I would like the UI to simply show the starting frame of the next video clip. I am attempting to wrap the logic in a bloc design pattern, with a LoadVideo event responsible for this transition. A simplified example of my code for handling this event (with the relevant calls to the video_player functions included) is as follows:
@override
Stream<VideoState> mapEventToState(VideoEvent event) async* {
final currentState = state;
switch (event.runtimeType) {
case LoadVideo:
// get video player controller corresponding to the input file
final videoClip = (event as LoadVideo).videoClip;
final videoPlayerController = VideoPlayerController.file(File(videoClip.fileLocation));
// wait for initialization
await videoPlayerController.initialize();
// seek to starting point of video
if (videoClip.startTime != null) {
await videoPlayerController.seekTo(videoClip.startTime);
}
// ????
await Future.delayed(const Duration(milliseconds: 100), () {});
// update the state such the the UI is rebuilt to show the starting point of the video
yield VideoLoaded(videoPlayerController);
return;
}
}
My issue is that the UI shows the 0th frame of the loaded video for a split second before jumping to the desired frame specified by startTime. It seems that by adding the Future.delayed() line, this can be avoided, but this seems like a hack that is not certain to always work. I don't understand the reason for the described behavior, since I am awaiting every step of seeking to the desired starting frame.
Can anybody tell me what I am missing, and what the elegant solution would be to make the transition between loaded videos seamless?