英雄小部件不是第一次启动(扑动)

时间:2020-05-20 13:30:31

标签: flutter animation

该动画在第一次启动时不起作用(在GestureDetector中的onTap),但是如果我向后退,则在下一次可以使用。而且我不知道为什么。 这是我的代码:

  • 在main.dart中:
import 'package:fairlove/screen/splash_screen.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}


class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SplashScreen(),
    );
  }

}

splash_screen和login_screen位于“ screen”文件夹下。

  • 在screen / splash_screen.dart中:
import 'package:flutter/material.dart';
import 'login_screen.dart';

class SplashScreen extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Hero(
        tag: 'homeLogo',
        child: GestureDetector(
          onTap: () => Navigator.push(context, MaterialPageRoute(builder: (context) => LoginScreen(),)),
            child: Image.asset('assets/logo.png')
        ),
      ),
    );
  }
}

当我第一次单击图像时,它进入LoginScreen,确定,但是没有动画。

  • 并在screen / login_screen.dart中:
import 'package:flutter/material.dart';



const users = const {
  'a@a.a': 'aaa',
  'hunter@gmail.com': 'hunter',
};


class LoginScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final userNameController = TextEditingController();
    final passwordController = TextEditingController();

    final logo = Hero(
      tag: 'homeLogo', 
      child: CircleAvatar(
        backgroundColor: Colors.transparent,
        radius: 40.0,
        child: Image.asset('assets/logo.png'),
    ));

    final txtUserName = TextField(
      controller: userNameController,
      decoration: InputDecoration(
        hintText: 'Username',
        contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
        border: OutlineInputBorder(borderRadius: BorderRadius.circular(30.0))
      ),
    );

    final txtPassword = TextField(
      controller: passwordController,
      obscureText: true,
      decoration: InputDecoration(
        hintText: 'Password',
        contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
        border: OutlineInputBorder(borderRadius: BorderRadius.circular(30.0))
      ),
    );

    final btnLogin = RaisedButton(
      color: Colors.deepPurpleAccent,
      textColor: Colors.white,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(10.0))),
      onPressed: () {
        if(userNameController != null && userNameController.text == "abc"
        && passwordController!= null && passwordController.text == "123") {
          //Navigator.of(context).pushReplacement(newRoute)
        }
      },
      child: Text('Login', style: TextStyle(fontSize: 20.0),),
    );

    final btnForgetPassword = FlatButton(
      onPressed: () {  },
      child: Text('Forget Password', style: TextStyle(color: Colors.blue),),
    );

    return Scaffold(
      body: Center(
        child: Container(
          width: 400,
          height: 400,
          child: ListView(
            padding: EdgeInsets.only(left: 25.0, right: 25.0),
            children: <Widget>[
              logo,
              SizedBox(height: 20.0),
              txtUserName,
              SizedBox(height: 20.0),
              txtPassword,
              SizedBox(height: 20.0),
              btnLogin,
              btnForgetPassword
            ],
          ),
        ),
      ),
    );
  }

}

如果我返回或/然后再次单击上一个屏幕上的图像,英雄动画将起作用。

0 个答案:

没有答案