我正在开发一个Flutter应用程序,它会提示表单询问一些个人信息. 问题是每次发生某些事情时都会重建页面,例如屏幕方向改变或文本字段获得焦点时(键盘会立即显示并消失,从而阻止用户
问题是每次发生某些事情时都会重建页面,例如屏幕方向改变或文本字段获得焦点时(键盘会立即显示并消失,从而阻止用户输入任何内容).
显然有些事情正在触发不必要的重建,但我无法找到什么和哪里.
当我将此页面作为主页插入时,一切正常.
当我在启动画面上显示动画后将页面插入其预期位置时会出现问题,所以我想这与我的问题有关.
主要课程:
import 'package:flutter/material.dart'; import './view/SplashScreen.dart'; void main() => runApp(new MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( title: 'Flutter Demo', theme: new ThemeData( primarySwatch: Colors.blue, ), home: new SplashScreen(), ); } }
启动画面:
import 'package:flutter/material.dart'; import 'dart:async'; import './UserLoader.dart'; class SplashScreen extends StatefulWidget { @override _SplashScreenState createState() => new _SplashScreenState(); } class _SplashScreenState extends State<SplashScreen> with SingleTickerProviderStateMixin { AnimationController _iconAnimationController; CurvedAnimation _iconAnimation; @override void initState() { super.initState(); _iconAnimationController = new AnimationController( vsync: this, duration: new Duration(milliseconds: 2000)); _iconAnimation = new CurvedAnimation( parent: _iconAnimationController, curve: Curves.easeIn); _iconAnimation.addListener(() => this.setState(() {})); _iconAnimationController.forward(); startTimeout(); } @override Widget build(BuildContext context) { return new Material( color: Colors.white, child: new InkWell( child: new Center( child: new Container( width: 275.0, height: 275.0, decoration: new BoxDecoration( image: new DecorationImage( colorFilter: new ColorFilter.mode( Colors.white.withOpacity(_iconAnimation.value), BlendMode.dstATop), image: new AssetImage("images/logo.png")), ), ), ), ), ); } void handleTimeout() { Navigator.of(context).pushReplacement(new MaterialPageRoute( builder: (BuildContext context) => new UserLoader())); } startTimeout() async { var duration = const Duration(seconds: 3); return new Timer(duration, handleTimeout); } }
页面错误:
import 'package:flutter/material.dart'; class UserLoader extends StatefulWidget { @override _UserLoaderState createState() => new _UserLoaderState(); } class _UserLoaderState extends State<UserLoader> { @override Widget build(BuildContext context) { final _formKey = new GlobalKey<FormState>(); final _emailController = new TextEditingController(); return new Scaffold( appBar: new AppBar( title: new Text("Informations"), actions: <Widget>[ new IconButton( icon: const Icon(Icons.save), onPressed: () { // unrelated stuff happens here }) ], ), body: new Center( child: new SingleChildScrollView( child: new Form( key: _formKey, child: new Column(children: <Widget>[ new ListTile( leading: const Icon(Icons.email), title: new TextFormField( decoration: new InputDecoration( hintText: "Email", ), keyboardType: TextInputType.emailAddress, controller: _emailController, validator: _validateEmail, ), ), ]))), )); }}
任何人都可以帮我找出为什么页面不断重建自己?
我通过简单地更改类来解决问题:import 'package:flutter/material.dart'; class UserLoader extends StatefulWidget { @override _UserLoaderState createState() => new _UserLoaderState(); } class _UserLoaderState extends State<UserLoader> { Widget _form; // Save the form @override Widget build(BuildContext context) { if (_form == null) { // Create the form if it does not exist _form = _createForm(context); // Build the form } return _form; // Show the form in the application } Widget _createForm(BuildContext context) { // This is the exact content of the build method in the question final _formKey = new GlobalKey<FormState>(); final _emailController = new TextEditingController(); return new Scaffold( appBar: new AppBar( title: new Text("Informations"), actions: <Widget>[ new IconButton( icon: const Icon(Icons.save), onPressed: () { // unrelated stuff happens here }) ], ), body: new Center( child: new SingleChildScrollView( child: new Form( key: _formKey, child: new Column(children: <Widget>[ new ListTile( leading: const Icon(Icons.email), title: new TextFormField( decoration: new InputDecoration( hintText: "Email", ), keyboardType: TextInputType.emailAddress, controller: _emailController, validator: _validateEmail, ), ), ]))), )); } } }
希望有一天这可能会帮助别人.