2015-04-12 2 views
8

Я начинаю экспериментировать с угловым материалом (конкретная версия 0.8.3).
Из кода соответствующих директив и исходного кода mdThemingProvider. Я обнаружил, что светлый передний план определен для темной темы. Но текст для текстовых абзацев остается темным, как и по умолчанию.
Даже с их примером кода для Input Demo есть проблема цвета. Когда вы удаляете содержимое title и e-mail текст поля ввода поля ввода становится темно-серым, поэтому он почти невидим.
Я только начинаю смотреть через их исходный код библиотеки и не могу узнать, как активно менять текст для абзацев и заполнителей, чтобы сравнить их.
Кратко глядя на core/services/theming/theme.palette.js файл Я нашел некоторые свойства палитр с префиксом имени контраст. Поэтому я думаю, что они определяют цвета, которые должны быть видны на темной теме. Но как к активной теме использовать их?Как установить цвет фона переднего плана для текста при использовании темной темы?

У кого-нибудь хорошее предложение архивировать читаемый контент на темную тему без большого количества дополнительных кодов?
Если это не сломает динамическую меняющуюся тему всего приложения (через вызов $ mdThemeProvider из js-кода), было бы замечательно.

ответ

10

я столкнулся с этим, как хорошо, и я был в состоянии решить в удовлетворительно в моем случае (Угловая Материал v0.9.6), установив foregroundPalette темы:

myApp.config(function($mdThemingProvider) { 
    $mdThemingProvider.theme('default') 
    .dark() 
    .foregroundPalette['3'] = 'rgba(255,0,0,1)'; 
}) 

Вы можете увидеть демо here и сравните его с the original foreground. Это, похоже, не является публично документированным, поэтому он может быть внутренним для AM и на самом деле он изменит передний план для вашего всего приложения, даже если вы используете несколько тем.

На переднем плане есть четыре оттенка, и они имеют разные значения для светлых темных тем. Вот по умолчанию (от источника AM):

var DARK_FOREGROUND = { 
    name: 'dark', 
    '1': 'rgba(0,0,0,0.87)', 
    '2': 'rgba(0,0,0,0.54)', 
    '3': 'rgba(0,0,0,0.26)', 
    '4': 'rgba(0,0,0,0.12)' 
}; 
var LIGHT_FOREGROUND = { 
    name: 'light', 
    '1': 'rgba(255,255,255,1.0)', 
    '2': 'rgba(255,255,255,0.7)', 
    '3': 'rgba(255,255,255,0.3)', 
    '4': 'rgba(255,255,255,0.12)' 
}; 

А почему я выбрал 3, это случается оттенок используется md-input-container, которые я нашел методом проб и ошибок.

+0

Есть ли способ использовать передний свет с не темной палитрой? мой основной цвет зеленый, и я предпочел бы белый текст сверху вместо темного –

+1

На панели инструментов, например, мой основной цвет зеленый, но я предпочел бы белый текст сверху, а не черный. Тем не менее я хотел бы сохранить черный текст везде, где есть белый фон. Есть ли способ настроить это, не прибегая к css? –

+0

Блестящее разрешение. Большое спасибо. –

Смежные вопросы