如何在Blessed中的表单之间导航?

时间:2019-03-26 06:47:09

标签: javascript node.js blessed

我已经使用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();

目前我可以用鼠标来做,但是如何用键盘来做呢?

1 个答案:

答案 0 :(得分: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();
});