Как установить размер CircularProgressIndicator?
Я пытаюсь сделать экран загрузки для своего приложения, я использую виджет CircularProgressIndicator
, но я хочу знать, есть ли способ увеличить его по высоте и ширине, он слишком мал.
Так может кто-нибудь мне помочь?
Я буду благодарен за любые отзывы.
Ответы
Ответ 1
Вы можете обернуть свой CircularProgressIndicator
внутри виджета SizedBox
@override
Widget build(BuildContext context) {
return Container(
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(
child: CircularProgressIndicator(),
height: 200.0,
width: 200.0,
),
SizedBox(
child: CircularProgressIndicator(),
height: 50.0,
width: 50.0,
),
SizedBox(
child: CircularProgressIndicator(),
height: 10.0,
width: 10.0,
)
],
),
),
);
Ответ 2
Вы можете лучше контролировать размер индикатора, если обернет его виджетом Column
. Это не больно, но выполняет свою работу. В моем случае использовался небольшой индикатор загрузки внутри кнопки.
Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Center(
child: Container(
height: 20,
width: 20,
margin: EdgeInsets.all(5),
child: CircularProgressIndicator(
strokeWidth: 2.0,
valueColor : AlwaysStoppedAnimation(Colors.white),
),
),
),
],
);
Ответ 3
Это может быть полезно
Container(
width: 50.0,
height: 20.0,
child: (CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(
Colors.green,
),
backgroundColor: Colors.red,
value: 0.2,
))),
Ответ 4
bool isLoading = false;
Widget build(BuildContext context) {
return isLoading
? _loadingIndicator()
: FlatButton.icon(
icon: Icon(Icons.arrow_forward),
label: Text('Go to'),
onPressed: () async {
setState(() => isLoading = true);
// Async code ---> Then
setState(() => isLoading = false);
},
);
}
Widget _loadingIndicator() {
return Padding(
padding: EdgeInsets.symmetric(vertical: 12.0),
child: SizedBox(
child: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Colors.blue),
strokeWidth: 3.0,
),
height: 25.0,
width: 25.0,
),
) ;
}