flutter AnimatedList

AnimatedList 和 ListView 的功能大体相似，相比多了一个动效

//定义   GlobalKey必须指定类型
final _globalKey = GlobalKey<AnimatedListState>();

// 添加
onPressed: () {
    list.add("新数据");
    _globalKey.currentState!.insertItem(list.length - 1);
}, 

// 删除
_globalKey.currentState!.removeItem(index, (context, animation) {
      var removeItem = _buildItem(index);//先获取删除项的实例
	  list.removeAt(index);//将原集合数据也删除
      return FadeTransition(opacity: animation, child: removeItem, duration: const Duration(milliseconds: 500));  //根据实例进行删除
});

// 将_globalKey 传递给 AnimatedList
AnimatedList(
    key: _globalKey,
    initialItemCount: list.length, //列表长度
    itemBuilder: (BuildContext context, int index, animation) => FadeTransition(
        opacity: animation,    //动画效果
        child: ListTile( title: Text(list[index])),
    ),
),


//index 插入到哪个位置 [].length-1  代表最后一位
void insertItem(int index, { Duration duration = _kDuration });
void removeItem(int index, AnimatedListRemovedItemBuilder builder, { Durationduration = _kDuration }) ;

//运行代码
import 'dart:async';

import 'package:flutter/material.dart';

void main() {
  runApp(
    const MyAPP(),
  );
}

class MyAPP extends StatelessWidget {
  const MyAPP({super.key});
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(title: 'contaniner', home: HomePage());
  }
}

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  List<String> list = ['1', '2', '3'];
  bool flag = true;
  final _globalKey = GlobalKey<AnimatedListState>();
  Widget _buildItem(index) => ListTile(
        title: Text(list[index]),
        trailing: IconButton(
            icon: const Icon(Icons.delete),
            onPressed: () => _deleteItem(index)),
      );
  _deleteItem(index) {
    //添加控制器 同时间内多次点击删除报错
    if (flag == true) {
      flag = false;
      _globalKey.currentState!.removeItem(index, (context, animation) {
        var removeItem = _buildItem(index); //先获取删除项的实例
        list.removeAt(index);//将原集合数据也删除,否则添加时 索引出错
        return FadeTransition(opacity: animation, child: removeItem); //根据实例进行删除
        // return FadeTransition(opacity: animation, child: _buildItem(index)); //根据实例进行删除
      }, duration: const Duration(milliseconds: 500));
      //解决快速删除问题
      Timer.periodic(const Duration(milliseconds: 500), (timer) {
        flag = true;
        timer.cancel();
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Center(child: Text('PageViewSwiper1')),
      ),
      floatingActionButton: FloatingActionButton(
        // 浮动按钮
        onPressed: () {
          list.add('我是添加的');
          _globalKey.currentState!.insertItem(list.length - 1);
        }, //执行方法
        tooltip: 'Increment', // 提示
        child: const Icon(Icons.add), //按钮文案
      ),
      body: AnimatedList(
        key: _globalKey,
        initialItemCount: list.length, //列表长度
        itemBuilder: (BuildContext context, int index, animation) =>
            FadeTransition(
          opacity: animation,
          child: _buildItem(index),
        ),
      ),
    );
  }
}