ساخت TextBox Mask در WPF سی شارپ

پاسخ هوش مصنوعی

برای ایجاد یک TextBox با ماسک در WPF بدون استفاده از کامپوننت های اضافی، می توانید از رویدادهای مربوط به TextBox استفاده کنید. به عنوان مثال، برای ایجاد یک TextBox برای ورودی تاریخ، می توانید از کد زیر استفاده کنید:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void TextBox_PreviewTextInput(object sender, TextCompositionEventArgs e)
    {
        // جلوگیری از ورود هر کاراکتری غیر از اعداد
        e.Handled = !IsInputValid(e.Text);
    }

    private bool IsInputValid(string input)
    {
        return int.TryParse(input, out _);
    }

    private void TextBox_PreviewKeyDown(object sender, KeyEventArgs e)
    {
        if (e.Key == Key.Back && TextBox.Text.Length > 0)
        {
            int caretIndex = TextBox.CaretIndex;
            TextBox.Text = TextBox.Text.Remove(caretIndex - 1, 1);
            TextBox.CaretIndex = caretIndex - 1;
            e.Handled = true;
        }
    }
}

در XAML، TextBox خود را به رویدادها متصل کنید:

<TextBox x:Name="TextBox" 
           PreviewTextInput="TextBox_PreviewTextInput" 
           PreviewKeyDown="TextBox_PreviewKeyDown" 
           MaxLength="10"/>

برای ورودی شماره تلفن، می توانید همین روش را اعمال کنید و فقط الگوهای مجاز را تغییر دهید.

برای این کار میتونید چندین ایده مختلف رو پیاده سازی کنید. یکی از ایده هایی که به ذهن من میرسه اینه که مثلا شما یک TextBox روی پنجره خودتون قرار بدید و در رویداد TextChanged اون بیاید و کنترل کنید که مثلا اگر طول متن وارد شده به TextBox دقیقا 4 کاراکتر بود یک علامت / بذاره. (برای تاریخ میتوانید این کار رو انجام بدید.)

کدهای xaml برای این کار :

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="200" Width="350">
    <Grid>
        <TextBox HorizontalAlignment="Left" Height="23" Margin="82,46,0,0" TextWrapping="Wrap" Name="txt1" TextChanged="TextBox_TextChanged" VerticalAlignment="Top" Width="178"/>

    </Grid>
</Window>

کدهای BackEnd

        private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
        {
            if (txt1.Text.Length == 4)
            {
                txt1.Text += "/";
                txt1.CaretIndex = txt1.Text.Length;
                txt1.ScrollToEnd();
                txt1.Focus();
            }
            if (txt1.Text.Length == 7)
            {
                txt1.Text += "/";
                txt1.CaretIndex = txt1.Text.Length;
                txt1.ScrollToEnd();
                txt1.Focus();
            }
        }

الان اگر پروژه رو اجرا کنید یه چیزی مشابه با کامپوننت تاریخ پیاده سازی شده. البته خب خیلی کنترلهای دیگه هم باید انجام بشه برای چنین کاری. این فقط یه ایده است که میتونه تکمیل بشه.

نمونه انجام شده رو در زیر ببینید