Come posso cambiare il colore di CircularProgressIndicator
?
Il valore del colore è un esempio di Animation<Color>
, ma spero che esista un modo più semplice per cambiare il colore senza problemi con l'animazione.
Come posso cambiare il colore di CircularProgressIndicator
?
Il valore del colore è un esempio di Animation<Color>
, ma spero che esista un modo più semplice per cambiare il colore senza problemi con l'animazione.
Risposte:
Questo ha funzionato per me:
valueColor: new AlwaysStoppedAnimation<Color>(Colors.blue),
The argument type 'AlwaysStoppedAnimation<Color>' can't be assigned to the parameter type 'Animation<Color>'
1) Utilizzo della valueColor
proprietà
CircularProgressIndicator(
valueColor: new AlwaysStoppedAnimation<Color>(Colors.blue),
),
2) Imposta accentColor
nel tuo MaterialApp
widget principale .
Questo è il modo migliore perché non vuoi impostare il colore tutto il tempo quando usi il CircularProgressIndicator
widget
MaterialApp(
title: 'My App',
home: MainPAge(),
theme: ThemeData(accentColor: Colors.blue),
),
3) Utilizzo del Theme
widget
Theme(
data: Theme.of(context).copyWith(accentColor: Colors.red),
child: new CircularProgressIndicator(),
)
accentColor
può essere utilizzato per il colore di primo piano dei widget.Cambia il colore di qualsiasi widget di primo piano, incluso circularprogressbar
Puoi usare in questo modo:
void main() => runApp(
MaterialApp(
title: 'Demo App',
home: MainClass(),
theme: ThemeData(accentColor: Colors.black),
),
);
Un tema è un widget che puoi inserire ovunque nell'albero dei widget. Sostituisce il tema corrente con valori personalizzati Prova questo:
new Theme(
data: Theme.of(context).copyWith(accentColor: Colors.yellow),
child: new CircularProgressIndicator(),
);
riferimento: https://gitter.im/flutter/flutter?at=5a84cf9218f388e626a51c2d
Per impostazione predefinita, eredita accentColor da Themedata
void main() => runApp(new MaterialApp(
theme: ThemeData(
primaryColor: Colors.blue,
accentColor: Colors.blueAccent,
//This will be the color for CircularProgressIndicator color
),
home: Homepage()
));
Puoi modificare questa proprietà accentColor con il tuo nuovo colore. Un altro modo è usare con ThemeData predefiniti come questo
void main() => runApp(new MaterialApp(
theme: ThemeData.light().copyWith(
accentColor: Colors.blueAccent,
//change the color for CircularProgressIndicator color here
),
home: Homepage()
));
Oppure puoi modificare direttamente questa proprietà del colore in CircularProgressIndicator come mostrato di seguito
CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
),
Nell'impostare main.dart
il tema accentColor
, CircularProgressIndicator
utilizzerà quel colore
void main() => runApp(new MaterialApp(
theme: ThemeData(primaryColor: Colors.red, **accentColor: Colors.yellowAccent**),
debugShowCheckedModeBanner: false,
home: SplashPage()
));
valueColor: new AlwaysStoppedAnimation (Colors.yellow),