Creating a NumPad, DialPad or KeyPad on Screen

This is a route I used to create an on-screen keypad. Looking to understand if anyone else has done something like this and any more streamlined routes:

  • Created three input fields, one each for hundreds, tens, and ones.
  • Placed the ten digit buttons on the screen as a keypad.
  • Gave each digit button three click actions - first moves any digit currently in tens position to hundreds position, second moves any digit in ones position to tens position, third places the keypad digit into the ones position.
  • Placed one ‘enter’ button with click actions to write the values of the three inputs to three collection properties.
  • Added a click action to that enter button to multiply the first field by 100, and the second by 10, then add the resulting hundreds, tens, and ones values.
  • There is also a reset button on the keypad with click action to clear all three input fields in case of error in entry.

@Victor, from your YouTube Aug 12 2020 NumPad Experiment, interested to learn approach you used!

Hi @Russ,

I think you can clone this template: Clone Numpad & Pinpad to Jumpstart Your No Code App :slight_smile:

My approach was different. I didn’t use input fields. I rather have one numeric variable, where I store the value. This variable is in a specific Session collection - sessions created every time so that even logged-off users could use pinpad.
For the buttons I have the following action (for “1” +0.01, for “2” +0.02, for “3” +0.03, etc.):

And for “backspace” button I have the following action:

This is how I enter the numeric value.

Best regards, Victor.

Victor, thank you, I’ll check out the keypad module you have in Clonables.

Also thank you for the steer to the Clonables area of the Adalo site, great resources there.

Russ

1 Like

Very nice Implementation.

Have you tried for a date pad? where a user can input date and time like in ios 14 calendar.

The current date picker needs a lot of scrolls if one needs to put a date a few months or years back or ahead.

1 Like

Hi @YasirBucha,

I haven’t tried that, but thanks for a good idea!
The problem with date is that it is stored as number of days since 1/1/1970 (as I remember). And we have standard years, leap years; also number of days in a month vary… so such task is not very easy - how to convert all this to Adalo date :slight_smile:

We’ll see, may be I make some research and come with a result :slight_smile:

Best,
Victor

1 Like

Hi Victor, Thanks for your response…
Best of luck, would be very nice if you are able to make it.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.