• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Guillermo García

  • Podcast
  • Blog
  • Contactar

¿Cómo cambiar el color de CircularProgressIndicator?

21 agosto, 2019 by Guillermo García

Si estamos usando un CircularProgressIndicator en Flutter, por defecto se pintará del color accentColor, definido en el tema de la app. Podemos cambiarlo en el ThemeData que tenga la propiedad «theme» de nuestro MaterialApp:


1
2
3
4
5
MaterialApp(
  theme: ThemeData(
    accentColor: Colors.white
  ),
)

Este color es usado por otros muchos elementos. Si lo queremos no es cambiar este accent color, sino solamente hacer un cambio para un CircularProgressIndicator concreto, podemos usar su propiedad valueColor. Para indicar el valor debemos usar AlwaysStoppedAnimation<Color>(miColor):


1
2
3
CircularProgressIndicator(
  valueColor: AlwaysStoppedAnimation&lt;Color>(Colors.red),
)

¡Ya está, así de fácil!. Normalmente este tipo de cosas son bastante intuitivas y viendo un poco el nombre de las propiedades se puede intuir como configurar los widgets, pero en este caso hay que saber que el valor hay que darlo con un AlwaysStoppedAnimation.

Para cualquier duda ya sabéis que podéis contactar conmigo por si os puedo ayudar en algo.

Filed Under: Tutoriales de Flutter

sidebar

sidebar-alt