Search This Blog

Wednesday, 18 May 2022

Xamarin / .Net MAUI Phone Number Control.



 Create and Add CellPhoneEntryControl In Your Project.

CellPhoneEntryControl.xaml
<?xml version="1.0" encoding="UTF-8"?>
<Grid xmlns="http://xamarin.com/schemas/2014/forms" 
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
      x:Class="TestApp.Controls.CellPhoneEntryControl"
      x:Name="this"
      RowDefinitions="Auto,Auto"  
      RowSpacing="0"
      ColumnDefinitions="Auto">
    <Entry MaxLength="10" BindingContext="{x:Reference this}" Text="{Binding CellPhone}" Grid.Column="0" HeightRequest="0.01"    x:Name="txtEditor"  Grid.Row="1"  
           TextChanged="txtEditor_TextChanged" Keyboard="Numeric" TextColor="Transparent"   
           HorizontalOptions="FillAndExpand"/>
 
    <Label   FontSize="17" x:Name="lblEntry" VerticalTextAlignment="Center"  Grid.Row="0" Grid.Column="0" />
    <Grid.GestureRecognizers>
        <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped_ForFocus" />
    </Grid.GestureRecognizers>
</Grid>

CellPhoneEntryControl.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
 
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
 
namespace TestApp.Controls
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class CellPhoneEntryControl : Grid
    {
        public CellPhoneEntryControl()
        {
            InitializeComponent();
        }
 
        public static readonly BindableProperty CellPhoneProperty = BindableProperty.Create(
        propertyName: nameof(CellPhone),
        returnType: typeof(string),
        declaringType: typeof(CellPhoneEntryControl),
        defaultBindingMode: BindingMode.TwoWay);
 
        public string CellPhone
        {
            get => (string)base.GetValue(CellPhoneProperty);
            set => base.SetValue(CellPhoneProperty, value);
        }
 
        private void txtEditor_TextChanged(object sender, TextChangedEventArgs e)
        {
            Entry txtEntry = sender as Entry;
            if (txtEntry.Text.Length > 10)
            {
                txtEntry.Text = txtEntry.Text.Substring(0, 10);
                return;
            }
 
            string entry1 = "", entry2 = "", entry3 = "";
            try
            {
                for (int i = 0; i < txtEntry.Text.Length; i++)
                {
                    if (i < 3)
                        entry1 += txtEntry.Text[i];
 
                    if (i > 2 && i < 6)
                        entry2 += txtEntry.Text[i];
 
 
                    if (i > 5)
                        entry3 += txtEntry.Text[i];
                }
 
                lblEntry.Text = $"( {entry1} ) {entry2} - {entry3}";
            }
            catch (Exception ex)
            {
 
            }
        }
 
        private void TapGestureRecognizer_Tapped_ForFocus(object sender, EventArgs e)
        {
            txtEditor.Focus();
            if (!string.IsNullOrWhiteSpace(txtEditor.Text))
                txtEditor.CursorPosition = txtEditor.Text.Length;
        }
    }
}


Implementations
MainPage.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:controls="clr-namespace:TestApp.Controls"
             x:Class="TestApp.MainPage">
 
    <StackLayout>
        <Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
            <Label Text="Welcome to Xamarin.Forms!" HorizontalTextAlignment="Center" TextColor="White" FontSize="36"/>
        </Frame>
 
        <controls:CellPhoneEntryControl  HorizontalOptions="Center" CellPhone="123456789"/>
    </StackLayout>
 
</ContentPage>
 

No comments:

Post a Comment

Popular Posts