我是新手。我需要进度指示器方面的帮助。我的按钮代码带有字符串，我需要通过指示器转换到“ FirstScreen”。这样，当我单击“登录”按钮时，进度指示器将弹出3秒钟，然后消失。
编辑：
我能够达到以下结果：
class LoginScreen extends StatefulWidget {
@override
State createState() => new _LoginScreenState();
}
class _LoginScreenState extends State<LoginScreen> {
String _email = '';
String _password = '';
bool _load = false;
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
backgroundColor: Colors.white,
body: Container(
padding: EdgeInsets.only(top: 150),
child: Column(
children: <Widget>[
Image.asset(
'img/img_login.png',
width: 50,
height: 50,
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 0.0),
child: TextField(
decoration: InputDecoration(
labelText: 'Email',
icon: Padding(
padding: EdgeInsets.only(top: 15.0),
child: Icon(Icons.email),
)),
),
),
SizedBox(
height: 15.0,
),
Padding(
padding:
EdgeInsets.symmetric(horizontal: 20.0, vertical: 0.0),
child: PasswordField(
helperText: 'No more than 8 characters',
labelText: 'Password',
)),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Padding(
padding:
EdgeInsets.only(left: 20.0, right: 5.0, top: 20.0),
child:
FlatButton(
onPressed: ()
{
setState((){
_load = true;
});
},
// GestureDetector(
// onTap: () {
// Navigator.push(
// context,
// MaterialPageRoute(
// builder: (context) => FirstScreen()));
// },
child: Container(
alignment: Alignment.center,
height: 45.0,
decoration: BoxDecoration(
color: Color(0xFF1976D2),
borderRadius: BorderRadius.circular(9.0)),
child: Text('Login',
style: TextStyle(
fontSize: 20.0, color: Colors.white))),
),
),
),
Expanded(
child: Padding(
padding:
EdgeInsets.only(left: 10.0, right: 20.0, top: 20.0),
child: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SecondScreen()));
},
child: Container(
alignment: Alignment.center,
height: 45.0,
decoration: BoxDecoration(
color: Color(0xFFD32F2F),
borderRadius: BorderRadius.circular(9.0)),
child: Text('Register',
style: TextStyle(
fontSize: 17.0, color: Colors.white))),
),
),
)
],
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Padding(
padding: EdgeInsets.only(bottom: 18.0),
child: GestureDetector(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SecondScreen()));
},
child: Text('Forgot password?',
style: TextStyle(
fontSize: 14.0,
color: Colors.black,
fontWeight: FontWeight.bold)),
))
],
))
],
)),
);
}
}
答案 0 :(得分：0)
您可以使用material.dart库
import 'package:flutter/material.dart';
class LoadingDialog extends StatefulWidget{
LoadingDialogState state;
bool isShowing(){
return state!=null&&state.mounted;
}
@override
createState()=> state=LoadingDialogState();
}
class LoadingDialogState extends State<LoadingDialog>{
@override
Widget build(BuildContext context) {
return Align(alignment: Alignment.center,
child: CircularProgressIndicator(valueColor: AlwaysStoppedAnimation(Colors.lightBlue
) ,),);
}
}
添加您的LoadingDialog类
您可以使用showLoadingDialog()和hideDialog()
class LoginScreen extends StatefulWidget {
@override
State createState() => new _LoginScreenState();
}
class _LoginScreenState extends State<LoginScreen> {
String _email = '';
String _password = '';
bool _load = false;
LoadingDialog loadingDialog;
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomPadding: false,
backgroundColor: Colors.white,
body: Container(
padding: EdgeInsets.only(top: 150),
child: Column(
children: <Widget>[
Image.asset(
'img/img_login.png',
width: 50,
height: 50,
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 0.0),
child: TextField(
decoration: InputDecoration(
labelText: 'Email',
icon: Padding(
padding: EdgeInsets.only(top: 15.0),
child: Icon(Icons.email),
)),
),
),
SizedBox(
height: 15.0,
),
/* Padding(
padding:
EdgeInsets.symmetric(horizontal: 20.0, vertical: 0.0),
child: Text(
helperText: 'No more than 8 characters',
labelText: 'Password',
))*/
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Padding(
padding:
EdgeInsets.only(left: 20.0, right: 5.0, top: 20.0),
child:
FlatButton(
onPressed: ()
{
setState((){
showLoadingDialog();
});
},
// GestureDetector(
// onTap: () {
// Navigator.push(
// context,
// MaterialPageRoute(
// builder: (context) => FirstScreen()));
// },
child: Container(
alignment: Alignment.center,
height: 45.0,
decoration: BoxDecoration(
color: Color(0xFF1976D2),
borderRadius: BorderRadius.circular(9.0)),
child: Text('Login',
style: TextStyle(
fontSize: 20.0, color: Colors.white))),
),
),
),
Expanded(
child: Padding(
padding:
EdgeInsets.only(left: 10.0, right: 20.0, top: 20.0),
child: GestureDetector(
onTap: () {
// Navigator.push(context, MaterialPageRoute(builder: (context) => SecondScreen()));
},
child: Container(
alignment: Alignment.center,
height: 45.0,
decoration: BoxDecoration(
color: Color(0xFFD32F2F),
borderRadius: BorderRadius.circular(9.0)),
child: Text('Register',
style: TextStyle(
fontSize: 17.0, color: Colors.white))),
),
),
)
],
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Padding(
padding: EdgeInsets.only(bottom: 18.0),
child: GestureDetector(
onTap: () {
// Navigator.push(context, MaterialPageRoute(builder: (context) => SecondScreen()));
},
child: Text('Forgot password?',
style: TextStyle(
fontSize: 14.0,
color: Colors.black,
fontWeight: FontWeight.bold)),
))
],
))
],
)),
);
}
void showLoadingDialog() async {
await new Future.delayed(new Duration(milliseconds: 30));
await showDialog(
context: context,
barrierDismissible: false,
builder: (BuildContext context) =>
loadingDialog = loadingDialog ?? LoadingDialog());
//builder: (BuildContext context) => WillPopScope(child:loadingDialog = LoadingDialog() , onWillPop: () async => false,));
}
Future hideDialog() {
if (loadingDialog != null && loadingDialog.isShowing()) {
Navigator.of(context).pop();
loadingDialog = null;
}
}
}
答案 1 :(得分：0)
尝试使用进度提示。对我来说有用。这是链接。