Как изменить цвет CircularProgressIndicator

Как я могу изменить цвет CircularProgressIndicator?

Значение цвета является экземпляром Animation<Color>, но я надеюсь, что есть более простой способ изменить цвет без проблем с анимацией.

Ответ 1

Это сработало для меня:

valueColor: new AlwaysStoppedAnimation<Color>(Colors.blue),

Ответ 2

Вы можете добавить этот код.

  CircularProgressIndicator(
     valueColor: new AlwaysStoppedAnimation<Color>(Colors.white),
  ),

Ответ 3

accentColor может быть использован для цвета переднего плана из Widgets.It меняет цвет переднего плана, в том числе виджеты circularprogressbar Вы можете использовать, как это:

void main() => runApp(
  MaterialApp(
    title: 'Demo App',
    home: MainClass(),
    theme: ThemeData(accentColor: Colors.black),
  ),
);

Ответ 4

Тема - это виджет, который вы можете вставить в любое место в своем дереве виджетов. Переопределяет текущую тему с пользовательскими значениями Попробуйте это:

new Theme(
      data: Theme.of(context).copyWith(accentColor: Colors.yellow),
      child: new CircularProgressIndicator(),
    );

ссылка: https://gitter.im/flutter/flutter?at=5a84cf9218f388e626a51c2d

Ответ 5

В main.dart установите тему accentColor, CircularProgressIndicator будет использовать этот цвет

void main() => runApp(new MaterialApp(
  theme: ThemeData(primaryColor: Colors.red, **accentColor:  Colors.yellowAccent**),
  debugShowCheckedModeBanner: false,
  home: SplashPage()
));

Ответ 6

Это работа для меня очень хорошо.

Container(
            child: Center(
              child: CircularProgressIndicator(
                valueColor: AlwaysStoppedAnimation<Color>(appColor),
              ),
            ),
          )

Ответ 7

если вы хотите изменить все цвета приложения CircularProgressIndicator

return MaterialApp(
  title: appTitle,
  debugShowCheckedModeBanner: false,


  routes: <String, WidgetBuilder>{
    '/walkthrough': (BuildContext context) => new WalkthroughScreen(),
    '/root': (BuildContext context) => new WelcomeScreen(),
    '/signin': (BuildContext context) => new SignInScreen(),
    '/moreinfo': (BuildContext context) => new MoreInfoAbout(),
    '/main': (BuildContext context) => new MainScreen(),
    '/mybisiness': (BuildContext context) => new MyBusiness(),

  },
  theme: ThemeData(
    brightness: Brightness.light,
    primaryColor: ColorsAll.PrimaryColor,
    accentColor: ColorsAll.PrimaryAssentColor,
  ),
  home: _handleCurrentScreen(),
);

Ответ 8

По умолчанию он наследует accentColor от Themedata

  void main() => runApp(new MaterialApp(
  theme: ThemeData(
                 primaryColor: Colors.blue,
                 accentColor:  Colors.blueAccent,
                 //This will be the color for CircularProgressIndicator color
               ),
  home: Homepage()
    ));

Вы можете изменить это свойство accentColor с помощью нового цвета. Другой способ - использовать с предопределенными ThemeData, как это

void main() => runApp(new MaterialApp(
  theme: ThemeData.light().copyWith(
                 accentColor:  Colors.blueAccent,
                 //change the color for CircularProgressIndicator color here
               ),
  home: Homepage()
    ));

Или вы можете напрямую изменить это свойство цвета в CircularProgressIndicator, как показано ниже

CircularProgressIndicator(
         valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
                    ),