Numeric Button Matrix in SLS

What do you want to achieve?

I want a simple numeric button matrix like this in SLS.

What have you tried so far?

I have tried this. But need only few options like above.

I can also see USER modes of Keyboard. Can it help? If yes, how to use it.


  • SquareLine Studio version:
  • Operating system:
  • Target hardware:


Using a USER mode is a good idea. You can customize the keyboard layout from code (after calling ui_init()).
See Keyboard (lv_keyboard) — LVGL documentation

1 Like

Its working fine now. I used this

/*Create a keyboard map*/
static const char * kb_map[] = {"1", "2", "3", "\n", "4", "5", "6", "\n", "7", "8", "9", "\n", LV_SYMBOL_BACKSPACE, "0", LV_SYMBOL_OK, NULL };

/*Set the relative width of the buttons and other controls*/
static const lv_btnmatrix_ctrl_t kb_ctrl[] = {20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20};

lv_keyboard_set_map(ui_keyboard, LV_KEYBOARD_MODE_USER_1, kb_map, kb_ctrl);

Well it would be good if this functionality can be added in SLS too.

1 Like

Hello @kisvegabor,
There is a bug with the keyboard touch. The keyboard can take unwanted inputs if the any of the button is just touched. Rather it should only take the input after the touch is released. See the video here

Keshav Aggarwal

You can control it with LV_BTNMATRIX_CTRL_CLICK_TRIG control flag.