我是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可能是块线程(或类似的东西,..)删除了计时器让按钮点击动作来改变页面,动画正常工作。
有人遇到这个问题吗?