Develop Reference

WPF Flash A Border But not the Children

Any ideas on how to flash a border but not the children inside?
I can flash the border like so:
<UserControl.Resources>
<Storyboard x:Key="valueFlasher" RepeatBehavior="Forever">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="outline">
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0.2"/>
<EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<Border BorderBrush="Black" BorderThickness="3" CornerRadius="7" x:Name="outline">
<!--children-->
</Border>
But that will change the opacity of everything nested inside.
I was thinking something like this:
<Border BorderThickness="3" CornerRadius="7">
<Border.BorderBrush>
<SolidColorBrush Color="Black" x:Name="outline"/>
</Border.BorderBrush>
<!--children-->
</Border>
But it doesn't seem to work either. Maybe my storyboard can't find 'outline' because its nested?
Thanks in advance!

The property path (UIElement.Opacity) is not valid for SolidColorBrush, because it is not a UIElement.
Instead, use BorderBrush.Opacity
<Storyboard x:Key="valueFlasher" RepeatBehavior="Forever">
<DoubleAnimationUsingKeyFrames
Storyboard.TargetProperty="BorderBrush.Opacity"
Storyboard.TargetName="outline">
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0.2"/>
<EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
with a Border like this:
<Border x:Name="outline" BorderThickness="3" CornerRadius="7">
<Border.BorderBrush>
<SolidColorBrush Color="Black"/>
</Border.BorderBrush>
<!--children-->
</Border>
Or just Opacity
<Storyboard x:Key="valueFlasher" RepeatBehavior="Forever">
<DoubleAnimationUsingKeyFrames
Storyboard.TargetProperty="Opacity"
Storyboard.TargetName="outline">
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0.2"/>
<EasingDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
with the x:Name set on the SolidColorBrush:
<Border BorderThickness="3" CornerRadius="7">
<Border.BorderBrush>
<SolidColorBrush x:Name="outline" Color="Black"/>
</Border.BorderBrush>
<!--children-->
</Border>

WPF MultiDataTrigger.EnterAction is not working with a custom attribute

I've been trying to get a WPF multi datatrigger to work on triggering a storyboard animation on a customized ToggleButton based of this control http://marcangers.com/animated-switch-togglebutton-style-in-wpf/ . The toggle button is an extension of a regular WPF ToggleButton with a custom attribute of Status which will either show as Modified or Unmodified. My MultiDataTrigger is triggering on whether the togglebutton IsChecked and the status is either modified or unmodified. The problem is, the storyboards aren't triggering at all. When I have the storyboard animations in a regular trigger it works just fine. Here's the custom toggle button.
CustomToggleButton.xaml
<ToggleButton x:Class="DPC9600CustomControlLibrary.CustomToggleButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:ControlLibrary"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<ToggleButton.Resources>
<ResourceDictionary Source="Themes/Styles_CustomToggleButton.xaml"/>
</ToggleButton.Resources>
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}" BasedOn="{StaticResource CustomToggleButton}"/>
</ToggleButton.Style>
</ToggleButton>
CustomToggleButton.xaml.cs
public partial class CustomToggleButton : ToggleButton
{
public static readonly DependencyProperty StatusProperty =
DependencyProperty.Register("Status", typeof(ConfigurationValueStatus), typeof(CustomToggleButton));
public ConfigurationValueStatus Status
{
get { return (ConfigurationValueStatus) GetValue(StatusProperty); }
set { SetValue(StatusProperty, value); }
}
public CustomToggleButton()
{
InitializeComponent();
}
}
And here's my multidata triggers in Styles_CustomToggleButton.xaml
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
<Condition Binding="{Binding Status,ElementName=Myself}" Value="Unmodified"/>
</MultiDataTrigger.Conditions>
<MultiDataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FF377EC1" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FF377EC1" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="0"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</MultiDataTrigger.EnterActions>
<MultiDataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="15"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</MultiDataTrigger.ExitActions>
</MultiDataTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}" Value="True"/>
<Condition Binding="{Binding Status,ElementName=Myself}" Value="Modified"/>
</MultiDataTrigger.Conditions>
<MultiDataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="Goldenrod" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="Goldenrod" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="0"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</MultiDataTrigger.EnterActions>
<MultiDataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="15"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</MultiDataTrigger.ExitActions>
</MultiDataTrigger>
I'm not sure what I'm doing wrong, using a regular trigger makes the animation work. Here's a look at the trigger.
<Trigger Property="IsChecked" Value="true" >
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FF377EC1" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#FF377EC1" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="0"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="15" KeySpline="0, 1, 0.6, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.Color" To="#FAFAFB" Duration="0:0:0.2" />
<ColorAnimation Storyboard.TargetProperty="BorderBrush.Color" To="#EAEAEB" Duration="0:0:0.2" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Ellipse.RenderTransform).(TranslateTransform.X)" Storyboard.TargetName="ellipse">
<SplineDoubleKeyFrame KeyTime="0" Value="15"/>
<SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="0" KeySpline="0, 0.5, 0.5, 1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>

