infinite_card_rotation 是一个用于 Flutter 的插件，它可以帮助你实现无限卡片旋转动画。这个插件通常用于创建类似卡片堆叠和旋转的效果，适合用于展示图片、广告或其他内容。

安装插件

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

dependencies:
  flutter:
    sdk: flutter
  infinite_card_rotation: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来安装插件。

基本用法

以下是一个简单的示例，展示如何使用 infinite_card_rotation 插件来实现无限卡片旋转动画。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Infinite Card Rotation Example'),
        ),
        body: Center(
          child: InfiniteCardRotation(
            cards: [
              Card(
                color: Colors.red,
                child: Center(child: Text('Card 1')),
              ),
              Card(
                color: Colors.blue,
                child: Center(child: Text('Card 2')),
              ),
              Card(
                color: Colors.green,
                child: Center(child: Text('Card 3')),
              ),
            ],
            rotationDuration: Duration(seconds: 2),
            scale: 0.8,
            maxRotation: 0.5,
          ),
        ),
      ),
    );
  }
}

参数说明

• cards: 一个 List<Widget>，包含你想要旋转的卡片。
• rotationDuration: 卡片旋转的持续时间。
• scale: 卡片的缩放比例，通常小于 1.0。
• maxRotation: 卡片旋转的最大角度（以弧度为单位）。

自定义卡片

你可以通过自定义 Card 的样式来创建更复杂的效果。例如，你可以在卡片中添加图片、按钮或其他交互元素。

InfiniteCardRotation(
  cards: [
    Card(
      color: Colors.red,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(Icons.star, size: 50),
          Text('Card 1'),
        ],
      ),
    ),
    Card(
      color: Colors.blue,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(Icons.favorite, size: 50),
          Text('Card 2'),
        ],
      ),
    ),
    Card(
      color: Colors.green,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(Icons.thumb_up, size: 50),
          Text('Card 3'),
        ],
      ),
    ),
  ],
  rotationDuration: Duration(seconds: 2),
  scale: 0.8,
  maxRotation: 0.5,
)

控制动画

你可以通过 InfiniteCardRotation 的 controller 来控制动画的启动和停止。

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  InfiniteCardRotationController _controller;

  [@override](/user/override)
  void initState() {
    super.initState();
    _controller = InfiniteCardRotationController();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Infinite Card Rotation Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              InfiniteCardRotation(
                controller: _controller,
                cards: [
                  Card(
                    color: Colors.red,
                    child: Center(child: Text('Card 1')),
                  ),
                  Card(
                    color: Colors.blue,
                    child: Center(child: Text('Card 2')),
                  ),
                  Card(
                    color: Colors.green,
                    child: Center(child: Text('Card 3')),
                  ),
                ],
                rotationDuration: Duration(seconds: 2),
                scale: 0.8,
                maxRotation: 0.5,
              ),
              SizedBox(height: 20),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  ElevatedButton(
                    onPressed: () => _controller.start(),
                    child: Text('Start'),
                  ),
                  SizedBox(width: 20),
                  ElevatedButton(
                    onPressed: () => _controller.stop(),
                    child: Text('Stop'),
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}