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

Question

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!

Answer 1

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.