1、添加依賴ide
flutter_swiper: ^1.1.6 flutter_screenutil: ^0.6.1
查看最新版本:https://pub.flutter-io.cnui
2、代碼spa
import 'package:flutter/material.dart'; import 'package:flutter_swiper/flutter_swiper.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; class HomePage extends StatefulWidget{ @override _HomePageState createState() => _HomePageState(); } class _HomePageState extends State<HomePage> { List _imageUrls = [ 'http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg', 'http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg', 'http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg', 'http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg', 'http://h.hiphotos.baidu.com/zhidao/wh%3D450%2C600/sign=0d023672312ac65c67506e77cec29e27/9f2f070828381f30dea167bbad014c086e06f06c.jpg' ]; @override Widget build(BuildContext context) { ScreenUtil.instance = ScreenUtil.getInstance()..init(context); return Scaffold( body: Center( child: Column( children: <Widget>[ Container( width:ScreenUtil().setWidth(1080), height:ScreenUtil().setHeight(500), child: Swiper( pagination: SwiperPagination( alignment: Alignment.bottomCenter, //指示器顯示的位置 margin: const EdgeInsets.fromLTRB(0, 0, 0, 5),// 距離調整 builder: DotSwiperPaginationBuilder(// 指示器構建 space: 2, // 點之間的間隔 size: 6,// 沒選中時的大小 activeSize: 12,// 選中時的大小 color: Colors.white, // 沒選中時的顏色 activeColor: Colors.yellow),//選中時的顏色 ), itemCount: _imageUrls.length, autoplay: true, itemBuilder: (BuildContext contex,int index){ return Image.network( _imageUrls[index], fit: BoxFit.fill ); }, ), ) ], ), ), ); } }