Почему primaryColorDark легче, чем primaryColor? - PullRequest
1 голос
/ 15 апреля 2020

Я добавил пользовательский primarySwatch и заметил, что это происходит. Я поделился ссылкой на снимок экрана с цветами, которые я получаю из Theme.of (context), и primaryColorDark явно светлее, чем primaryColor, что явно не соответствует этой цели. Может кто-нибудь предложить мне решение?

Кроме того, есть ли способ вручную установить primaryColor, primaryColorDark, highlightColor et c для Theme.of (context)?

Мой файл main.dart:

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations(
    [DeviceOrientation.portraitUp],
  );

  runApp(MyApp());
}

class MyApp extends StatelessWidget {

  static const Map<int, Color> color =
  {
    50: Color.fromRGBO(44,108,176, .1),
    100: Color.fromRGBO(44,108,176, .2),
    200: Color.fromRGBO(44,108,176, .3),
    300: Color.fromRGBO(44,108,176, .4),
    400: Color.fromRGBO(44,108,176, .5),
    500: Color.fromRGBO(44,108,176, .6),
    600: Color.fromRGBO(44,108,176, .7),
    700: Color.fromRGBO(44,108,176, .8),
    800: Color.fromRGBO(44,108,176, .9),
    900: Color.fromRGBO(44,108,176, 1),
  };

  final MaterialColor themeColor = MaterialColor(0xff2C6CB0, color);

  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(
          create: (_) => AuthProvider(),
        ),
      child: MaterialApp(
        title: 'Flutter App',
        theme: ThemeData(
          primarySwatch: themeColor,
        ),
        routes: {
          ServicesScreen.routeName: (ctx) => ServicesScreen(),
        },
        home: SplashScreen(),
      ),
    );
  }
}

Мой ServicesScreen ():

class ServicesScreen extends StatelessWidget {
  static const routeName = '/services-screen';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: const Text('My Services'),
      ),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Container(
            height: 50,
            color: Theme.of(context).primaryColorLight,
            child: Text('Primary Light'),
          ),
          Container(
            height: 50,
            color: Theme.of(context).primaryColor,
            child: Text('Primary'),
          ),
          Container(
            height: 50,
            color: Theme.of(context).primaryColorDark,
            child: Text('Primary Dark'),
          ),
          Container(
            height: 50,
            color: Theme.of(context).accentColor,
            child: Text('Accent'),
          ),
          Container(
            height: 50,
            color: Theme.of(context).highlightColor,
            child: Text('Highlight'),
          ),
          Container(
            height: 50,
            color: Theme.of(context).backgroundColor,
            child: Text('Background'),
          ),
        ],
      ),
    );
  }
}

Ссылка на вывод, который я получаю

1 Ответ

1 голос
/ 15 апреля 2020

Во-первых, есть способ установить цвета primaryColor и primaryDarkColor внутри темы следующим образом:

  static Color lightPrimary = //This is color;
  static Color darkPrimary = //This is color;
  static Color lightAccent = //This is color;
  static Color darkAccent = //This is color;
  static Color lightBG = //This is color;
  static Color darkBG = //This is color;
  static Color badgeColor = //This is color;

  static ThemeData appTheme = ThemeData(
    backgroundColor: lightBG,
    primaryColor: lightPrimary,
    accentColor: lightAccent,
    cursorColor: lightAccent,
    scaffoldBackgroundColor: lightBG,
    buttonColor: lightBG);

Затем в вашем MaterialApp установите тему на эту: theme: appTheme,

, и вы можете использовать все цвета, используя Theme.of(context).//exampleColor

. Я бы порекомендовал вам перейти к этому параметру, поскольку возможно, что ваша основная ошибка связана с разрешением образца выбирать между цветами, которые вы дали, и он не различает оттенки.

...