flutter 轮播图库fluuter_swiper

1、在dart库中搜索fluuter_swiper并按教程配置
2、使用
	轮播图的必须包裹有高度的父组件,或者父组件无高宽使用子元素宽高比组件AspectRatio

	 Container(
       child:AspectRatio(
         aspectRatio: 2,
         
         child:Swiper(
          itemBuilder: (BuildContext context,int index){ //设置轮播图
            return new Image.network(imgList[index]["url"],fit: BoxFit.fill,);
          },
          itemCount: 3,  遍历的次数
          pagination: new SwiperPagination(),   底部圆点
          control: new SwiperControl(),    左右箭头
          autoplay: true,    自动播放
          duration: 2000,   间隔时间
          onTap: (index){},   点击回调
          onIndexChanged: (index){},  切换回调
      )
      
     )
    ),

代码示例:

import 'package:flutter/material.dart';
import 'package:date_format/date_format.dart';
import 'package:flutter_cupertino_date_picker/flutter_cupertino_date_picker.dart';
import 'package:flutter_swiper/flutter_swiper.dart';



class Home4 extends StatefulWidget {
  Home4({Key key}) : super(key: key);

  @override
  _Home2State createState() => _Home2State();
}

class _Home2State extends State<Home4> {

  @override
  void initState() { 
    super.initState();
  }

  List<Map> imgList=[
    {
      'url':'https://i0.hdslb.com/bfs/sycp/creative_img/202004/7d041c7a2cf16c5f6d67072782088dc2.jpg',
    },
    {
      'url':'http://i0.hdslb.com/bfs/archive/a14074d43490aae4d363bde491c1d885fb76d224.png@880w_388h_1c_95q'
    },
    {
      'url':"http://i0.hdslb.com/bfs/archive/08e1a548cabe9afbb992e8a8078a4bebe68b47be.png@880w_388h_1c_95q"
    }
  ];

  @override
  Widget build(BuildContext context) {
    return Container(
       child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
         children: <Widget>[
        
        Container(

           child:AspectRatio(
             aspectRatio: 2,
             child:Swiper(
              itemBuilder: (BuildContext context,int index){
                return new Image.network(imgList[index]["url"],fit: BoxFit.fill,);
              },
              itemCount: 3,
              pagination: new SwiperPagination(),  //底部圆点
              control: new SwiperControl(),   //左右箭头
              autoplay: true,
              duration: 2000,
              onTap: (index){},
              onIndexChanged: (index){},
          ),
         )
        ),
       ]),
    );
  }
}

// 因为表单组件需要改变状态,所以要使用有状态组件

/*

轮播图必须外包一层有高度的父容器或者使用子元素宽高比组件AspectRatio


 */