技術標籤：Flutter

哈哈哈，女帝的身材絕了呀，做一個輪播圖慢慢看，身材比例也太好吧，你們也趕緊收藏學起來吧~

老規矩，先看圖
（一）效果圖

（二）效果實現
首先，我們要引入依賴，在pubspec.yml這個檔案寫入一個指令，看圖

版本號可能會不同，給個網址自己去下~
https://pub.dev/packages/flutter_swiper

然後就是準備你喜歡的圖片，開始畫ui啦

話不多說，上程式碼：複製即可執行，你看我多懂你們，嘿嘿

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

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
        home: SwiperPage ()//呼叫
    );
  }
}

class SwiperPage extends StatefulWidget {
  @override
  _SwiperPageState createState() => _SwiperPageState();
}

class _SwiperPageState extends State<SwiperPage> {
  List<Map> imgList = [
    {"url": "images/nvdi.jpg"},
    {"url": "images/nvdi2.jpg"},
    {"url": "images/nvdi3.PNG"}
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("輪播圖"),
      ),
      body: new Swiper(
        itemBuilder: (BuildContext context, int index) {
          return new Image.asset(
           imgList[index]["url"],
            fit: BoxFit.fill,
          );
        },
        autoplay: true,
        itemCount:imgList.length,  //迴圈遍歷次數 
        pagination: new SwiperPagination(),//配置分頁器
        control: new SwiperControl(),//左右箭頭
      ),
    );
  }
}