在码农的世界里,优美的应用体验,来源于程序员对细节的处理以及自我要求的境界,年轻人也是忙忙碌碌的码农中一员,每天、每周,都会留下一些脚印,就是这些创作的内容,有一种执着,就是不知为什么,如果你迷茫,不妨来瞅瞅码农的轨迹。
1 Duration 是什么 ?
Duration 表示 持续时间,如1天,1小时,1分钟,1秒,100毫秒,100纳秒等。
2 Duration 用在哪 Duration 怎么用 ?
直接通过构造函数来创建,参数均为可选参数,说明如下:
const Duration(
{int days = 0,//天
int hours = 0,//小时
int minutes = 0,//分钟
int seconds = 0,//秒
int milliseconds = 0,//毫秒
int microseconds = 0})//纳秒
2.1 Duration 常与 计时器 Timer 结合使用
如创建一个延时2秒的计时器
//通过毫秒定义
Duration duration = new Duration(milliseconds: 2000);
//通过秒定义
Duration duration2 = new Duration(seconds: 2);
//创建计时器
Timer timer = Timer(duration, (){
//延时回调
});
2.2 Duration 也可与Future 结合使用
如创建一个延时2秒的计时器
//通过秒定义
Duration duration = new Duration(seconds: 2);
Future.delayed(duration,(){
//延时回调
});
2.3 Duration 也可以与 AnimatedXXX系列组件结合使用
如透明度在1200毫秒中动态切换
double _opacity = 1.0;
Widget buildControllerWidget() {
//动画过渡透明度组件
return AnimatedOpacity(
//过渡时间
duration: Duration(milliseconds: 1200),
opacity: _opacity,
child:... ,
);
}
2.4 Duration 用在动画系列中
如在动画控制器中定义时间周期
class _TestState extends State
with TickerProviderStateMixin {
//动画控制器
AnimationController _ationController;
//页面初始化方法
@override
void initState() {
super.initState();
//初始化 回弹执行时间为 400毫秒
_ationController = AnimationController(
vsync: this,
duration: Duration(milliseconds: 400),
);
}
2.5 Duration 也会用在自定义路由中
///从下向上打开页面
///[isReplace]是否替换当前
///[opaque]是否是以背景透明方式打开新的页面
///[dismissCallBack]关闭页面的回调
static void openPageFromBottom(BuildContext context, Widget page,
{bool isReplace = false,
bool opaque = true,
Function(dynamic value) dismissCallBack}) {
//自定义路由
PageRouteBuilder pageRouteBuilder = new PageRouteBuilder(
opaque: opaque,
//页面构建
pageBuilder: (BuildContext context, Animation<double> animation,
Animation<double> secondaryAnimation) {
//目标页面
return page;
},
//打开页面过渡时间
transitionDuration: Duration(milliseconds: 600),
//关闭页面过渡时间
reverseTransitionDuration: Duration(milliseconds: 400),
//过渡动画
transitionsBuilder: (
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,
) {
//平移过渡动画
return SlideTransition(
// 从位置(-1.0, 0.0) 平移到 (0.0, 0.0)
position: Tween(
begin: Offset(0.0, 1.0),
end: Offset(0.0, 0.0),
).animate(
CurvedAnimation(
parent: animation,
curve: Curves.easeInOut,
),
),
child: child,
);
});
if (isReplace) {
Navigator.of(context).pushReplacement(pageRouteBuilder);
} else {
Navigator.of(context).push(pageRouteBuilder).then((value) {
if (dismissCallBack != null) {
dismissCallBack(value);
}
});
}
}