I can't find a definition for Myself in your XAML.
If this is in Style.Triggers (I'm pretty sure it is), I would think the binding to Status should be {Binding Status, RelativeSource={RelativeSource Self}, just like your IsChecked binding.
If I'm wrong and it's in ControlTemplate.Triggers, I would try {Binding Status, RelativeSource={RelativeSource TemplatedParent} -- and the same for IsChecked.

The problem was with <Condition Binding="{Binding Status,ElementName=Myself}" Value="Modified"/> all I had to do was switch it to <Condition Binding="{Binding Status, RelativeSource={RelativeSource=Self}}" Value="Modified"/>
This change fixes the styling triggers.

C# - WPF Access elements in a DataTemplate from code behind

I tried to create a card game in WPF.
My Problem is that I want to flip a card at a certain time.
I created two storyboards in a datatemplate, one for each flip (back and front). But when I tried to access and start it from the code behind I got an error, because it can't access the grid, which contains the new card image, inside the datatemplate.
So my question is, how can I access the grid inside the datatemplate from code behind, to get my storyboard run?
Here is my code:
XAML:
<Window x:Class="KartenQuartett.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:KartenQuartett"
mc:Ignorable="d"
ResizeMode="NoResize"
Title="{Binding Title}" Height="510" Width="670" WindowStartupLocation="CenterScreen">
<Window.Resources>
<DataTemplate x:Key="RotatingItemTemplate">
<DataTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.LayoutTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<QuinticEase EasingMode="EaseInOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="-1">
<EasingDoubleKeyFrame.EasingFunction>
<QuinticEase EasingMode="EaseInOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.ZIndex)" Storyboard.TargetName="grid1">
<EasingInt32KeyFrame KeyTime="0" Value="0"/>
<EasingInt32KeyFrame KeyTime="0:0:0.5" Value="0"/>
<EasingInt32KeyFrame KeyTime="0:0:0.5" Value="1"/>
</Int32AnimationUsingKeyFrames>
<Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.ZIndex)" Storyboard.TargetName="image">
<EasingInt32KeyFrame KeyTime="0" Value="1"/>
<EasingInt32KeyFrame KeyTime="0:0:0.5" Value="1"/>
<EasingInt32KeyFrame KeyTime="0:0:0.5" Value="0"/>
</Int32AnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Storyboard1_reversed">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.LayoutTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="grid">
<SplineDoubleKeyFrame KeyTime="0" Value="-1"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<QuinticEase EasingMode="EaseInOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<QuinticEase EasingMode="EaseInOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.ZIndex)" Storyboard.TargetName="grid1">
<EasingInt32KeyFrame KeyTime="0:0:0.5" Value="1"/>
<SplineInt32KeyFrame KeyTime="0:0:0.5" Value="0"/>
<SplineInt32KeyFrame KeyTime="0:0:1" Value="0"/>
</Int32AnimationUsingKeyFrames>
<Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.ZIndex)" Storyboard.TargetName="image">
<SplineInt32KeyFrame KeyTime="0:0:0.5" Value="0"/>
<SplineInt32KeyFrame KeyTime="0:0:0.5" Value="1"/>
<SplineInt32KeyFrame KeyTime="0:0:1" Value="1"/>
</Int32AnimationUsingKeyFrames>
</Storyboard>
</DataTemplate.Resources>
<Grid x:Name="grid">
<Grid.LayoutTransform>
<TransformGroup>
<ScaleTransform CenterX="0.5" CenterY="0.5"/>
<SkewTransform CenterX="0.5" CenterY="0.5"/>
<RotateTransform CenterX="0.5" CenterY="0.5"/>
<TranslateTransform/>
</TransformGroup>
</Grid.LayoutTransform>
<Grid x:Name="grid1">
<Image x:Name="image1" Source="{Binding ImageFront}" Stretch="Fill" />
<Grid.LayoutTransform>
<TransformGroup>
<ScaleTransform ScaleX="-1"/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Grid.LayoutTransform>
</Grid>
<Image x:Name="image" Source="{Binding Image}" Stretch="Fill" />
<Button x:Name="Bdrehen" Content="Drehen" HorizontalAlignment="Left" Margin="119,407,0,0" VerticalAlignment="Top" Width="75" Click="Bdrehen_Click"/>
</Grid>
<DataTemplate.Triggers>
<EventTrigger RoutedEvent="Button.Click" SourceName="Bdrehen">
<BeginStoryboard x:Name="Storyboard1_BeginStoryboard1" Storyboard="{StaticResource Storyboard1}"/>
</EventTrigger>
<EventTrigger RoutedEvent="UIElement.MouseLeftButtonDown" SourceName="grid1">
<StopStoryboard BeginStoryboardName="Storyboard1_BeginStoryboard1"/>
<BeginStoryboard x:Name="Storyboard1_reversed_BeginStoryboard" Storyboard="{StaticResource Storyboard1_reversed}"/>
</EventTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=".5*"></ColumnDefinition>
<ColumnDefinition Width=".5*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" x:Name="gridOne">
<Image x:Name="cardFront" Source="Bilder/card_front.png" Stretch="Fill">
</Image>
<StackPanel x:Name="stack1" Margin="25">
</StackPanel>
</Grid>
<Grid Grid.Column="1" x:Name="gridTwo">
<ScrollViewer ScrollViewer.HorizontalScrollBarVisibility="Auto" ScrollViewer.VerticalScrollBarVisibility="Disabled" >
<ItemsControl ItemsSource="{Binding MyImages}"
ItemsPanel="{DynamicResource ItemsPanelTemplate1}"
ItemTemplate="{DynamicResource RotatingItemTemplate}">
<ItemsControl.Resources>
<ItemsPanelTemplate x:Key="ItemsPanelTemplate1">
<VirtualizingStackPanel Orientation="Horizontal" IsItemsHost="True"/>
</ItemsPanelTemplate>
</ItemsControl.Resources>
</ItemsControl>
</ScrollViewer>
<StackPanel x:Name="stack2" Margin="25">
</StackPanel>
</Grid>
</Grid>
So "grid" and "grid1" are the elements, which can't accessed.
For tests i created a button "Bdrehen" to check, if I can access the flip from a button. This works perfect, it also works by left-clicking on it with the mouse. But not by code.
Heres the code, where I try to start it from code behind:
DataTemplate dt = (DataTemplate)FindResource("RotatingItemTemplate");
Storyboard sb = dt.Resources["Storyboard1_reversed"] as Storyboard;
BeginStoryboard(sb);
After starting I got an error, that the "grid" can't be found in the namespace of "KartenQuartett.MainWindow".
I can find my storyboards, but not my grids inside the datatemplate.
Anyone got an idea to fix it?

