question

WeiWen-3421 avatar image
0 Votes"
WeiWen-3421 asked KyleWang-MSFT answered

Is it possible to create a few entry boxes that function like a pin number entry

I want to create a view that has six entry boxes for users to enter their pins. I want the effect that once a user starts entering the pin, the digits will keep filling on the rest of the entry boxes. Users should not have to select an entry box to enter a digit. Also, one entry box is only allowed one digit. Is this possible? If not, is there another way to achieve this? Thanks!

dotnet-xamarinforms
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

KyleWang-MSFT avatar image
0 Votes"
KyleWang-MSFT answered

Hi WeiWen-3421,

Welcome to our Microsoft Q&A platform!

To achieve "one entry box is only allowed one digit", you only need to set the Entry's "MaxLength" to "1".

You can create a style for Enrty in App.xaml.

 <Application.Resources>
     <Style x:Key="PinEntry" TargetType="Entry">
         <Setter Property="MaxLength" Value="1" />
         <Setter Property="IsPassword" Value="True"/>
     </Style>
 </Application.Resources>

And put the six entries into a "StackLayout" as follows.

 <StackLayout Orientation="Horizontal" VerticalOptions="Start" HeightRequest="50">
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
     <Entry Style="{StaticResource PinEntry}" TextChanged="Entry_TextChanged"/>
 </StackLayout>

Then subscribe to "TextChanged" for each entry and reser which entry focused. Please refer to the attach file.100359-demo.txt

Regards,
Kyle


If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.



demo.txt (918 B)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.