I am trying to add a progress dialog when tapping on my button.
Below is my code:
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: Center(child: Text('Login')),
backgroundColor: const Color(0xff2e80e4)
),
body: SingleChildScrollView(
child: Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 60.0),
child: Center(
child: Container(
width: 200,
height: 150,
child: Image.asset('assets/logo.jpg'),
),
),
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 15),
child: TextField(
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Username',
hintText: 'Please enter your username'
),
),
),
Padding(
padding: const EdgeInsets.only(left: 15.0, right: 15.0, top: 15.0, bottom: 0),
child: TextField(
obscureText: true,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Password',
hintText: 'Please enter your password'
),
),
),
TextButton(
onPressed: () async{
await Navigator.pushNamed(context, '/forget_password');
},
child: Text(
'Forget Password',
style: TextStyle(color: const Color(0xff2e80e4), fontSize: 15.0),
),
),
Container(
height: 50.0,
width: 250.0,
decoration: BoxDecoration(
color: const Color(0xff2e80e4),
borderRadius: BorderRadius.circular(20.0)
),
child: TextButton(
onPressed: () async{
//here I need to start the progress dialog
http.Response response = await postRequest();
Map<String, dynamic> parsedData = jsonDecode(response.body);
LoginResponse loginResponse = LoginResponse.fromJson(parsedData);
if(loginResponse.verificationStatus)
{
await Navigator.pushNamed(context, '/home');
}
//Here I need to stop the progress dialog
},
child: Text(
'Login',
style: TextStyle(color: Colors.white, fontSize: 25.0),
),
),
),
SizedBox(height: 100.0),
TextButton(
onPressed: () async{
await Navigator.pushNamed(context, '/sign_up');
},
child: Text(
'New User? Create Account',
style: TextStyle(color: const Color(0xff2e80e4), fontSize: 15.0),
),
)
],
),
),
);
}
I like to start the progress dialog when I tap on the login button and stop it after loading home page. Is it possible to use flutter_spinkit
for this? I tried, but no progres, I am very new to flutter!
2
Answers
You can manage it using state as updating state rerender your widget and show content according to your condition . Kindly find below updated code and let us know if something is missed over here
Note :- I am assuming over here that your widget is extending
StatefulWidget
notStatelessWidget
as you addedbuild
method onlyAs you mentioned that you are beginner , I would like to suggest to go through State management in flutter as it will help you to do many things
https://docs.flutter.dev/ui/interactive
Answering your question in the answer above (Don’t have reputation to comment):
You can use Stack Widget to stack children widgets on top of one another. Return Sizebox.shrink() for an empty widget.