英雄动画不能正常工作?

时间:2018-05-25 22:41:07

标签: transition flutter

我是Flutter的新人。 今天我创建了启动画面和登录界面。然后我想从启动画面动画我的徽标 - >登录界面。 但是当我运行代码时,动画无效 这是我的代码:

启动画面

class SplashScreen extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return new MaterialApp(
      home: new SplashScreenPage(),
      routes: <String, WidgetBuilder>{
      '/LoginPage': (BuildContext context) => new LoginPage()
      },
    );
  }
}

class SplashScreenPage extends StatefulWidget{
  SplashScreenPage({Key key, this.title}) : super(key: key);

  final String title;
  @override
  State<StatefulWidget> createState() {
    return new SplashScreenState();
  }
}


class SplashScreenState extends State<SplashScreenPage>{
  startTime() async {
    var _duration = new Duration(seconds: 2);
    return new Timer(_duration, navigationPage);
  }

  void navigationPage() {
    Navigator.of(context).pushNamed('/LoginPage');
  }

  @override
  void initState() {
    startTime();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            new SizedBox(
              child: new Hero(
                  tag: 'hero-tag-llama',
                  child: new Image.asset(
                    'images/logo_futurisx.png',
                    fit: BoxFit.cover,
                    height: 150.0,
                  )
              ),
            )
          ],
        )
      ),
    );
  }

登录屏幕

class LoginState extends State<LoginPage>{
  final userNameController = new TextEditingController();
  final passwordController = new TextEditingController();

  @override
  Widget build(BuildContext context) {
    var _imageBox = new SizedBox(
      child: new Hero(
          tag: 'hero-tag-llama',
          child: new Image.asset(
            'images/logo_futurisx.png',
            fit: BoxFit.cover,
            height: 100.0,
          )
      ),
    );

    var _loginForm = new Container(
        padding: new EdgeInsets.all(32.0),
        child: new Column(
          children: <Widget>[
            new TextField(
              maxLines: 1,
              controller: userNameController,
              decoration: new InputDecoration(
                  border: new UnderlineInputBorder(),
                  fillColor: Colors.green,
                  hintText: "Username"
              ),
            ),
            new Container(
              padding: new EdgeInsets.only(bottom: 20.0),
            ),
            new TextField(
              maxLines: 1,
              controller: passwordController,
              decoration: new InputDecoration(
                  border: new UnderlineInputBorder(),
                  fillColor: Colors.green,
                  hintText: "Password"
              ),
            ),
            new Container(
              padding: new EdgeInsets.only(bottom: 30.0),
            ),
            new RaisedButton(
                padding: new EdgeInsets.fromLTRB(30.0, 10.0, 30.0, 10.0),
                child: new Text("Login", style: new TextStyle(color: Colors.white)),
                elevation: 4.0,
                color: Colors.teal,
                onPressed: (){
                  login(userNameController.text, passwordController.text);
                }
            ),
        ])
    );


    return new Scaffold(
        key: _scaffoldKey,
        body: new Center(
            child: new Column(
              mainAxisAlignment: MainAxisAlignment.center,
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                _imageBox,
                _loginForm
              ],
            )
        )
    );
  }

我上传的视频:

https://vimeo.com/271938052

当我在登录屏幕中评论_loginForm布局时,

children: <Widget>[
                _imageBox,
                //_loginForm
              ],

动画正常工作。任何人都可以帮助我知道为什么动画没有按预期运行?

更新-----------

经过大量的搜索和修复,我发现Timer可能是块线程(或类似的东西,..)删除了计时器让按钮点击动作来改变页面,动画正常工作。

有人遇到这个问题吗?

0 个答案:

没有答案