博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Flutter淘宝App之首页聚划算倒计时的实现
阅读量:6232 次
发布时间:2019-06-21

本文共 1506 字,大约阅读时间需要 5 分钟。

Talk is cheap. Show me the code.

Flutter 淘宝App中为了实现聚划算的倒计时,我是这么做的,如下所示。

我就不废话了,这个实现起来不复杂,直接看代码吧

完整代码在 GitHub:

AnimationController _animationController;  String get hoursString {    Duration duration = _animationController.duration * _animationController.value;    return '${(duration.inHours)..toString().padLeft(2, '0')}';  }  String get minutesString {    Duration duration = _animationController.duration * _animationController.value;    return '${(duration.inMinutes % 60).toString().padLeft(2, '0')}';  }  String get secondsString {    Duration duration = _animationController.duration * _animationController.value;    return '${(duration.inSeconds % 60).toString().padLeft(2, '0')}';  }复制代码
void initState() {  //倒计时,注意vsync:this,这里需要混入TickerProviderStateMixin    _animationController = AnimationController(vsync: this, duration: Duration(hours: 10, minutes: 30, seconds: 0));    _animationController.reverse(from: _animationController.value == 0.0 ? 1.0 : _animationController.value);}复制代码

如何使用

AnimatedBuilder(        animation: _animationController,        builder: (_, Widget child) {          return Row(children: 
[ ClipRRect( borderRadius: BorderRadius.circular(3), child: Container( color: Colors.red, child: Text( secondsString, style: TextStyle( color: Colors.white, ), ), ), ), ]); });复制代码

转载地址:http://ysana.baihongyu.com/

你可能感兴趣的文章
js关闭当前页面(窗口)的几种方式总结
查看>>
Mastering Debugging in Visual Studio 2010 - A Beginner's Guide
查看>>
前端模拟API数据的两种方式
查看>>
Django Rest Framework remove csrf
查看>>
linux 学习笔记 软件包管理
查看>>
HTML5学习之三:文件与拖放
查看>>
41. 包含min函数的栈
查看>>
07-linux基础四-系统监控和硬盘分区
查看>>
Struts2之上传
查看>>
centos7 修改 PATH环境变量(注意,不是添加!!!TMD)
查看>>
Fetch from Upstream 变灰失效
查看>>
唉,都是一辈子呀…
查看>>
pmwiki制作网页的基本操作
查看>>
织梦开发——相关阅读likeart应用
查看>>
SQL2008-表对表直接复制数据
查看>>
Java IO: FileOutputStream
查看>>
Java NIO系列教程(六) Selector
查看>>
Spring配置多数据源
查看>>
实验二
查看>>
ie兼容性问题 前传
查看>>