Silverlight 4 Setting background color of textbox on focus
- by Sean Riedel
I am trying to set the background color of a Textbox to white on focus using a Style.
My enabled Textbox has a Linear Gradient background by default:
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
<GradientStop Color="#e8e8e8" Offset="0.0" />
<GradientStop Color="#f3f3f3" Offset="0.25" />
<GradientStop Color="#f4f4f4" Offset="0.75" />
<GradientStop Color="#f4f4f4" Offset="1.0" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
I have a focus visual state defined:
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
</Storyboard>
</VisualState>
Here is the rest of the Control Template:
<Border x:Name="Border" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1" Opacity="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">
<Grid>
<Border x:Name="ReadOnlyVisualElement" Opacity="0" Background="#5EC9C9C9"/>
<Border x:Name="MouseOverBorder" BorderThickness="1" BorderBrush="Transparent">
<ScrollViewer x:Name="ContentElement" Padding="{TemplateBinding Padding}" BorderThickness="0" IsTabStop="False"/>
</Border>
</Grid>
</Border>
<Border x:Name="DisabledVisualElement" Background="#A5D7D7D7" BorderBrush="#A5D7D7D7" BorderThickness="{TemplateBinding BorderThickness}" Opacity="0" IsHitTestVisible="False"/>
<Border x:Name="FocusVisualElement" Background="#A5ffffff" BorderBrush="#FF72c1ec" BorderThickness="{TemplateBinding BorderThickness}" Margin="1" Opacity="0" IsHitTestVisible="False"/>
On the last Border tag is where I am trying to set the background to white (#ffffff). Right now I have the opacity at A5 which does turn the background white, however it also starts to obscure the text in the box. Any higher opacity makes the text invisible so I am pretty sure that setting the background of that border is not the right way to do this.
Can I set the Background color of the ContentElement somehow through a StoryBoard?
Thanks.
