cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
dyee4613
Level 8

Numberpad

Hi.  I'm trying to build an app that uses a numberpad to fill everything out. 
Example:

Favorite Number: ______
Second Favorite Number: ______

 

1 2 3

4 5 6

7 8 9

 

The users would click the favorite number field then select the number from the keypad to fill it in.  The same thing would happen for the second favorite number field.  I hope that makes sense!

 

28 REPLIES 28
Super User
Super User

Re: Numberpad

@dyee4613 

There is nothing out of the box that would give you that control, but it is easly created.

We do this for a lot of Dialer type apps where we want the person to enter the number to call.

In our case we use a Horizontal Gallery with a Vertical Gallery in it to build the number pad.

Then when the user selects a number, we're just adding it to a variable.

 

I hope this gives you some insight on your next steps.  If you're stuck, just post back.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Super User
Super User

Re: Numberpad

Hi @dyee4613 

I'd recommend that you check out the excellent project that @KickingApps shared here.

https://powerusers.microsoft.com/t5/Community-Apps-Gallery/Numeric-Keypad/m-p/175267

This provides you with the UI for your numeric keypad. Then through the OnSelect property of each button, you can append the number that the user entered with the UpdateContext (or Set) function. Like @RandyHayes says, post back if you need help on the specific syntax.

 

dyee4613
Level 8

Re: Numberpad

@timl Thank you!  I saw his awesome app.  That looks a little beyond me ability but I reached him to him to see if he could help prior to making this thread.  

 

@RandyHayes Could you point me to an example or some fake code to give me an idea how this would work? I'm having trouble visualizing this.

dyee4613
Level 8

Re: Numberpad

double post. delete please.

Super User
Super User

Re: Numberpad

@dyee4613 

Check out some of the samples mentioned here.

Two galleries were to make the grid of numbers with, really, only one button to work with.  If you spread a bunch of buttons, you will be dealing with formulas for each one of them.  That can get out of control quickly.  Much easier to work with just one.

 

I will get back with you later on some specifics, but in the meantime, check the samples mentioned.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
KickingApps
Level 8

Re: Numberpad

@dyee4613 Sent you a Skype invite; hopefully we can get you all set up this evening! Thanks for the mentions @RandyHayes @timl 

Super User
Super User

Re: Numberpad

@KickingApps I finally got a chance to download and look at that template...pretty cool.  I like the slide up and down feel.

@dyee4613 I did mention that I would throw some specifics at you later, and as promised.  I have attached a NumPad sample that we've used in Apps.  

You asked why the two galleries - that was my approach to horizontal rows and vertical columns.  And doing so, instead of having buttons for each number and an endless positioning and updating OnSelect's...this solution has 4 primary controls in it - 2 galleries, a label and a circle.  Plus 5 other controls - 1 for erase, 1 for cancel, and 3 to make it look pretty.

There are two variables it uses: one is showNumPad, which shows or hides the pad, and one is numberEntered, which is the number that has been entered. No other variables or collections needed.

Feel free to use all or parts of it if you'd like.

Hope this helps some.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
dyee4613
Level 8

Re: Numberpad

@KickingAppsYep.  I accepted.  I'm excited to meet you!  I think I'm getting pretty close.


@RandyHayesI was playing around with your app and it's exactly what I was looking for.  The only thing left is to add in functionality for multiple input fields instead of one.  From there, all I have to do is layer my existing app logic on it and it should be good to go!

Highlighted
Super User
Super User

Re: Numberpad

@dyee4613 

For the multiple fields, that gets a little tricky.  

I just went off on an adventure to make this Numberpad a Component and try to use the new component feature.  This all went very well - until I attempted to add a second Numberpad component to the screen.  At that point things went bad.  @Mr-Dang-MSFT is there an issue with having two (or more) of the same component on a screen?  Seems that when there is, the screen gets its values from the wrong component.  I need to experiment more with that concept, but that would be Awesome if it worked.

 

So, doing it for multiple fields would involve switching aroung the variable that is "responding" to the input.  I have not put this to the test because I was really banking on the Components being the home run, but basically you would need to set a variable when a user clicks on one input over the other.  Then using a switch or If statement, you could fill in the value based on that variable.  If you and @KickingApps don't get it sorted out and need more on that, I can put that together a little better.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.

Helpful resources

Announcements
thirdimage

Power Apps Super User Class of 2020

Check it out!

thirdimage

Power Apps Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

sixthImage

Power Platform World Tour

Find out where you can attend!

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

SecondImage

Difinity Conference

The largest Power BI, Power Platform, and Data conference in New Zealand

Top Solution Authors
Top Kudoed Authors (Last 30 Days)
Users online (5,831)