Here is your answer Calling Storyboard inside DataTemplate.
But keep in mind that doing that is not a good idea. Accessing any UI Element from your code behind is not a great idea, because it creates a tight coupling between your code and your UI.
I would suggest you to use MVVM instead, and to bind a boolean to run your storyboard as explained here: How to play Storyboard in ViewModel?

Focus goes to parent grid instead of textbox

I have a grid with a multiple rows and row definitions.
<Grid x:Name="RContentGrid" Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Name="RLabelRowDefinition" Height="40"></RowDefinition>
<RowDefinition Name="HeadingsRowDefinition" Height="40"></RowDefinition>
<RowDefinition Name="1RowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="2RowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="LineRowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="3RowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="4RowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="5RowDefinition" Height="Auto"></RowDefinition>
<RowDefinition Name="ErrorRowDefinition" Height="Auto"></RowDefinition>
</Grid.RowDefinitions>
...
One of the textboxes looks like this:
<TextBox x:Name="TextBoxRight1"
Grid.Row="2" Grid.Column="1" Margin="5"
Style="{DynamicResource g_TextInputWithLabelSmall}"
FontFamily="Arial Narrow" FontSize="16" />
The referred style looks like this:
<Style x:Key="g_TextInputWithLabelSmall" TargetType="{x:Type TextBox}">
<Setter Property="Helpers:ClientKeyboardController.AutoShowKeyboard" Value="True"/>
<Setter Property="Helpers:ClientKeyboardController.AutoHideKeyboard" Value="True"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="BorderBrush" Value="{StaticResource ListBorder}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="Padding" Value="2"/>
<Setter Property="AllowDrop" Value="true"/>
<Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid MinHeight="35" MinWidth="55">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectedStates">
<VisualState x:Name="CustomSelected">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="Black"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PART_ContentHost">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="textBlock">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="Black"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="CustomUnSelected">
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PART_ContentHost">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="#FF666666"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="#FFCCCCCC"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(Brush.RelativeTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="-45"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="textBlock">
<EasingDoubleKeyFrame KeyTime="0" Value="0.6"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="#33000000"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="ReadOnly">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="#33000000"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="MouseOver"/>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Unfocused"/>
<VisualState x:Name="Focused">
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PART_ContentHost">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="textBlock">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Offset)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="Bd">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="Black"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="Bd">
<EasingColorKeyFrame KeyTime="0" Value="Black"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="ValidationStates">
<VisualState x:Name="Valid"/>
<VisualState x:Name="InvalidFocused">
<Storyboard>
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="border">
<EasingThicknessKeyFrame KeyTime="0" Value="2"/>
</ThicknessAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="Bd">
<EasingThicknessKeyFrame KeyTime="0" Value="0"/>
</ThicknessAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="PART_ContentHost">
<EasingColorKeyFrame KeyTime="0" Value="#FFE3001B"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PART_ContentHost">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="InvalidUnfocused">
<Storyboard>
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="border">
<EasingThicknessKeyFrame KeyTime="0" Value="2"/>
</ThicknessAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="Bd">
<EasingThicknessKeyFrame KeyTime="0" Value="0"/>
</ThicknessAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="PART_ContentHost">
<EasingColorKeyFrame KeyTime="0" Value="#FFE3001B"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PART_ContentHost">
<EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid VerticalAlignment="Bottom" Margin="0,-75,0,50" Height="Auto">
<TextBlock x:Name="textBlock" TextWrapping="Wrap" IsHyphenationEnabled="True" Height="Auto" Style="{DynamicResource g_TextFieldLabel_14_100}" VerticalAlignment="Bottom" Margin="0,0,2,0" Width="Auto" Opacity="0.6"><Run Text="{TemplateBinding Tag}"/><Run Text=" "/><Run Foreground="#88000000" Text="{TemplateBinding ToolTip}"/></TextBlock>
</Grid>
<Border x:Name="border" BorderBrush="{DynamicResource ErrorColor}">
<Border x:Name="Bd" SnapsToDevicePixels="true" Background="White" BorderThickness="1">
<Border.BorderBrush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<LinearGradientBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform CenterY="0.5" CenterX="0.5"/>
<SkewTransform CenterY="0.5" CenterX="0.5"/>
<RotateTransform CenterY="0.5" CenterX="0.5" Angle="135"/>
<TranslateTransform/>
</TransformGroup>
</LinearGradientBrush.RelativeTransform>
<GradientStop Color="#FFCCCCCC" Offset="0.5"/>
<GradientStop Color="#FF666666" Offset="0.5"/>
</LinearGradientBrush>
</Border.BorderBrush>
<ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Template="{DynamicResource g_TextInput}" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="Black" Opacity="0.5"/>
</Border>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
The problem I face is that when the user clicks the textbox on the bottom half the focus goes to the grid above. Only when the user clicks on the upper half the focus comes to the textbox.
I tried the following:
- Tried changing the row definition of the rows
- Tried changing the height of the row
What am I missing here?

