I have created a kind of custom TextBox
in Expression Blend. I have changed the fill of the background and border to a gradient, and added in a Shadow Effect.
I've noticed that when I mouseover or focus my TextBox
, some default behavior/(style?) of WPF takes over and my border is changed.
I was wondering if there was anyway to prevent or stop WPF from changing my TextBox
es style when I focus or mouseover it. Is this possible?
Does you custom style set the OverridesDefaultStyle
property to true
? I believe this should prevent default values being drawn from the default style.
If so, and this isn't working (or you want to use your own border), all I can think is that you will need to override the default styling mechanism for the event of the appropriate property changing using a Trigger in your Style
/ ControlTemplate
:
<Style x:Key="Triggers" TargetType="TextBox">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property = "BorderBrush" Value="{Binding ToYourBorder}"/>
</Trigger>
</Style.Triggers>
</Style>
You should use a new template:
<Style TargetType="{x:Type TextBox}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="AllowDrop" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBoxBase}">
<Border
Name="Border"
CornerRadius="2"
Padding="2"
Background="#FFFFFF"
BorderBrush="#888888"
BorderThickness="1" >
<ScrollViewer Margin="0" x:Name="PART_ContentHost"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter TargetName="Border" Property="Background" Value="#EEEEEE"/>
<Setter TargetName="Border" Property="BorderBrush" Value="#EEEEEE"/>
<Setter Property="Foreground" Value="#888888"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I removed the trigger IsMouseOver
look here for more information: TextBox Styles and Templates
The easier solution is just set texbox border thickness to 0, then wrap texbox to your own border:
<Border BorderBrush="LightGray" BorderThickness="1">
<TextBox Text="{Binding OutlinePlain, Mode=TwoWay, NotifyOnTargetUpdated=True}"
BorderThickness="0"
</TextBox>
</Border>