Basic Library for WPF and Silverlight | ComponentOne
WPF and Silverlight Edition Basic Library / Masked Text Box / MaskedTextBox Quick Start / Step 2 of 4: Customizing the Application
In This Topic
    Step 2 of 4: Customizing the Application
    In This Topic

    In the previous step you created a new WPF or Silverlight project and added four C1MaskedTextBox and five Label controls to the application. In this step you'll continue by setting properties to customize those controls.

    Complete the following steps:

    1. In Design view, click once on the Label1 control to select it, navigate to the Properties window, and set its Content property to "Employee Information".
    2. Select each remaining Label control in turn, navigate to the Properties window, and set the following for each:
    • Delete the default "Label" text next to Content property.
    • Set the FontSize property to "9".
    1. Switch to XAML view and customize C1MaskedTextBox1 by adding Watermark="Name" to the <c1:C1MaskedTextBox> tag so it appears similar to the following:
    XAML
    Copy Code
    <c1:C1MaskedTextBox Height="23" Margin="21,46,167,0" Name="C1MaskedTextBox1" VerticalAlignment="Top" Watermark="Name" />
    

    This will add a watermark to the control.

    1. Switch to XAML view and customize C1MaskedTextBox2 by adding Watermark="Employee ID" Mask="000-00-0000" to the <c1:C1MaskedTextBox> tag so it appears similar to the following:
    XAML
    Copy Code
    <c1:C1MaskedTextBox Margin="14,98,12,0" Name="C1MaskedTextBox2" Height="23" VerticalAlignment="Top" Watermark="Employee ID" Mask="000-00-0000" />
    

    This will add a watermark and mask to the control.

    1. Switch to XAML view and customize C1MaskedTextBox3 by adding Watermark="Hire Date" Mask="00/00/0000" to the <c1:C1MaskedTextBox> tag so it appears similar to the following:
    XAML
    Copy Code
    <c1:C1MaskedTextBox Height="23" Margin="14,0,12,87" Name="C1MaskedTextBox3" VerticalAlignment="Bottom" Watermark="Hire Date" Mask="00/00/0000"/>
    

    This will add a watermark and mask to the control.

    1. Switch to XAML view and customize C1MaskedTextBox4 by adding Watermark="Phone Number" Mask="(999) 000-0000" to the <c1:C1MaskedTextBox> tag so it appears similar to the following:
    XAML
    Copy Code
    <c1:C1MaskedTextBox Height="23" Margin="14,0,12,33" Name="C1MaskedTextBox4" VerticalAlignment="Bottom" Watermark="Phone Number" Mask="(999) 000-0000"/>
    

    This will add a watermark and mask to the control.

    You've successfully set up your application's user interface. In the next step you'll add code to your application.