Thanks to Chris W. :)
By removing the margin on the Grid I was able to solve the problem:
<Grid VerticalAlignment="Bottom" Height="Auto">
<TextBlock x:Name="textBlock" TextWrapping="Wrap" IsHyphenationEnabled="True" Height="Auto" Style="{DynamicResource g_TextFieldLabel_14_100}" VerticalAlignment="Bottom" Margin="0,0,2,0" Width="Auto" Opacity="0.6"><Run Text="{TemplateBinding Tag}"/><Run Text=" "/><Run Foreground="#88000000" Text="{TemplateBinding ToolTip}"/></TextBlock>
</Grid>

Storyboard inside of a DataTrigger not triggering more than once on RaisePropertyChanged event

I am using the MVVM model.
I have a dependency property, a boolean, called "ResultOfUpdate". It is changed whenever a user tries to run a command.
In the setter for this dependency property I am calling "RaisePropertyChanged()" method on the property name.
It is bound to a DataTrigger like so :
<DataTrigger Binding="{Binding ResultOfUpdate}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Opacity)"
AutoReverse="True">
<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.1" Value="0.1"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.2" Value="0.2"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.3" Value="0.3"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.4" Value="0.4"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.5" Value="0.5"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.6" Value="0.6"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.7" Value="0.7"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.8" Value="0.8"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.9" Value="0.9"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.1" Value="1"/>
<DiscreteDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
</DataTrigger>
...
<TextBlock Style="{StaticResource statusStyle}"
Opacity="0" Text="Results updated!"
FontSize="10" FontFamily="Segoe UI"/>
I would like for each time this bool is set to true, the storyboard is played.
Confusingly, this storyboard is then triggered correctly the first time the user runs the command, updating the dependecy property to true.
Subsequent attempts have found that the dependency property setter code is entered, and the RaisePropertyChanged() method called - but the storyboard is not played again.
What have I done incorrectly here ?

You could possibly use an event trigger like this:
<StackPanel>
<TextBlock Text="I'm a text block" Name="theTextBlock"/>
<Button Name="BeginButton">Begin</Button>
<StackPanel.Triggers>
<EventTrigger RoutedEvent="Button.Click" SourceName="BeginButton">
<BeginStoryboard Name="MyBeginStoryboard">
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="theTextBlock"
Storyboard.TargetProperty="(TextBlock.Opacity)"
From="0.0" To="1.0" AutoReverse="True" Duration="0:0:1"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</StackPanel.Triggers>
</StackPanel>