使用循环进度指示器时,我一直在底部溢出。我尝试遵循this,但似乎不起作用。
正在发生的事情的图像:
因此,发生的事情是当按下按钮时,它会显示加载符号并缩小(动画)到上面的大小。现在,当我使用大屏幕模拟器(像素为2xl)但屏幕模拟器较小时,看到底部溢出时,它可以完美工作。
这是我的代码:
// Button
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: blue,
body:
SingleChildScrollView(
child: Center(
child:Stack(
children: <Widget>[
Align(
alignment: Alignment.center,
child: Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
"assets/images/FlightBackground.jpg",
),
fit: BoxFit.fitHeight,
),
)
),
),
Align(
alignment: Alignment.center,
child: Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
decoration:BoxDecoration(color: blueTrans),),
),
Align(
alignment:Alignment.center,
child: Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width/1.2,
child: Column(
children: <Widget>[
// omitted code ----- the button starts here
Expanded(
flex:2,
child: Container(
width: _submitWidth,
child: PhysicalModel (
color: _submitModelColor,
borderRadius: BorderRadius.circular(10.0),
child: RaisedButton(
color: _submitButtonColor,
key: _submitKey,
shape: OutlineInputBorder(borderSide:BorderSide(color: _submitOutlineColor),borderRadius: BorderRadius.circular(10.0)),
child: _submitButton(),
onPressed: (){
setState(() {
if(_submitState == 0 && (_validate())) {
_animateButton();
}
});
},
),
)
),
),
]
),
),
),
],
)
)
)
);
}
// What the button is with respect to _submitState
Widget _submitButton(){
if (_submitState == 0) {
return AutoSizeText(FLIGHT_PAGE_SUBMIT,style: TextStyle(color: _submitTextColor,));
} else if (_submitState == 1) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(
child: Center(
child:CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(white),
),
)
)
],
)
);
} // omitted code
}
更新:我尝试过仅返回中心
else if (_submitState == 1) {
return Center(
child:CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(white),
),
);
}
没有溢出,但是进度指示器仍超出按钮空间:
更新:最终成功
else if (_submitState == 1) {
return Center(
child:SizedBox(
width:MediaQuery.of(context).size.width/13,
height:MediaQuery.of(context).size.height/30,
child:CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(white),
)
)
);
}