DOCUMENTATION PIU Keyboard
Overview
Getting Started
BASE
Reference
Worker
Setup modules
COMMODETTO
Reference
Poco Renderer
Outlines
Creating Fonts
Crypt
Data
DEVICES
Moddable One
Moddable Two
Moddable Three
Moddable Four
Moddable Six
ESP32
ESP8266
nRF52
nRF52 Low Power Notes
Raspberry Pi Pico
M5Core Ink
M5Paper
Wasm
SiLabs Gecko
QCA4020
Moddable Zero
Moddable Display Developer Guide
DISPLAYS
Overview
Adafruit 1.8" ST7735
Adafruit OLED Display
BuyDisplay 2.8" CTP - ESP8266
Crystalfontz ePaper
DotStar
Generic 1.44"
Generic 2.4" & 2.8" (Resistive Touch) - ESP32
Generic 2.4" & 2.8" (Resistive Touch) - ESP8266
Generic 2.4" & 2.8" (Resistive Touch) - Pico
Sharp Memory
Sharp Memory Screen 1.3"
SparkFun TeensyView
Switch Science Reflective LCD
DRIVERS
DESTM32S display
DotStar display
ILI9341 display
LPM013M126A display
LS013B4DN04 display
MCP230XX GPIO expander
NeoStrand
SSD1306 display
SSD1351 display
ST7735 display
Files
IO
TC53 IO
Firmata
NETWORK
Reference
TLS (SecureSocket)
BLE
Ethernet
Web Things
PINS
Reference
Audio Output
PIU
Reference
Localization
Keyboard
Expanding Keyboard
Die Cut
Using After Effects Motion Data
TOOLS
Reference
Manifest
Defines in Manifests
Testing
XS
Handle
JavaScript language considerations on embedded devices using the XS engine
Mods – User Installed Extensions
ROM Colors
Using XS Preload to Optimize Applications
XS Conformance
XS Marshalling
XS Platforms
XS in C
XS linker warnings
xsbug
xst
XS Compartment
XS Profiler
XS Scopes

Keyboard

The Keyboard module implements a touch screen keyboard with a responsive layout for use with Piu.

The keyboard is implemented using a Port object that automatically fills its parent container, allowing it to reflow in a manner controlled by the application. The dictionary passed to the constructor configures properties of the keyboard.

Key presses trigger events that can be captured in the application's behavior. The style (font and weight) of the keyboard's text are driven by a Style object supplied by the caller. This allows the use of Style templates.

The keyboard implements a doKeyboardTransitionOut event that can be triggered to cause the keyboard to transition off-screen. When the transition is complete, the keyboard triggers an event to notify the application.

Module Exports

Export Type Description
Keyboard constructor Constructor used to create Keyboard instances.
BACKSPACE string Constant used to indicate that the backspace key was pressed.
SUBMIT string Constant used to indicate that the submit key was pressed.
import {Keyboard, BACKSPACE, SUBMIT} from "keyboard";

Keyboard Object

Constructor Description

Keyboard(behaviorData, dictionary)

Argument Type Description
behaviorData * A parameter that is passed into the onCreate function of the keyboard's behavior. This may be any type of object, including null or a dictionary with arbitrary parameters.
dictionary object An object with properties to configure the resulting keyboard. Only parameters specified in the Dictionary section below will have an effect; other parameters will be ignored.

Returns a keyboard instance, a Port object that uses an instance of the KeyboardBehavior class as its behavior.

let OpenSans18 = new Style({ font: "semibold 18px Open Sans", color: "black" });
let keyboard = new Keyboard(null, {style: OpenSans18, doTransition: false})

Dictionary

Parameter Type Default Value Description
style style n/a Required. A Piu Style object that will be used for the text on keys.
bgColor string "#5b5b5b" The background fill color.
doTransition boolean false Whether or not to transition in the keyboard when it is first displayed.
keyColor string "#d8d8d8" The color for the character keys when not being pressed.
keyDownColor string "#999999" The color for the character keys while they are being pressed.
keyToggledColor string "#7b7b7b" The color for the character keys while they are being pressed.
specialKeyColor string "#999999" The color for the special keys (shift, symbol, backspace, and submit) when not being pressed.
specialTextColor string "#ffffff" The color for the text on special keys (shift, symbol, backspace, and submit).
submit string "OK" String to render on the submit key.
textColor string "#000000" The color for the text on character keys.
transitionTime number 250 The duration of the keyboard in/out transition in milliseconds.

Triggered Events

onKeyboardTransitionFinished()

The keyboard will bubble this event when it is done transitioning off-screen. The onKeyboardTransitionFinished function will usually be implemented and triggered in the calling application's behavior.


onKeyDown(key)

Argument Type Description
key string In most cases, the string will be the value of the key that is down (e.g. "a", "3", "$"). It can also be one of the two constants exported by the module: BACKSPACE or SUBMIT which indicate that those keys are down on the keyboard.

The keyboard will bubble this event when a key is pressed down. The onKeyDown function will usually be implemented and triggered in the calling application's behavior.


onKeyUp(key)

Argument Type Description
key string In most cases, the string will be the value of the key that was released (e.g. "a", "3", "$"). It can also be one of the two constants exported by the module: BACKSPACE or SUBMIT which indicate that those keys were released on the keyboard.

The keyboard will bubble an event onKeyUp when a key is released. The onKeyUp function will usually be implemented and triggered in the calling application's behavior.


Received Events

doKeyboardTransitionOut(keyboard)

Argument Type Description
keyboard keyboard The keyboard object that received the event.

This function can be triggered to cause the keyboard to transition off screen. When the transition is complete, the onKeyboardTransitionFinished event will be bubbled by the keyboard.