默认情况下,祝福的“提示”是黑色黑色 - 我该如何设计它?

时间:2017-09-14 09:30:20

标签: javascript blessed

我正在使用blessed,我正在尝试向我的应用添加提示。它工作正常,但我无法阅读其文本。我准备了一个最小的例子,说明了我所看到的。

我想知道如何在输入中设置文本样式。 style-Attributes as mentioned in the docs似乎无效。

这是我看到的内容(输入和两个按钮上有文字,但黑色是黑色)。

enter image description here

这是使用标准终端和标准主题在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 个答案:

答案 0 :(得分:1)

我在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)得到了

enter image description here

这是否想要你想要的?

答案 1 :(得分:1)

免责声明:我对blessed代码库不太熟悉,因此可能有一种更原生的方式来执行此操作。如果没有,那么听起来应该请求/实现此功能。

观察1 - 终端的颜色设置导致了问题

根据您提供的屏幕截图,您的终端的默认颜色在白色背景下具有黑色前景。如果在终端设置中将其反转,则应该能够看到预期的行为。

但是!无论用户的设置是什么,您的应用都应该是,所以这不是一个好的解决方案......

观察2 - Prompt构造函数对其具有黑色背景的子项进行硬编码

如有疑问,请转至the source!以下是截至2017-09-30的prompt.js的一部分:

// ...
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 ​​ - 创建后覆盖子样式属性

创建提示后,您可以覆盖每个孩子的样式。将前景变为白色(应该是这样)可能是最直接的......

另外,出于可维护性的考虑,这个hack确实应该属于它自己的功能。

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应该正确处理这种情况的方式,那么你应该完全帮助你的编码员并写一个解决这个问题的问题/拉取请求。

祝你好运!