Android 颤振加载背景中的新页面

Android 颤振加载背景中的新页面,android,flutter,dart,flutter-animation,Android,Flutter,Dart,Flutter Animation,场景:我有一个按钮,按下时播放动画,然后导航到新页面。加载新页面有一个可见的等待时间。但是,此等待时间比初始动画快。当用户看到动画播放时,会在加载新页面时出现可见的暂停 我想知道在播放动画时是否可以在后台加载新页面?这样,当动画完成时,不应该有任何可见的等待时间,用户将立即切换到新页面 目前我使用导航器加载新页面 await Navigator.push(thisContext, MaterialPageRoute(builder: (context) { return NewPag

场景:我有一个按钮,按下时播放动画,然后导航到新页面。加载新页面有一个可见的等待时间。但是,此等待时间比初始动画快。当用户看到动画播放时,会在加载新页面时出现可见的暂停

我想知道在播放动画时是否可以在后台加载新页面?这样,当动画完成时,不应该有任何可见的等待时间,用户将立即切换到新页面

目前我使用导航器加载新页面

await Navigator.push(thisContext, MaterialPageRoute(builder: (context) {
      return NewPage(
        title: "New Page"
      );
    }));
我认为应该可以加载新页面,然后在已经加载且动画完成时将其推送到导航器

这就是目前正在发生的事情

和我想发生的事相比


您是否尝试过使用计时器,因此只需将动画计时器设置为计时器,然后稍后导航即可

Timer(Duration(seconds: animatedSeconds), () {
  // pass your animation time  in seconds and then just navigate 
Navigator.push(thisContext, MaterialPageRoute(builder: (context) {
      return NewPage(
        title: "New Page"
      );
    }));
});

第二个页面将在页面转换开始时创建

参见官方示例

 import 'package:flutter/material.dart';

main() {
  runApp(MaterialApp(
    home: Page1(),
  ));
}

class Page1 extends StatelessWidget {
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: RaisedButton(
          child: Text('Go!'),
          onPressed: () {
            Navigator.of(context).push(_createRoute());
          },
        ),
      ),
    );
  }
}

Route _createRoute() {
  return PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => Page2(),
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      var begin = Offset(0.0, 1.0);
      var end = Offset.zero;
      var curve = Curves.ease;

      var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve));

      return SlideTransition(
        position: animation.drive(tween),
        child: child,
      );
    },
  );
}

class Page2 extends StatelessWidget {
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: Text('Page 2'),
      ),
    );
  }
}
那么,如何更快地初始化第二页呢? 您有以下选项

在启动第二个页面之前获取所需的数据,并将其作为参数传递

您可以在第一次获取数据时缓存数据,然后 继续使用缓存的数据。另外,请确保您使其无效 在特定时间后缓存数据


这实际上不会在后台加载页面。它只是延迟了加载。你有没有找到解决方法@迈克尔·约翰斯顿下面的答案并不能解决问题。