Flutter-2(轮播)

96 阅读1分钟

组件地址

flutter_swiper_view: ^1.1.8
//安装依赖
flutter pub get 

新建HomePage.dart import 'package:flutter_swiper_view/flutter_swiper_view.dart';

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

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<StatefulWidget> createState() {
    return _HomePageState();
  }
}

class _HomePageState extends State<HomePage> {
  List<String> swiperList = [
    'https://img2.baidu.com/it/u=2102877950,2155081877&fm=253&fmt=auto&app=120&f=JPEG?w=800&h=500',
    'https://img0.baidu.com/it/u=1344768,3535695655&fm=253&fmt=auto&app=138&f=JPEG?w=987&h=800',
    'https://img2.baidu.com/it/u=2102877950,2155081877&fm=253&fmt=auto&app=120&f=JPEG?w=800&h=500'
  ];
  void onTap(int index){
    print("点击了$index");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: Column(
      children: [
        Container(
          width: double.infinity,
          height: 150,
          child: Swiper(
            itemBuilder: (context, index) {
              return Image.network(
                swiperList[index],
                fit: BoxFit.fill,
              );
            },
            itemCount: 3,
            pagination: const SwiperPagination(),
            // control: const SwiperControl(),
            loop: true,
            onTap: onTap,
          ),
        )
      ],
    )));
  }
}

录屏2024-09-12 14.48.32.gif