Flutter how to reload entire page - flutter

Question

In my application, a user enters data and then it is uploaded to firestore. After this, I would like all the fields to be empty and basically, the entire page reloaded. How do you reload the whole page after an action or button click? I have added the respective stateful classes.
Main Class
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: TestForm(),
),
);
}
}
class TestForm extends StatefulWidget {
#override
_TestFormState createState() => _TestFormState();
}
How to reload this entire form by clicking a button but without going to a new page and being able to go back again.
class _TestFormState extends State<TestForm> {
final _formKey = GlobalKey<FormState>();
File _imageFile;
String locWorking;
Model model = Model();
Future<void> _getLocation() async {
Position position = await Geolocator()
.getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
print(position.toString());
setState(() {
model.location = position.toString();
});
}
Future<void> _pickImage(ImageSource source) async {
File selected = await ImagePicker.pickImage(source: source);
setState(() {
_imageFile = selected;
String fileName = 'images/${DateTime.now()}.png';
model.picName = fileName;
model.picCheck = true;
});
}
#override
Widget build(BuildContext context) {
final halfMediaWidth = MediaQuery.of(context).size.width / 2.0;
model.checkBox = false;
return Scaffold(
appBar: AppBar(
title: Text("Form Demo"),
),
body: Form(
key: _formKey,
child: Column(
children: <Widget>[
Container(
alignment: Alignment.topCenter,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
alignment: Alignment.topCenter,
width: halfMediaWidth,
child: MyTextFormField(
hintText: 'Name',
validator: (String value) {
if (value.isEmpty) {
return 'Enter your first name';
}
return null;
},
onSaved: (String value) {
model.firstName = value;
},
),
),
Container(
alignment: Alignment.topCenter,
width: halfMediaWidth,
child: RaisedButton(
color: Colors.blueAccent,
onPressed: () {
_getLocation();
},
child: Text("Get Location")))
],
),
),
MyTextFormField(
hintText: 'Description',
validator: (String value) {
if (value.isEmpty) {
return 'Please Enter Description';
}
return null;
},
onSaved: (String value) {
model.email = value;
},
),
StatefulBuilder(
builder: (context, setState) => CheckboxListTile(
title: Text("Need urgent repair"),
value: model.checkBox,
onChanged: (bool newValue) {
setState(() {
model.checkBox = newValue;
});
},
controlAffinity:
ListTileControlAffinity.leading, // <-- leading Checkbox
),
),
RaisedButton(
color: Colors.blueAccent,
onPressed: () {
if (_formKey.currentState.validate()) {
print(locWorking);
_formKey.currentState.save();
if (model.location == null) {
print("No location");
setState(() {
model.dataCheck = false;
});
print(model.dataCheck);
showDialog(
context: context,
builder: (context) => AlertDialog(
title: new Text("Error"),
content:
new Text("No location has been picked up"),
actions: <Widget>[
new FlatButton(
onPressed: () {
Navigator.of(context).pop();
},
child: new Text("Close"))
],
));
} else {
print("All checks passed...");
setState(() {
model.dataCheck = true;
});
print(model.dataCheck);
}
if (model.picCheck == false || model.picCheck == null) {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: new Text("Notice"),
content: new Text("No picture has been added..."),
actions: <Widget>[
new FlatButton(
onPressed: () {
setState(() {
model.picCheck = true;
model.picName = "Null";
});
Navigator.of(context).pop();
},
child: new Text("No Picture Needed")),
new FlatButton(
onPressed: () {
Navigator.of(context).pop();
},
child: new Text("Close"))
],
));
}
}
},
child: Text(
'Check Data',
style: TextStyle(
color: Colors.white,
),
),
),
if (_imageFile != null) ...[
Uploader(
file: _imageFile,
fileName: model.picName,
),
],
if (model.dataCheck == true && model.picCheck == true) ...[
DataAdder(model: this.model),
],
],
),
),
bottomNavigationBar: BottomAppBar(
child: Row(
children: <Widget>[
IconButton(
icon: Icon(Icons.photo_camera),
onPressed: () => _pickImage(ImageSource.camera),
),
IconButton(
icon: Icon(Icons.photo_library),
onPressed: () => _pickImage(ImageSource.gallery),
),
],
),
),
);
}
}

Answer 1

Update How to reset the state of the app:
The question wanted to reset the state of the app, not the text field. You can achieve this using the Flutter Phoenix package.
How to reset the TextField input after pressing a button:
setState() rebuilds the build() method in you class every time it's called, but I assume what you mean is you want the text fields to become empty after the user have clicked a button, you could do this by using a TextEditingController.
Declaration:
TextEditingController controller = TextEditingController();
use case:
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
TextField(
controller: controller,
decoration: InputDecoration(
hintText: "Enter your first name",
),
),
RaisedButton(onPressed: () {
controller.clear();
child:
Text(
"Clear",
);
})
],
),
This should clear the TextField each time the button is pressed.