Цвета темы Материал Дизайн против углового материала - PullRequest
0 голосов
/ 25 сентября 2018

Если я ссылаюсь на руководящие указания по проектированию материалов о Цветах , они определяют:

  1. Первичный
  2. Первичный вариант
  3. Вторичный
  4. Вторичный вариант
  5. Фон
  6. Поверхность
  7. Ошибка

Угловой материал определяют

  1. Первичный
  2. Secondary
  3. Warn

Кроме того, контрастный цвет в угловом эквиваленте соответствует On * в MDC.

1> In Angular Material backgroundи поверхность устанавливаются на белый или черный в зависимости от функции построителя темы.Нет доступа для пользовательских.

[править] (спасибо @G. Tranter): пользовательский цвет фона здесь

2> В Angular Material я могу определить более светлый и темный вариант каждого из 3 цветов, но я не могу контролировать, где эти варианты используются!(если я не перезаписываю каждый мат- * класс ...)

Я могу создать свою тему с двумя цветами (основной и акцент).Но у меня нет смысла определять варианты, если я не могу назначить варианты конкретным элементам пользовательского интерфейса.

[править] (спасибо @G. Tranter): In AngularМатериал Использование вариантов определяется самим компонентом.

Если я ссылаюсь на примеры проектирования материалов (та же страница, на которую ссылается выше), я не могу воспроизвести тему с первичным, первичным вариантом и вторичным, например..

я что-то пропустил?или кто-то может рассказать мне об этих двух основных ограничениях в теме?

[edit] (спасибо @G. Tranter): В Angular Material мы можем определить вторую тему (с основными цветами и цветами Accent), которые будут применены к определенному классу CSS

.item-second-theme {
  @include angular-material-theme($second-theme);
}

1 Ответ

0 голосов
/ 25 сентября 2018

На самом деле ни одно из ограничений не является (по крайней мере, полностью).

Вы можете настроить передний план и фон, изменив тему, прежде чем применять ее к своему приложению и к угловому материалу. Смотрите это сообщение .Однако, вероятно, не очень хорошая идея с точки зрения Материального Дизайна использовать палитры фона и переднего плана, которые не следуют рекомендациям, поэтому обычно нет причин не использовать стандартные в Angular Material.

Вы не можете контролировать, как компоненты Angular Material используют варианты - это является частью дизайна самих компонентов.Но вы можете контролировать, что это за варианты, когда создаете свои палитры.Например:

$primary-palette: mat-palette($mat-blue, 500, 100, 700); // default

или

$primary-palette: mat-palette($mat-blue, 700, 300, 900); // darker

И, конечно, вы имеете полный контроль над своими компонентами в отношении того, как используются оттенки.

...