How to create an on screen keyboard

andreyjv shared this question 6 years ago
Answered

Can someone plz explain how can I create an on screen keyboard.


thanks

Best Answer
photo

For mobile and tablet prototypes, a functional keyboard will automatically appear during simulation when you focus in on an Input Text Field widget.

b14673ebe7b926f753e96cb2e583cdb5


If you'd like to create a keyboard on a Web prototype, check out the attached prototype to see an example. This one uses numbers, but the events are the same if you create a 'letter' keyboard.

Comments (7)

photo
1

Take a look at this video tutorial http://www.justinmind.com/prototyper/...

photo
1

I had follow the tutorial and I realize how to do this.


I just don ́t know how to make it a keyboard wich I can input data in the selected text field, I mean, I made a formula that when I use the keyboard just the first input field is filled.


869b779dc5fb91df15378d57e6b36acd

photo
1

You will need to use a set value action like this:


on click (button 1) set value (input) value is (1 concat input)


And do the same on all the buttons.

photo
1

How do I create a functioning iPhone keyboard that when click on the letter, it will show up in the text field

photo
1

Answered through Facebook

photo
1

I built a simple number pad with Image Maps over each button. Then added an interaction for each using "Concat" in the "Text" tab under "Functions" of the Expression Builder.


69753b8a422344bb1a16e7ccdbf32068

photo
1

For mobile and tablet prototypes, a functional keyboard will automatically appear during simulation when you focus in on an Input Text Field widget.

b14673ebe7b926f753e96cb2e583cdb5


If you'd like to create a keyboard on a Web prototype, check out the attached prototype to see an example. This one uses numbers, but the events are the same if you create a 'letter' keyboard.