1

我已经使用 NodeJS 中的祝福包为终端 UI 应用程序编写了代码，该包包含 2 个表单，比如 form1 和 form2，每个表单中都有一些小部件，如列表和复选框。那么如何使用键盘在表单之间导航呢？

var blessed = require('blessed');

// Create a screen object.
var screen = blessed.screen({
  smartCSR: true
});
screen.title = 'my window title';
var parentform = blessed.form({
  parent: screen,
  keys: true,
  left: 0,
  top: 2,
  width: 80,
  height: 50,
  // bg: 'green',
  content: '',
  border:{
    type:'line'
  },
  style:{
    border:{
      fg:'green',
      bg:'green'
    }
  }
});

var list = blessed.List({
  top:2,
  left:'center',
  parent:parentform,
  height:8,
  width:20,
  mouse:true,
  keys:true,
  items:["abc","xyz","123","456"],
  border:{
    type:'line'
  },
  style:{
    selected:{
      bg:'blue',
      fg:'white'
    },
    item:{
      bg:'white',
      fg:'blue'
    },
    // focus:{
    //   bg:'red'
    // }
  }
});

var parentform_cb1 = blessed.Checkbox({
  parent: parentform,
  top:12,
  left:10,
  content:"cb1",
  height:1,
  width:12,
  // bg:'white',
  mouse:true
});

var parentform_cb2 = blessed.Checkbox({
  parent: parentform,
  top:14,
  left:10,
  content:"cb2",
  height:1,
  width:12,
  // bg:'white',
  mouse:true
});

var parentform_cb3 = blessed.Checkbox({
  parent: parentform,
  top:16,
  left:10,
  content:"cb3",
  height:1,
  width:12,
  // bg:'white',
  mouse:true
});

var parentform_cb4 = blessed.Checkbox({
  parent: parentform,
  top:18,
  left:10,
  content:"cb4",
  height:1,
  width:12,
  // bg:'white',
  mouse:true
});

var parentform_cb5 = blessed.Checkbox({
  parent: parentform,
  top:20,
  left:10,
  content:"cb5",
  height:1,
  width:12,
  // bg:'white',
  mouse:true
});

var form2 = blessed.form({
  parent: screen,
  keys: true,
  left: 90,
  top: 2,
  width: 80,
  height: 50,
  content: '',
  mouse:true,
  scrollable:true,
  scrollbar: {
      style: {
        bg: 'blue'
      },
    },
  border:{
    type:'line'
  },
  style:{
    border:{
      fg:'green',
      bg:'green'
    }
  }
});

var form2_cb1 = blessed.Checkbox({
  parent: form2,
  top:4,
  left:4,
  content:"form2 cb2",
  height:1,
  width:18,
  mouse:true
});

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

list.focus();

screen.render();

目前我可以用鼠标来做，但我怎么能用键盘做呢？

4

1 回答 1

0

要在表单之间导航，您只需将一个键事件附加到 form1 的最后一个复选框项和 form2 的复选框项。


parentform_cb5.key(["tab"], function (ch, key) {
  // focuses on form 2 when you press tab
  form2.focusNext();
});

form2_cb1.key(["tab"], function (ch, key) {
  // focuses back on the screen when you press tab
  screen.focusNext();
});
于 2021-07-13T15:23:06.320 回答