Mfagrilist

一个Flutter小部件，用于创建具有可自定义项目的视觉吸引力的轮播图。

关于

Mfagrilist是一个多功能的Flutter小部件，可简化轮播图和滑块类UI组件的创建。它允许您通过突出的中间项目和可自定义的视觉效果来展示项目列表。

主要属性

viewPortSize: 一个介于0和1之间的双精度值，用于确定项目可见部分的大小。例如，值为0.3表示一次只能看到30%的项目。

disableInfiniteScrolling: 一个布尔值，用于确定是否启用了无限滚动。当设置为false时，列表将在两个方向上无限滚动。当设置为true时，列表将在到达项目开头或结尾时停止滚动。

middleItemScaleRatio: 一个双精度值，指定中间项目的比例因子。此属性仅在scaleMiddleItem设置为true时才相关。默认值为1，表示不缩放。

scaleMiddleItem: 一个布尔值，用于确定是否缩放中间项目。当设置为true时，中间项目将根据middleItemScaleRatio属性进行缩放。

itemBuilder: 一个回调函数，用于定义列表中每个项目的控件。

itemCount: 一个整数，指定列表中项目的总数。

示例

import 'package:curvelist/mfagrilist.dart';
import 'package:curvelist/painter.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: ''),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  
final List<Color> colorList = [
    Colors.red,
    Colors.green,
    Colors.blue,
    Colors.yellow,
    Colors.orange,
    Colors.deepPurple
  ];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Container(
          height: 500,
          color: Colors.amber,
          child: 
          Mfagrilist(itemBuilder: (context,index){
            return Center(
                                child: CustomPaint(
                                  size: Size(
                                    350,
                                    450,
                                  ),
                                  painter:
                                      RPSCustomPainter(color: colorList[index]),
                                ),
                              );
          },
          itemCount: colorList.length,
          scaleMiddleItem: true,
          viewPortSize: 0.3,
          disableInfiniteScrolling: false,
          middleItemScaleRatio: 1,
          ),
        ),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

GitHub

查看 Github