如何在bbc / tal中创建键盘组件

Question

我正在尝试在bbc/tal中创建一个键盘组件，但不幸的是它无效。我在互联网上找不到任何这方面的例子。我希望有人可以帮助我。

以下代码我用来创建组件。

 var myVirtualKeyBoard = new Keyboard("keyboard",10,3,"abcdefghijklmnopqrstuvwxyz",true,true);

 myVirtualKeyBoard.setActiveChildKey('A')
 this.appendChildWidget(myVirtualKeyBoard);

它逐行显示10 * 3按钮，但我无法在显示屏上显示键盘

Answer 1

问题与css样式有关。 我们可以使用以下代码来显示键盘。

Js样本代码

keys = ['SPACE','A','B','C','D','E','F','G','H','I','1','2','3','SPACE','DEL','J','K','L','M','N','O','P','Q','R','4','5','6','DEL',' ','S','T','U','V','W','X','Y','Z',' ','7','8','9','0'];
keyboard = new Keyboard("Keyboard", 14, 3 ,keys, true , true);
keyboard.setActiveChildKey('A');
this.appendChildWidget(keyboard);

的CSS

#testcomponent {
display: table;
width: 100%;
height: 100%;
text-align: center;
}

Keyboard Component
#Keyboard {
display: table-cell;
width: 100%;
height: 100%;
vertical-align: middle;
}

Single Keyboard Style Changed
.keyboardButton {
display: inline-block;
}