Search code examples
c#wpfexpression-blend

Change the Border Style of a Focused Text Box using Blend and WPF


I've been headdesking over this for quite some time. Can someone please explain to me, using Expression Blend, how to edit/override the default FocusVisualStyle for a text box? Currently all of my text boxes have that blue accent when they're selected, and this doesn't match my current application's theme, but I just can't figure out how to override this. I think I've set the Border brush in about 10 different places in various templates, events, and properties, and it just won't override.

Edit: Buttons do this, as well, and it looks even more ugly. I'd like a solution that incorporates all controls that behave like this.

A set of directions for Blend would be preferable to just pasting XAML, but at this point I can't get picky.


Solution

  • The behavior you're seeing is actually part of the ListBoxChrome element that exists within TextBox's default control template. You could easily swap this out with a simpler template that uses the BorderBrush property, which is what Silverlight's TextBox does.

    <ControlTemplate TargetType="{x:Type TextBox}">
        <Border x:Name="Bd" 
                Background="{TemplateBinding Background}" 
                BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                CornerRadius="2">
            <ScrollViewer x:Name="PART_ContentHost" />
        </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>