Question

我知道有图像轮播滑块，但是我需要的是视频轮播滑块。我设法使用chewie将视频添加到旋转木马滑块，但不知道当当前视频播放完后如何自动传输到下一个视频。

        class _ChewieDemoState extends State<ChewieDemo> {
          TargetPlatform _platform;
          VideoPlayerController _videoPlayerController1;
          VideoPlayerController _videoPlayerController2;
          ChewieController _chewieController;
          ChewieController _chewieController2;
          void initState() {
          super.initState();
          _videoPlayerController1 = VideoPlayerController.network(
            'https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4');
          _videoPlayerController2 = VideoPlayerController.network(
            'https://www.sample-videos.com/video123/mp4/720/big_buck_bunny_720p_1mb.mp4');

          _chewieController = ChewieController(
          videoPlayerController: _videoPlayerController1,
          aspectRatio: 4 / 3,
          autoPlay: true,
          looping: false,
          );

          _chewieController2 = ChewieController(
          videoPlayerController: _videoPlayerController2,
          aspectRatio: 4 / 3,
          autoPlay: true,
          looping: false,);}

在小部件构建中

body: CarouselSlider(
      items: [Chewie( controller: _chewieController,),Chewie(controller: _chewieController2,)],
      autoPlay: true,
      autoPlayInterval: Duration(seconds: 1),
      autoPlayAnimationDuration: Duration(milliseconds: 800),
        ),

我正在考虑这种解决方案：获取视频的持续时间并将其放入autoPlayInterval，每次幻灯片更改时将持续时间更改为当前视频。

autoPlayInterval: Duration(seconds: duration),

有onPageChanged：callbackFunction，但是我不明白它是如何工作的，我在那里更改了持续时间，但没有任何影响。

视频结束时自动更改幻灯片的代码。

goToNext() {
    carouselSlider.nextPage(
        duration: Duration(seconds: 1), curve: Curves.decelerate);
  }
void checkVideo(){

    if(_videoPlayerController1.value.position == _videoPlayerController1.value.duration){
      print('video Ended');
      _videoPlayerController1.seekTo(Duration(seconds:0 )); // If i don't put this here it will keep transfer to nextpage.
      goToNext();
      _videoPlayerController2.seekTo(Duration(seconds:0 ));
}

Answer 1

当前视频结束时，您可以告诉滑块转到下一页。

要知道视频何时结束，可以向视频控制器添加一个侦听器
要告诉滑块转到下一页，可以调用滑块的nextPage（）实例方法： Carousel Slider: Instance methods- Carousel Slider: Example with instance methods

颤动的视频轮播滑块

1 个答案: