gpt4 book ai didi

flutter - flutter 的视频轮播 slider

转载 作者:行者123 更新时间:2023-12-02 02:42:39 30 4
gpt4 key购买 nike

我知道有图像轮播 slider ,但我需要的是视频轮播 slider 。我设法使用chewie将视频添加到轮播 slider ,但不知道当前视频播放完毕后如何自动转移到下一个视频。

        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 ));
}

最佳答案

当前视频结束时,您可以告诉 slider 转到下一页。

  • 要知道视频何时结束,您可以在视频 Controller 中添加一个监听器
  • 要告诉 slider 转到下一页,可以调用 slider 的 nextPage() 实例方法:
    Carousel Slider: Instance methods -
    Carousel Slider: Example with instance methods
  • 关于flutter - flutter 的视频轮播 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58280668/

    30 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com