Con la llegada de dispositivos táctiles es interesante probar nuevas formas de entrada de datos para este tipo de interacción. La mayor parte de dispositivos táctiles que existen en el mercado son móviles y tables. Estos dispositivos ya incluyen un teclado virtual en el propio sistema operativo por lo que no es necesario programar uno propio para que el usuario pueda introducir datos.
Sin embargo, puede que nos surja la necesidad de que nuestra aplicación visualice un teclado virtual. Un ejemplo son los TPVs táctiles de venta al público que se pueden ver en comercios. En otras ocasiones, nos gustaría que el teclado virtual no visualice toda la gama de teclas, sino solo la parte numérica o que el teclado esté adaptado a nuestras necesidades, evitando utilizar el estandar del sistema operativo del terminal.
En esta ocasión me gustaría comentar jQuery Keypad, un widget que nos permitirá visualizar un teclado virtual creado con Javascript preparado para utilizarse junto con jQuery. Esta librería permite visualizar teclados alfanuméricos (con carácteres de diferentes idiomas) y teclados numéricos para la introducción cifras. Igualmente los literales de los botones pueden visualizarse en diferentes idiomas.
Dispone de algunas características interesantes como permitir modificar el teclado visualizando únicamente los caracteres que nos interese. También es posible hacer que se visualice el teclado al poner el foco en un campo de texto, al hacer clic en un boton o imagen o se puede dejar siempre visible dentro del formulario.
También se permite ejecutar código javascript al realizar eventos sobre el teclado como pulsar una tecla o abrir el teclado. Finalmente, es posible visualizar los teclados con diferentes estilos. Para ello, se permite configurar el nombre de los class de los componentes visuales para modificarlo mediante css y así adaptarlo más fácil al diseño de nuestro portal.
La versión actual se encuentra disponible bajo las licencias GPL y MIT. En la web del autor se pueden probar unas demos que incluyen el código fuente ejemplo necesario. En general, una librería interesante para darle un vistazo.
Vía | Keith-Wook