flutter_tindercard 是一个用于实现类似 Tinder 卡片滑动效果的 Flutter 插件。它可以让你轻松地在应用中实现卡片的滑动、匹配和取消匹配等功能。以下是如何使用 flutter_tindercard 插件的基本步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 flutter_tindercard 依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_tindercard: ^0.0.1

然后运行 flutter pub get 来安装依赖。

2. 基本使用

以下是一个简单的示例，展示如何使用 flutter_tindercard 插件来实现卡片滑动效果：

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Tinder Card Demo'),
        ),
        body: Center(
          child: TinderCardDemo(),
        ),
      ),
    );
  }
}

class TinderCardDemo extends StatefulWidget {
  @override
  _TinderCardDemoState createState() => _TinderCardDemoState();
}

class _TinderCardDemoState extends State<TinderCardDemo> {
  List<String> cards = [
    'Card 1',
    'Card 2',
    'Card 3',
    'Card 4',
    'Card 5',
  ];

  @override
  Widget build(BuildContext context) {
    return TinderSwapCard(
      orientation: AmassOrientation.BOTTOM,
      totalNum: cards.length,
      stackNum: 3,
      swipeEdge: 4.0,
      maxWidth: MediaQuery.of(context).size.width * 0.9,
      maxHeight: MediaQuery.of(context).size.height * 0.7,
      minWidth: MediaQuery.of(context).size.width * 0.8,
      minHeight: MediaQuery.of(context).size.height * 0.6,
      cardBuilder: (context, index) => Card(
        child: Center(
          child: Text(
            cards[index],
            style: TextStyle(fontSize: 24.0),
          ),
        ),
      ),
      swipeUpdateCallback: (DragUpdateDetails details, Alignment align) {
        // 滑动过程中的回调
        if (align.x < 0) {
          // 向左滑动
        } else if (align.x > 0) {
          // 向右滑动
        }
      },
      swipeCompleteCallback: (CardSwipeOrientation orientation, int index) {
        // 滑动完成的回调
        if (orientation == CardSwipeOrientation.LEFT) {
          // 向左滑动完成
        } else if (orientation == CardSwipeOrientation.RIGHT) {
          // 向右滑动完成
        }
      },
    );
  }
}

3. 参数说明

• orientation: 卡片堆叠的方向，可以是 AmassOrientation.TOP 或 AmassOrientation.BOTTOM。
• totalNum: 卡片的总数。
• stackNum: 同时显示的卡片数量。
• swipeEdge: 滑动的边界，表示卡片需要滑动多少距离才会触发滑动完成。
• maxWidth 和 maxHeight: 卡片的最大宽度和高度。
• minWidth 和 minHeight: 卡片的最小宽度和高度。
• cardBuilder: 构建卡片的回调函数，返回一个 Widget。
• swipeUpdateCallback: 滑动过程中的回调，可以获取当前的滑动方向和距离。
• swipeCompleteCallback: 滑动完成后的回调，可以获取滑动的方向和卡片的索引。

4. 自定义卡片样式

你可以通过 cardBuilder 回调函数来自定义卡片的样式。例如，你可以在卡片中添加图片、按钮等元素。

cardBuilder: (context, index) => Card(
  child: Column(
    children: [
      Image.network('https://picsum.photos/200/300'),
      Text(
        cards[index],
        style: TextStyle(fontSize: 24.0),
      ),
      ElevatedButton(
        onPressed: () {
          // 按钮点击事件
        },
        child: Text('Click Me'),
      ),
    ],
  ),
),

5. 处理滑动事件

你可以通过 swipeUpdateCallback 和 swipeCompleteCallback 来处理滑动事件。例如，你可以根据滑动的方向来执行不同的操作。

swipeCompleteCallback: (CardSwipeOrientation orientation, int index) {
  if (orientation == CardSwipeOrientation.LEFT) {
    print('Card $index swiped left');
  } else if (orientation == CardSwipeOrientation.RIGHT) {
    print('Card $index swiped right');
  }
},