【发布时间】:2019-06-08 16:34:11
【问题描述】:
我创建了一个类似于Navigate to a new screen and back 示例的示例项目。我在每个屏幕上都有TextField 和autofocus: true 的唯一区别:
import 'package:flutter/material.dart';
void main() {
runApp(MaterialApp(
title: 'Navigation Basics',
home: FirstScreen(),
));
}
class FirstScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("FirstScreen build");
return Scaffold(
body: Column(
children: <Widget>[
RaisedButton(
child: Text('Next screen'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => SecondScreen()),
);
},
),
TextField(
decoration: InputDecoration(),
onEditingComplete: () {},
autofocus: true,
)
],
),
);
}
}
class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("SecondScreen build");
return Scaffold(
body: Column(
children: <Widget>[
RaisedButton(
child: Text('Next screen'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => ThirdScreen()),
);
},
),
TextField(
decoration: InputDecoration(),
onEditingComplete: () {},
autofocus: true,
)
],
),
);
}
}
class ThirdScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("ThirdScreen build");
return Scaffold(
body: Column(
children: <Widget>[
RaisedButton(
child: Text('Next screen'),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => FourthScreen()),
);
},
),
TextField(
decoration: InputDecoration(),
onEditingComplete: () {},
autofocus: true,
)
],
),
);
}
}
class FourthScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("FourthScreen build");
return Scaffold(
body: Column(
children: <Widget>[
TextField(
decoration: InputDecoration(),
onEditingComplete: () {},
autofocus: true,
)
],
),
);
}
}
当我从 ThirdScreen 导航到 FourthScreen 时,我的日志如下所示:
I/flutter ( 7523): FourthScreen build
I/flutter ( 7523): SecondScreen build
I/flutter ( 7523): ThirdScreen build
I/flutter ( 7523): FourthScreen build
I/flutter ( 7523): SecondScreen build
I/flutter ( 7523): ThirdScreen build
I/flutter ( 7523): FourthScreen build
- 为什么在第一次构建 FourthScreen 之后 SecondScreen,ThirdScreen 和 FourthScreen build 又被调用?
- 为什么 backstack 中的屏幕在键盘弹出时会被重新排列?
- 为什么不重建 FirstScreen?
【问题讨论】:
-
你应该时刻准备好你的 build() 方法每秒被调用 60 次。如果您从该设计开始,其他一切都会水到渠成。