Hi. I'm trying to build an app that uses a numberpad to fill everything out.
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!
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.
I'd recommend that you check out the excellent project that @KickingApps shared here.
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.
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.
@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.
@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!
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.
Check it out!
Fill out a quick form to claim your user group badge now!
Find out where you can attend!
Features releasing from October 2019 through March 2020
The largest Power BI, Power Platform, and Data conference in New Zealand