1

我在我的项目中是tcard pkg 。我想每 5 秒自动重置卡列表的长度正在改变但 UI 没有重置，在 tcardController.state 中获得 null 是否有任何其他 pkg，所以我们可以实现此 tcard pkg 的相同功能。

请参考以下代码：-

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:tcard/tcard.dart';

List<Color> colors = [
  Colors.blue,
  Colors.yellow,
  Colors.red,
  Colors.orange,
  Colors.pink,
  Colors.amber,
  Colors.cyan,
  Colors.purple,
  Colors.brown,
  Colors.teal,
];

class TCardPage extends StatefulWidget {
  const TCardPage({Key? key}) : super(key: key);

  @override
  _TCardPageState createState() => _TCardPageState();
}

class _TCardPageState extends State<TCardPage> {
  final TCardController _controller = TCardController();
  int _index = 0;
  Timer? timer;
  bool changeColor = false;

  @override
  void initState() {
    super.initState();
    timer = Timer.periodic(
        const Duration(seconds: 5), (Timer t) => sequenceApiCall());
    print(_controller.state.toString());
    // _controller.reset;
  }

  void sequenceApiCall() {
    changeColor = !changeColor;
    Future.delayed(const Duration(seconds: 10), () {
      print('sequenceApiCall');
      if (changeColor) {
        print('changeColor');
        colors.removeAt(0);
        print('color count = ${colors.length}'); //9
      } else {
        colors.insert(0, Colors.black);
        print('black');
        print('color count = ${colors.length}'); //10
      }
      print(_controller.state.toString());
      _controller.reset();
      setState(() {});
    });
  }

  @override
  void dispose() {
    super.dispose();
    timer?.cancel();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          children: <Widget>[
            const SizedBox(height: 200),
            TCard(
              cards: cardsColor,
              controller: _controller,
              onForward: (index, info) {
                _index = index;
                print(info.direction);
                setState(() {});
              },
              onBack: (index, info) {
                _index = index;
                setState(() {});
              },
              onEnd: () {
                print('end');
              },
            ),
            SizedBox(height: 20),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                OutlineButton(
                  onPressed: () {
                    _controller.back();
                  },
                  child: const Text('Back'),
                ),
                OutlineButton(
                  onPressed: () {
                    _controller.forward();
                  },
                  child: const Text('Forward'),
                ),
                OutlineButton(
                  onPressed: () {
                    _controller.reset();
                  },
                  child: const Text('Reset'),
                ),
              ],
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        child: Text(_index.toString()),
      ),
    );
  }

  List<Widget> cardsColor = List.generate(
    colors.length,
    (int index) {
      return Container(
        alignment: Alignment.center,
        decoration: BoxDecoration(
          color: colors[index],
        ),
        child: Text(
          '${index + 1}',
          style: const TextStyle(fontSize: 100.0, color: Colors.white),
        ),
      );
    },
  );
}

提前致谢。！！！

4

0 回答 0