Creating User Control using DatePicker & Masked Text Box

Question

Hi,

I am new to WPF, So i appologies for any mistakes which i am doing.

I using VS2010 and i want to create a Masked DatePicker User Control (e.g. __/__/____ dd/MM/yyyy format)

1) I went to Project and Opened the WPF User Control Library and given some Name

2) Now in designed view, hv placed the datepicker and MaskedTextBox(from 3rd party) and placed just above the DatePicker Control

3) In Code Behind as shown below

namespace myWPFControls

{

       public partial class MaskDatePicker

       {

        System.Globalization.CultureInfo enUS = new System.Globalization.CultureInfo("en-US");

         public MaskDatePicker()

         {

              this.InitializeComponent();

         }

    private void DTPicker_SelectedDateChanged(object sender, SelectionChangedEventArgs e)

        {

                     MskTxtBox.Text=Convert.ToDateTime(DTPicker.Text,enUS).ToString("dd/MM/yyyy");

        }

     private void MskTxtBox_LostFocus(object sender, System.Windows.RoutedEventArgs e)

        {

           try

              {

              DateTime CurrDate=DateTime.ParseExact(MskTxtBox.Text,"dd/MM/yyyy",enUS);

              if (CurrDate.ToString()!="")

              {

                    DTPicker.SelectedDate= CurrDate;

              }

              }

              catch (Exception exp)

              {

                MskTxtBox.Text = "";

              }

        }

     public string Text

        {

            get { return (string)GetValue(TextProperty); }

            set { SetValue(TextProperty, value); }

        }

     public static DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(MaskDatePicker));

    

}

}

Question

1) Is it the correct method to create a Control

2) If Yes then how will i expose the basic property like (Text, Is Enabled,)& Event LostFocus to use it in my main Application project.

3) Currently in my Application Program hv referenced this UserControl, I am not getting the Text Value in this usercontrol (MaskDatePicker) neither any error.

Can some one could help me in this.

THank you

Answer 1

Hi Hemantnaik,

First, this is a correct way to create a UserControl.

Second, you have create a DP for your UserControl called Textproperty, you just need to bind the TextProperty with textBox in UserControl. In this way, you can set the Text of Textbox in UserControl in window.

Please check out below code for your reference:

UserControl.cs

 public partial class UserControl1 : System.Windows.Controls.UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
        }

        public string Text
        {
            get { return (string)GetValue(TextProperty); }

            set { SetValue(TextProperty, value); }
        }
        public static readonly DependencyProperty TextProperty =

              DependencyProperty.Register("Text", typeof(string), typeof(UserControl1));
    }

UserControl xaml code:

<UserControl x:Class="test.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:Winf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
             mc:Ignorable="d" 
             >
   
    <Grid>
        <StackPanel>
         <TextBox Text="{Binding RelativeSource={RelativeSource AncestorType=UserControl},Path=Text}"/>
        </StackPanel>
    </Grid>
</UserControl>

MainWindow:

  <local:UserControl1 Text="Binding text in UserControl"/>

And for how to handle event in UserControl, please check out below link for your reference:

http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/a81ed36b-c9d1-4619-96e2-4025b919819c/

Hope it helps.

Have a nice day.

---

Annabella Luo[MSFT]
MSDN Community Support | Feedback to us