[DatePickerTextBox] how to remove white line around the date

Jul 3, 2009 at 3:42 AM


is there any way to remove the white line around the date in the datepickertextbox?



as u may notice there's a white line around the text inside the textbox, how can i remove that?




Jul 9, 2009 at 4:36 AM

still no respond?



Jul 10, 2009 at 9:44 AM

just bumping this question O__O

 i really need help here

Jul 10, 2009 at 12:40 PM


Just set BorderThickness="0"

But I must say, judging from the screenshot you uploaded, I think it looks like you are building some web component. It doesn't look like you're using the WPF Toolkit DatePicker at least...

Jul 13, 2009 at 4:32 AM


thanks for the respond, but BorderThickness affect the black border around the textbox not the white line,

and i'm using wpftoolkit datepicker but i retemplate it so i can use the calendar icon instead the default image



this is how i retemplate the datepicker

<Style x:Key="DatePicker_Standard" TargetType="{x:Type Toolkit:DatePicker}">
        <Setter Property="Control.FontFamily" Value="/#Calibri" />
        <Setter Property="Control.FontSize" Value="12" />
        <Setter Property="Control.Margin" Value="2" />
        <Setter Property="Control.Height" Value="21" />
        <Setter Property="Control.VerticalAlignment" Value="Center" />
        <Setter Property="ToolkitPrimitives:DatePickerTextBox.BorderBrush" Value="{StaticResource SolidBorderBrush}"/>
        <Setter Property="Toolkit:DatePicker.BorderThickness" Value="0"/>
        <Setter Property="Toolkit:DatePicker.DisplayDateStart" Value="1753-01-01"/>
          <Setter Property="Template">
                <ControlTemplate TargetType="{x:Type Toolkit:DatePicker}">
                    <Border BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Background="{TemplateBinding Background}"
                            Padding="{TemplateBinding Padding}">
                            <Grid x:Name="PART_Root"
                                  HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                <Grid.Resources >
                                    <!-- Button Template -->
                                    <ControlTemplate x:Key="DropDownButtonTemplate" TargetType="Button">                                       
                                        <Image Style="{DynamicResource imageCalendarDatePicker}" Height="20" Width="20" />                                        
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="Auto" />
                                <Button x:Name="PART_Button" Grid.Row="0" Grid.Column="1"
                                        Template="{StaticResource DropDownButtonTemplate}"
                                        Foreground="{TemplateBinding Foreground}"
                                        HorizontalAlignment="Left" />
                                <ToolkitPrimitives:DatePickerTextBox x:Name="PART_TextBox"   
                                                                     BorderThickness="1" HorizontalContentAlignment="Stretch"
                                                                     Foreground="{TemplateBinding Foreground}"
                                                                     Grid.Row="0" Grid.Column="0"  
                                                                     BorderBrush="{TemplateBinding BorderBrush}">
                                        <ContextMenu Visibility="Hidden"/>

                                <Grid x:Name="PART_DisabledVisual"
                                      Grid.Row="0" Grid.Column="0"
                                        <ColumnDefinition Width="*"/>
                                        <ColumnDefinition Width="Auto"/>
                                    <Rectangle Grid.Row="0" Grid.Column="0" RadiusX="1" RadiusY="1" Fill="{StaticResource SolidBorderBrush}"/>
                                    <!--<Rectangle Grid.Row="0" Grid.Column="1" RadiusX="1" RadiusY="1" Fill="{StaticResource SolidBorderBrush}" Height="18" Width="19" Margin="3,0,3,0" />-->
                                    <Popup x:Name="PART_Popup"
                                           PlacementTarget="{Binding ElementName=PART_Button}"
                                           AllowsTransparency="True" />
          <Trigger Property="IsEnabled" Value="False">
            <Setter TargetName="PART_TextBox" Property="Background" Value="{StaticResource DisabledBackgroundBrush}"/>
            <Setter TargetName="PART_TextBox" Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
            <Setter TargetName="PART_TextBox" Property="BorderBrush" Value="{StaticResource SolidBorderBrush}"/>

Jul 22, 2009 at 2:03 AM

Hi Sando -

Assuming that screenshot is of your Disabled DatePicker, then I think you want to set Border="0" on your DatePickerTextBox. Let me know if that doesn't seem to solve your issue.

-Eric, MSFT

Jul 22, 2009 at 9:19 AM

hi eric,

thanks for the respond but unfortunately it's not solved the problem, the Border on DatepickerTextBox refer to the black border around it.

below i provide the screenshot if i set it like this:

<ToolkitPrimitives:DatePickerTextBox x:Name="PART_TextBox"   



u can see that the white line is still there x___x

owh yeah, i forgot to remove the property HorizontalContentAlignment="Stretch", if i remove this and make the field empty, then it will be like this:



as u can see, i think the whit line has nothing to do with border, CMIIW





Jul 22, 2009 at 9:29 PM

Hi Sando -

I think I see what you are talking about. You may have to modify the ControlTemplate of the DatePickerTextBox. In that template you will see a Grid called WatermarkContent. In this Grid the first two children should be Borders hardcoded to be 1px and white (#FFFFFFFF). When the Control is moused over the VSM code animates them blue. The white border you want to remove (should) consist of these two overlayed 1px white (when not moused over) Borders. I'd suggest setting the Borders' Color to Transparent (which should show the Background of the Control) or you can TempalteBind it to the TextBox's Background. Let me know if this works out for you.  If not, we can try again :-P

-Eric, MSFT

Jul 23, 2009 at 5:10 AM

yay ^o^

it works ^_^, thanks eric, i have to remove the content property from this code though

<ContentControl x:Name="PART_Watermark"
                                                        Content="{TemplateBinding Watermark}"             <--- this one

i dunno why, but i can't run my program if use that part of code lol



Jul 23, 2009 at 9:20 PM

Hi Sando -

You need to edit that line because you are referencing the Watermark property, which is marked as internal inside the DatePickerTextBox which restricts access it. Remove the TemplateBinding and enter whatever text you would like to see as your Watermark. Note: without any additional logic/xaml, your watermark will remain the same regardless of what DateFormat is set (Short, Long).

-Eric, MSFT

Jul 24, 2009 at 7:07 AM

Hi eric,

ahh i see now why it's created an error, but i think in my current application i don't need the watermark, so it won't be any problem if i don't use it lol.

well i guess next time i need to retemplate it from the start then build the newer dll and not get the dll then retemplate it lol


well thanks for the help anyway ^__^