如何在扑扑中改变英雄动画的速度

Question

我按照Flutter网站的指示制作了简单的英雄动画

它可以按照说明中的说明工作，但就我而言，我希望它从第一个屏幕到第二个屏幕的动画制作速度要慢得多。有谁知道如何更改此动画的速度？

Answer 1

要修改转换速度，您必须调整PageRoute转换持续时间（如@diegoveloper所指出的）。

如果要保留默认过渡，则可以创建实现MaterialPageRoute的类。如果您已经拥有自己的过渡或想要创建一个过渡，则可以使用PageRouteBuilder轻松构建自己的过渡。只需调整transitionDuration。

这是一个小的独立示例，使用PageRouteBuilder：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Page1(),
    );
  }
}

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            RaisedButton(
              child: Text('Page2'),
              onPressed: () => Navigator.push(
                  context,
                  PageRouteBuilder(
                      transitionDuration: Duration(seconds: 2),
                      pageBuilder: (_, __, ___) => Page2())),
            ),
            Hero(tag: 'home', child: Icon(Icons.home))
          ],
        ),
      ),
    );
  }
}

class Page2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Hero(
          tag: 'home',
          child: Icon(
            Icons.home,
          ),
        ),
      ),
    );
  }
}