Numpad - Decimal
Numeric keypad decimal value entry with double scale featuring min/max value validation. With source code.
Numpad - Currency
Numeric keypad monetary value entry with double scale featuring min/max and validation. With source code.
Numpad - Integer
Numeric keypad for integer value entry supporting negative and positive numbers and validation. With source code.
Numpad - Timespan
Numeric keypad demo for capturing hour minute and seconds. Great for setting timers and alarms. With source code.
Numpad - RTL Support
Numeric keypad RTL demo for right to left rendering & languages like Arabic, Hebrew, Farsi. With source code.
Numpad - Time
Numeric keypad demo for capturing time inputs. 12h and 24 hour format is supported. With source code.
Numpad - Date
Numeric keypad date entry demo with header text. Custom date format and validation is supported. With source code.
Numpad - Masked Entry - PIN
Numeric keypad PIN demo with masked input and value entry. Custom length PIN is supported. With source code.
Numpad - Phone number entry
Use the numpad for phone number entry. With built-in validation your users cannot go wrong.
validate function to check for the appropriate length, format and only enable the
set button if everything looks good.
With the help of the
template setting, the
parseValue functions you can ensure the phone number is shown in the correct format, with all the dashes and spaces that make sense.
Numpad - Variable Fraction
Numeric keypad demo for decimal value entry with variable scale, fraction length. With source code.
Numpad - Donation
Mobile donation screen with predefined amounts and numeric keypad for custom value entry.
Numpad - Event handlers
Numeric keypad demo with event hooks for custom integration and functionality. With source code.
Numpad - Display modes
Numeric keypad demo with top, bottom, popup, center, modal, bubble and inline embedded display modes.
Numpad - Theming capabilities
The look and feel of the numpad can be deeply customized. There are four levels of customization:
- Base themes: Choose between
Android Material and
- Light or dark: Every theme has a
dark variant. Setting the
'auto' will switch based on system settings.
- Custom themes: Use the theme builder to customize the colors and make it match your brand.
- Custom CSS: If you need further customization, the sky is the limit with CSS overrides.
You can also see how every example looks by changing the theme from the header.
Looking for something you didn't see or have a sales question?
Ask us about it, we're here to help.