Tuesday, 8 September 2020

adding arrow keys to ngx-material-keyboard

I am using ngx-material-keyboard/core and I have a requirement to add arrow keys like so, to the right of the standard keyboard:

enter image description here

I was looking through the docs here: https://github.com/joskwanten/core#providing-custom-layouts

and its not clear to me how to achieve this. this is what I tried so far:

export const customTextKeyPadLayouts: IKeyboardLayouts = {
...keyboardLayouts,
'Notes Layout': {
  name: 'Protocol Notes layout',
  keys: [
    [['`'], ['1'], ['2'], ['3'], ['4'], ['5'], ['6'], ['7'], ['8'], ['9'], ['0'], [KeyboardClassKey.Bksp], [''], ['^']],
    [['Q'], ['W'], ['E'], ['R'], ['T'], ['Y'], ['U'], ['I'], ['O'], ['P'], ['['], [']'], ['\'']],
    [['A'], ['S'], ['D'], ['F'], ['H'], ['J'], ['K'], ['L'], [';'], [',']],
    [['Z'], ['X'], ['C'], ['V'], ['B'], ['N'], ['M'], [','], ['.']],
    [[KeyboardClassKey.Space]]
  ],
  lang: ['protocol-notes-text']
},
};```

in the first row of the keys array you can see that I added: , [''], ['^']],

in an attempt to mock the up arrow, but obviously that doesn't lead the desired behavior of moving the cursor up, but instead inserts a caret (^). is there any way to add an arrow control field with the default layouts?

the KeyboardClassKey referenced above only has limited characters, no arrows are available.



from adding arrow keys to ngx-material-keyboard

No comments:

Post a Comment