我有一个表格;-3\f25 text form field -3\f6下拉列表。普通文本*-2\f25 text form -2\f6字段
根据下拉列表( Yes /No)示例;如果部分为Yes,则从internet获取值并分配给普通文本,然后继续显示最后两个文本表单字段。
我的问题是,当我在表单中间从互联网获取数据时,如何使用CircularProgressIndicator()。我知道如何使用CircularProgressIndicator()和show widget,但是我可以让它在表单中间做同样的事情。如何使用表单中间的CircularProgressIndicator()并继续…
发布于 2018-12-25 15:06:42
完整的代码在这里。为了清楚起见,我使用Future.delayed来演示我是如何做到这一点的。我们可以使用Future ....() async {}从互联网获取数据,因此很容易将无效的_showPrint()替换为Future _getDataFromInternet() async {._load =假;_buildRest =真;}
class _MyHomePageState extends State<MyHomePage> {
bool _load = false;
bool _buildRest = false;
void _showPrint() {
print("loading is true");
Future.delayed(const Duration(seconds: 6), () {
setState(() {
_load = false;
_buildRest = true;
});
});
}
//TODO: MAIN BUILD WIDGET *****************************
@override
Widget build(BuildContext context) {
Widget loadingIndicator = _load
? new Container(
color: Colors.green.withOpacity(0.3),
width: MediaQuery.of(context).size.width,//70.0,
height: MediaQuery.of(context).size.height, //70.0,
child: new Padding(
padding: const EdgeInsets.all(5.0),
child: new Center(child: new CircularProgressIndicator())),
)
: new Container();
return new Scaffold(
backgroundColor: Colors.white,
body: new Stack(
children: <Widget>[
new Padding(
padding:
const EdgeInsets.symmetric(vertical: 50.0, horizontal: 20.0),
child: new ListView(
children: <Widget>[
new Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new TextField(),
new TextField(),
new TextField(),
new TextField(),
new Padding(
padding: EdgeInsets.only(top:20.0),
child: new FlatButton(
color: Colors.green[400],
child: new Text('Get Data From Internet'),
onPressed: () {
setState(() {
_load = true;
});
_showPrint();
}),
),
_buildRest == true
? _buildRestoftheForm()
: new Container()
],),],),
),
new Align(
child: loadingIndicator,
alignment: FractionalOffset.center,
),
],
));
}
Widget _buildRestoftheForm(){
return new Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new TextField(),
new TextField(),
new TextField(),
],
);
}
}发布于 2018-12-27 01:10:43
我没有完全理解您是否希望用户在检索数据时能够触摸表单。如果没有,那么我建议使用modal progress hud package。你将会实现和Nick提供的一样的东西,但是更少的努力。
https://stackoverflow.com/questions/53912062
复制相似问题