Вы можете создать свой цвет материала так:

я есть виджет, который в идеале я хотел бы взять в базовом цвете материала и вывести виджет с тематическими оттенками этого цвета. Например:

return new Container(
  color: Colors.pink.shade50,
  child: new Text(
    'hello',
    style: new TextStyle(
      color: Colors.pink.shade100,
    ),
  ),
);

требует от меня указать оба оттенка розового. В идеале я мог бы сделать что-то вроде:

Color color = getBaseColorForThisPage(); // returns something like Colors.pink, but on another page, it'll return something like Colors.purple
return new Container(
  color: color.shade50,
  child: new Text(
    'hello',
    style: new TextStyle(
      color: color.shade100,
    ),
  ),
);

Есть ли способ вернуть «карту» цветов материалов в цветовую палитру вместо одного цвета? Когда я смотрю на автозаполнение в IntelliJ, я вижу, что после вводаColors.pinkЯ могу указать оттенок. Но если я установлю цвет на переменную, например,Color color = Colors.pinkЯ позже не смогу сделатьcolor.shade100 или жеcolor[100], Спасибо!

Ответы на вопрос(3)

Вот

вы заметите, как создаются некоторые объекты MaterialColor.

Очевидно, у Flutter действительно хорошее представление о MaterialDesign и большинстве описанных цветов.Вот уже определены в основном пакете флаттера "package: flutter / material.dart". Все это будет доступно для использования из коробки, но

Если кто-то все еще хочет создать свой собственный MaterialColor с определенными оттенками, вы можете сделать что-то вроде этого:

MaterialColor myGreen = const MaterialColor(0xFFAAD400,
  const {
    50 : const Color(hex_value1),
    100 : const Color(hex_value2),
    200 : const Color(hex_value3),
    300 : const Color(hex_value4),
    400 : const Color(hex_value5),
    500 : const Color(hex_value6),
    600 : const Color(hex_value7),
    700 : const Color(hex_value8),
    800 : const Color(hex_value9),
    900 : const Color(hex_value10)});

Первый параметр в конструкторе объектов MaterialColor - это HEX-значение вашего цвета по умолчанию, в данном случае 0xFFAAD400. Второй параметр - это карта со всеми образцами вашего цвета. Все значения о "hex_value1" .... "hex_value10" должны быть разных цветов. Чтобы получить представление о том, как выбрать (создать) эти образцы, например, посмотритеВот

Для тех, кто не знает, как читать значения цветов HEX, здесь я опубликую некоторую дополнительную информацию:

Например, чтобы получить полностью непрозрачный оранжевый (0xFFFF9000), вы можете использовать const Color (0xFFFF9000), где:

первые два символа (FF) о альфа (прозрачность),

вторые два символа (FF) для красного,

третьи два символа (90) для зеленого,

и последние два (00) за синий.

Спасибо, надеюсь, это кому-нибудь поможет

Вы можете создать свой цвет материала так:

  0xFF181861,
  <int, Color>{
    50: Color(0xFFA4A4BF),
    100: Color(0xFFA4A4BF),
    200: Color(0xFFA4A4BF),
    300: Color(0xFF9191B3),
    400: Color(0xFF7F7FA6),
    500: Color(0xFF181861),
    600: Color(0xFF6D6D99),
    700: Color(0xFF5B5B8D),
    800: Color(0xFF494980),
    900: Color(0xFF181861),
  },
);
Решение Вопроса

MaterialColor продолжаетсяColorSwatch что-то вродеMap цветов. Вы можете использоватьColorSwatch везде, где вы могли бы использоватьColor и получите 500 оттенков, но вы также можете индексировать его с помощью[].

Чтобы получитьList из всех образцов цвета основного материала используйтеColors.primaries.

 Collin Jackson07 окт. 2017 г., 12:51
Я не уверен, почему вы используетеMap Вот. Вы можете просто сказатьColorSwatch color = Colors.pink; и ты сможешь сказатьcolor[50] потом. Если вы знаете, все образцыMaterialColor, просто используйтеMaterialColor как тип дляcolor.
 Mary09 окт. 2017 г., 18:48
Ах, я подумал, что должен создать экземпляр нового объекта ColorSwatch (который получает карту)! Я не понимал, что могу просто установить объект ColorSwatch на существующий MaterialColor. Благодарю.
 Mary06 окт. 2017 г., 19:43
Нужно ли самому определять карту для ColorSwatch или есть способ ссылки на карту MaterialColor? Пока что это фрагмент кода, который у меня есть (извиняюсь за форматирование), где я должен вручную определить каждый оттенок цвета:var map = new Map<dynamic, Color>(); map.putIfAbsent(50, () => Colors.pink[50]); map.putIfAbsent(100, () => Colors.pink[100]); var colorswatch = new ColorSwatch(500, map); // later setting color: // color: colorswatch[50] Я пытался использовать цвет из Colors.primaries, но они возвращают MaterialColor вместо карты.

Ваш ответ на вопрос