Flutter Duration详细概述

最新推荐文章于 2025-04-02 16:23:48 发布

早起的年轻人

最新推荐文章于 2025-04-02 16:23:48 发布

阅读量6.3k

点赞数 2

分类专栏： Flutter项目开发全套教程文章标签： Flutter flutter教程跨平台开发 Android开发 iOS开发

本文链接：https://blog.csdn.net/zl18603543572/article/details/111479312

版权

Flutter项目开发全套教程专栏收录该内容

285 篇文章

订阅专栏

在码农的世界里，优美的应用体验，来源于程序员对细节的处理以及自我要求的境界，年轻人也是忙忙碌碌的码农中一员，每天、每周，都会留下一些脚印，就是这些创作的内容，有一种执着，就是不知为什么，如果你迷茫，不妨来瞅瞅码农的轨迹。

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);
        }
      });
    }
  }