关闭时保存页面的状态

Question

我有三页。第三个页面获取文本输入并将其传递给第二个页面的文本小部件。当第二个页面关闭并再次打开时，先前的数据将丢失。即使页面关闭，我也要保存数据。

import 'package:flutter/cupertino.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: MyHomePage(title: 'Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You are welcome',style: (TextStyle(fontWeight: FontWeight.bold, fontSize: 15,color: Colors.black)),
),
RaisedButton.icon(
label: Text("Go to second page",style: (TextStyle(fontWeight: FontWeight.bold, fontSize: 18,color: Colors.white)),),
icon: Icon(Icons.pages),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => SecondPage()),
);
},
color: Colors.red,
),
],
),
),
);
}
}
class SecondPage extends StatefulWidget {
@override
_SecondPageState createState() => _SecondPageState();
}
class _SecondPageState extends State<SecondPage> {
String _information = 'No Information Yet';
void updateInformation(String information) {
setState(() => _information = information);
}
void moveToSecondPage() async {
final information = await Navigator.push(
context,
CupertinoPageRoute(
fullscreenDialog: true, builder: (context) => ThirdPage()),
);
updateInformation(information);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Second Page"),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
_information,style: (TextStyle(fontWeight: FontWeight.bold, fontSize: 15,color: Colors.black))
),
SizedBox(
height: 8.0,
),
RaisedButton(
color: Colors.purple,
child: Text(
'Get Information',
style: TextStyle(color: Colors.white),
),
onPressed: () {
moveToSecondPage();
},
)
],
),
),
);
}
}

class ThirdPage extends StatelessWidget {
final TextEditingController textController = new TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
autofocus: true,
style: TextStyle(fontSize: 20.0),
controller: textController,
),
),
SizedBox(
height: 8.0,
),
RaisedButton(
child: Text(
'Submit',
style: TextStyle(color: Colors.white),
),
color: Colors.blue,
onPressed: () {
Navigator.pop(context, textController.text);
},
)
],
)),
);
}
}

Answer 1

您的问题已经被问了好几次了。答案取决于你。这是一个国家管理问题。这是一个非常大的领域，你需要了解并选择一种状态管理解决方案，然后将其应用于你的应用程序。

但是，您可以使用包装类、映射和全局变量在页面之间传递状态。这是不推荐的，并且会随着应用程序的增长而导致问题。下面是一个使用包装类在页面之间传递字符串值的解决方案。

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class InformationWrapper {
String data = 'No Information Yet';
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
InformationWrapper _information = InformationWrapper();
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'You are welcome',
style: (TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: Colors.black)),
),
RaisedButton.icon(
label: Text(
"Go to second page",
style: (TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18,
color: Colors.white)),
),
icon: Icon(Icons.pages),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SecondPage(
information: widget._information,
)),
);
},
color: Colors.red,
),
],
),
),
);
}
}
class SecondPage extends StatefulWidget {
final InformationWrapper information;
const SecondPage({Key key, this.information}) : super(key: key);
@override
_SecondPageState createState() => _SecondPageState();
}
class _SecondPageState extends State<SecondPage> {
void updateInformation(String information) {
setState(() => widget.information.data = information);
}
void moveToSecondPage() async {
final information = await Navigator.push(
context,
CupertinoPageRoute(
fullscreenDialog: true, builder: (context) => ThirdPage()),
);
updateInformation(information);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Second Page"),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(widget.information.data,
style: (TextStyle(
fontWeight: FontWeight.bold,
fontSize: 15,
color: Colors.black))),
SizedBox(
height: 8.0,
),
RaisedButton(
color: Colors.purple,
child: Text(
'Get Information',
style: TextStyle(color: Colors.white),
),
onPressed: () {
moveToSecondPage();
},
)
],
),
),
);
}
}
class ThirdPage extends StatelessWidget {
final TextEditingController textController = new TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: TextField(
autofocus: true,
style: TextStyle(fontSize: 20.0),
controller: textController,
),
),
SizedBox(
height: 8.0,
),
RaisedButton(
child: Text(
'Submit',
style: TextStyle(color: Colors.white),
),
color: Colors.blue,
onPressed: () {
Navigator.pop(context, textController.text);
},
)
],
)),
);
}
}

Answer 2

在多个小部件调用之间保持变量值

创建模型

在这种情况下，您可以创建一个不同的类(模型(具有(静态(信息字符串，然后在第二页中导入它。这样，在整个项目中只有一个实例。

通过使字符串为静态，您可以在不创建实例对象的情况下访问它。

class Information extends ChangeNotifier {
static String _information = 'Default Value';
get information {
// Any aditional functionality
return _information;
}
set setInformation (String value) {
// Any additional functinality
_information = value;
notifyListeners();
}
}

使用模型

您必须使用更改通知程序提供程序来提供此信息。

您必须包装想要使用内部信息的小部件消费者小部件。cick她了解更多信息单击此处了解有关状态管理的更多信息

您可以使用getter和setter，就好像它们只是类的成员一样

你可以通过写来访问信息

信息信息；

并通过写入设置信息

Information.setInfromation="新信息"；

我希望这会有所帮助。