Flutter笔记（12）flutter中swiper实现轮播图

在Flutter中，可以使用swiper插件来实现轮播图功能。首先，需要在pubspec.yaml文件中添加依赖：

dependencies:
  flutter:
    sdk: flutter
  # 添加swiper依赖
  swiper: ^1.1.2

然后，在代码中使用Swiper控件：

import 'package:flutter/material.dart';
import 'package:swiper/swiper.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}
 
class HomePage extends StatelessWidget {
  List<String> imgList = [
    'https://example.com/image1.jpg',
    'https://example.com/image2.jpg',
    'https://example.com/image3.jpg',
  ];
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Swiper(
          itemBuilder: (BuildContext context, int index) {
            return Image.network(
              imgList[index],
              fit: BoxFit.fill,
            );
          },
          itemCount: imgList.length,
          // 其他Swiper参数设置
          autoplay: true, // 自动播放
        ),
      ),
    );
  }
}

在这个例子中，我们创建了一个HomePage类，它包含一个图片URL列表imgList。在build方法中，我们使用Swiper控件来展示轮播图，并通过itemBuilder构建每一个轮播项。通过设置autoplay为true，可以实现自动播放的效果。