Geek Answers Handbook

Problem with ugly WPF TextBox borders

I want to override the default text box borders in WPF. I have this style that applies to all TextBox.

<!-- StyleTextBox--> <Style x:Key="StyleTextBox" TargetType="{x:Type TextBox}"> <Setter Property="MinHeight" Value="20" /> <Setter Property="HorizontalAlignment" Value="Left"/> <Setter Property="Margin" Value="3"/> <Setter Property="IsEnabled" Value="{DynamicResource WriteAble}"/> <Setter Property="SnapsToDevicePixels" Value="True" /> <Setter Property="VerticalContentAlignment" Value="Top" /> <Setter Property="BorderThickness" Value="1" /> <Setter Property="BorderBrush" Value="{StaticResource ButtonFont_DarkGray}" /> <Style.Triggers> <!--Resolves multiline textbox vertical alignment problem--> <Trigger Property="TextWrapping" Value="NoWrap"> <Setter Property="VerticalContentAlignment" Value="Center" /> </Trigger> </Style.Triggers> </Style>

I added SnapsToDevicePixels="True" to display borders correctly on LCD monitors.

But each TextBox seems different. Some borders are missing or gray. Does anyone know why?

+4
source share
4 answers

You can try to edit the template for text fields and change the name of the Bd border to a "real" border instead of chrome. Like this:

 <ControlTemplate x:Key="TextBoxBaseControlTemplate1" TargetType="{x:Type TextBoxBase}"> <Border x:Name="Bd" SnapsToDevicePixels="True" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" > <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> </Border> <ControlTemplate.Triggers> <Trigger Property="IsEnabled" Value="False"> <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate>

add this installer to your style to include the template:

 <Setter Property="Template" Value="{DynamicResource TextBoxBaseControlTemplate1}"/>
+7
source

WPF tries to be device independent when rendering the user interface on the monitor and will not draw a “perfect pixel” if you don't say it. Try adding this to your style:

 <Setter Property="SnapsToDevicePixels" Value="True" />

This should specify WPF to display each border 1 pixel wide along one pixel row.

+2
source

You need to follow these steps to solve this problem ...

  • SnapsToDevicePixels="True"

  • Do not specify width, do it with margins

    <Setter Property="BorderBrush" HorizontalAlignment="Left" Margin="2,2,2,2" Value="{StaticResource DarkGray}" />

Hope this helps :)

0
source

I think the left border and the upper border are stylized, but the border on the right and buttom remains gray, although I explicitly said in style that BorderBrush = MyBrush. What do you think? How to try to remove a 3D effect from a TextBox?

0
source

More articles:


All Articles