Flutter: AnimatedList 一个滚动容器,可在插入或移除项目时为其设置动画
import 'dart:math';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHome(),
);
}
}
class MyHome extends StatefulWidget {
@override
_MyHomeState createState() => _MyHomeState();
}
class _MyHomeState extends State<MyHome> {
Tween<Offset> myTween = Tween<Offset>(
begin: Offset(1, 0),
end: Offset(0, 0),
);
var _data = <String>[];
final _myListKey = GlobalKey<AnimatedListState>();
Widget myListItem(String d, animation) {
return SlideTransition(
position: animation.drive(myTween),
child: myItem(d),
);
}
Widget myItem(String d) {
return ListTile(
title: Text(
'${d}',
style: TextStyle(fontSize: 40),
),
trailing: IconButton(
onPressed: () {
var index = _data.indexOf(d);
_data.remove(d);
_myListKey.currentState.removeItem(
index, (context, animation) => myListItem(d, animation));
},
icon: Icon(Icons.delete_forever),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter Demo'),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
String newv = Random().nextInt(1000).toString();
_data.add(newv);
var index = _data.lastIndexOf(newv);
_myListKey.currentState.insertItem(index);
},
child: Icon(Icons.add),
),
body: AnimatedList(
key: _myListKey,
initialItemCount: _data.length,
itemBuilder: (context, int index, Animation<double> animation) {
return myListItem(_data[index], animation);
},
),
);
}
}
Flutter: AnimatedList 一个滚动容器,可在插入或移除项目时为其设置动画的更多相关文章
- Laya的滚动容器
想实现一个简单的滚动容器.例如水平排列10个图标,可以左右滑动查看的. Egret里有布局容器可以滚动 Laya看了教程和示例,没有找到一个滚动容器,只有一个list,需要设置item,显然不是我想要 ...
- sql 根据指定条件获取一个字段批量获取数据插入另外一张表字段中+MD5加密
/****** Object: StoredProcedure [dbo].[getSplitValue] Script Date: 03/13/2014 13:58:12 ******/ SET A ...
- 集群: 如何在spring 任务中 获得集群中的一个web 容器的端口号?
系统是两台机器, 跑四个 web 容器, 每台机器两个容器 . nginx+memcached+quartz集群,web容器为 tomcat . web 应用中 用到spring 跑多个任务,任务只能 ...
- servlet的一个web容器中有且只有一个servlet实例或有多个实例的理解1
servlet的一个web容器中有且只有一个servlet实例或有多个实例的理解 (2013-06-19 19:30:40) 转载▼ servlet的非线程安全,action的线程安全 对提交 ...
- c - 向一个排序好的数组插入一个数,插入后数组依然是排序好的
概述 因为这里只是演示插入1个数,这里我不用malloc再重新分配,而是将原先数组的腾出一个占位符. 完整代码如下: #include <stdio.h> #define LEN 6 // ...
- 【中英对照】【EntLib6】【Unity】实验1:使用一个Unity容器
Lab 1: Using a Unity Container 实验1:使用一个Unity容器 Estimated time to complete this lab: 15 minutes 估计完成时 ...
- 如何设计一个web容器
开发一个web容器涉及很多不同方面不同层面的技术,例如通信层的知识,程序语言层面的知识等等,且一个可用的web容器是一个比较庞大的系统,要说清楚需要很长的篇幅,本文旨在介绍如何设计一个web容器,只探 ...
- 对于Servlet、Servlet容器以及一个Servlet容器-Tomcat
Servlet.Servlet容器等内容讲解 转载自http://blog.csdn.net/iAm333 对于Servlet.Servlet容器以及一个Servlet容器-Tomcat这些概念讲解的 ...
- jQuery生成一个DIV容器,ID是"rating".
我们需要一些服务器端代码,这个例子中用到了一个PHP文件,读取rating参数然后返回rating总数和平均数.看一下rate.php代码.虽然这些例子也可以不使用AJAX来实现,但显示我们不会那么做 ...
随机推荐
- vue开发中的"骚操作"
前言 在与同事协作开发的过程中,见识到了不少"骚操作".因为之前都没用过,所以我愿称之为"高级技巧"! Vue.extend 在交互过程中,有个需求就是点击图标 ...
- IDEA、Pycharm学生免费使用(无教育邮箱)
一.打开JetBrains学生产品网站 JetBrains Products for Learning:https://www.jetbrains.com/shop/eform/students 二. ...
- loj10012 Best Cow Fences
题目描述 原题来自:USACO 2003 Mar. Green 给定一个长度为 N 的非负整数序列 A ,求一个平均数最大的,长度不小于 L 的子段. 输入格式 第一行用空格分隔的两个整数 N 和 L ...
- C# 实现一个基于值相等性比较的字典
C# 实现一个基于值相等性比较的字典 Intro 今天在项目里遇到一个需求,大概是这样的我要比较两个 JSON 字符串是不是相等,JSON 字符串其实是一个 Dictionary<string, ...
- Excel 多种粘贴方式
一.粘贴为数值. 这个功能是选择性粘贴中最常用的功能.因为excel主要功能之一就是用来做数据分析,把其他格式粘贴为数据格式才能进行数据运算,把带有公式的计算结果粘贴为数值格式可以使复制后的内容不会变 ...
- 网页开发(HTML 基础)
网页的标准是W3C,目前模式是HTML.CSS和JavaScript. HTML,全称"Hyper Text Markup Language(超文本标记语言)",简单来说,网页就是 ...
- Python3 注释、运算符、数字、字符串
文章目录 注释 单引号(''') 双引号(""") 运算符 数字(Number) Python 数字类型转换 数学函数 随机数函数 三角函数 数学常量 数字与字符,列表之 ...
- spark SQL (四)数据源 Data Source----Parquet 文件的读取与加载
spark SQL Parquet 文件的读取与加载 是由许多其他数据处理系统支持的柱状格式.Spark SQL支持阅读和编写自动保留原始数据模式的Parquet文件.在编写Parquet文件时,出于 ...
- RIDE对应驱动下载
https://blog.csdn.net/apollolkj/article/details/75408237
- 27.SELinux 安全子系统
1.SELinux(Security-Enhanced Linux)是美国国家安全局在Linux 开源社区的帮助下开发的一个强制访问控制(MAC,Mandatory Access Control)的安 ...