Благословленный "Подсказка" по умолчанию черный на черном - как мне его стилизовать?

Я использую blessed и пытаюсь добавить подсказку в свое приложение. Он отлично работает, но я не могу прочитать его текст. Я подготовил минимальный пример, который иллюстрирует, что я вижу.

Я хотел бы знать, как я могу стилизовать текст на входах. Атрибуты стиля, упомянутые в документах, похоже, не имеют никакого эффекта.

Вот что я вижу (на входе и на двух кнопках есть текст, но он черный на черном).

Вот код, который воспроизводит ошибку на Debian 9 со стандартным терминалом и стандартной темой:

var blessed = require('blessed');
var screen = blessed.screen({});

var prompt = blessed.prompt({
    left: 'center',
    top: 'center',
    height: 'shrink',
    width: 'shrink',
    border: 'line',
});

screen.append(prompt);

screen.key(['q', 'C-c'], function quit() {
    return process.exit(0);
});

screen.render();

prompt.input('Search:', 'test', function() {});
Источник

2 ответа

Решение

Отказ от ответственности: я не очень знаком с blessed кодовая база, так что может быть более естественный способ сделать это. Если нет, то похоже, что эта функция должна быть запрошена / реализована.

Наблюдение 1 - настройки цвета вашего терминала способствуют проблеме

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

Но! Ваше приложение должно быть независимо от настроек пользователя, так что это не хорошее решение...

Наблюдение 2 - Prompt жесткие коды конструктора это дети с черным фоном

Если есть сомнения, перейдите к источнику! Вот часть prompt.js по состоянию на 2017-09-30:

// ...
function Prompt(options) {
  // ...
  Box.call(this, options);

  this._.input = new Textbox({
    // ...
    bg: 'black'
  });

  this._.okay = new Button({
    // ...
    bg: 'black',
    hoverBg: 'blue',
  });

  this._.cancel = new Button({
    // ...
    bg: 'black',
    hoverBg: 'blue',
  });
}
// ...

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

Решение 1. Переписать свойства дочернего стиля после создания

После создания приглашения вы можете перезаписать стиль каждого дочернего элемента. Вероятно, проще всего сделать передний план белым (как и должно быть)...

Кроме того, для удобства обслуживания этот хак действительно должен быть в своей собственной функции.

function createBlessedPrompt(options) {
    var prompt = blessed.prompt(options);

    // NOTE - Not sure if blessed has some sortof `children()` selector.
    //        If not, we probably should create one.
    //        Nevertheless, temporarily hardcoding the children here...
    //
    var promptChildren = [prompt._.input, prompt._.okay, prompt._.cancel];

    promptChildren.forEach(x => {
        Object.assign(x.style, {
            fg: 'white',
            bg: 'black'
        });
    });

    return prompt;
}

Решение 2 - Отправить исправление ошибки в благословенный репозиторий

Это действительно похоже на проблему с блаженством. Если вы можете придумать, как Prompt Если вы должны правильно разобраться с этим делом, вы должны полностью помочь вашему коллеге-программисту и написать запрос на выдачу / устранение неисправности, который исправит это.

Удачи!

Источник

Я попробовал этот пример на Win 10 и Ubuntu 16. Единственное изменение, которое я сделал в вашем коде, это screen определение было перенесено до promt определение (без него я получил ошибку "Нет активного экрана"), а также добавил стили в соответствии с документацией. Мое воспроизведение:

1) запустить npm install blessed внутри пустой папки

2) создать index.js в этой папке со следующим кодом

var blessed = require('blessed');
var screen = blessed.screen({});

var prompt = blessed.prompt({
  left: 'center',
  top: 'center',
  height: 'shrink',
  width: 'shrink',
  border: 'line',
  style: {
    fg: 'blue',
    bg: 'black',
    bold: true,
    border: {
      fg: 'blue',
      bg: 'red'
    }
  }
});

screen.append(prompt);
screen.key(['q', 'C-c'], function quit() {
  return process.exit(0);
});

screen.render();
prompt.input('Search:', 'test', function() {});

3) бегать node index

4) получил

Ты этого хочешь?

Источник
Другие вопросы по тегам