一个支持无限滚动的 Flutter 轮播组件

carousel_slider

一个轮播滑块组件，支持无限滚动和自定义子组件，具有自动播放功能。

安装

在您的 pubspec.yaml dependencies 中添加 carousel_slider: ^0.0.7。

如何使用

只需创建一个 CarouselSlider 小部件，并传入必需的参数

new CarouselSlider(
  items: [1,2,3,4,5].map((i) {
    return new Builder(
      builder: (BuildContext context) {
        return new Container(
          width: MediaQuery.of(context).size.width,
          margin: new EdgeInsets.symmetric(horizontal: 5.0),
          decoration: new BoxDecoration(
            color: Colors.amber
          ),
          child: new Text('text $i', style: new TextStyle(fontSize: 16.0),)
        );
      },
    );
  }).toList(),
  height: 400.0,
  autoPlay: true
)

有关更详细的示例，请查看 example 文件夹。

参数

new CarouselSlider(
  items: items,
  viewportFraction: 0.8,
  initialPage: 0,
  aspectRatio: 16/9,
  height: 400,
  reverse: false,
  autoPlay: false,
  interval: const Duration(seconds: 4),
  autoPlayCurve: Curves.fastOutSlowIn,
  autoPlayDuration: const Duration(milliseconds: 800),
  updateCallback: someFunction
)

您可以将上述参数传递给类。如果您传入 height 参数，则会忽略 aspectRatio 参数。

实例方法

您可以使用实例方法以编程方式控制 pageView 的位置。

.nextPage({Duration duration, Curve curve})

动画到下一页

.previousPage({Duration duration, Curve curve})

动画到上一页

.jumpToPage(int page)

跳转到指定的页面。

.animateToPage(int page, {Duration duration, Curve curve})

动画到指定的页面。

GitHub

https://github.com/serenader2014/flutter_carousel_slider