1

Okay! I did a big edition :)

In a UserControl, I need to use interactions DataTrigger like below. The reason for is that I need a storyboard (MyStory) with a bound key-frame value. (Doing so was discussed here before.)

<UserControl x:Class="WpfApplication1.UserControl2"
             ...
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
             xmlns:local="clr-namespace:WpfApplication1">

    <UserControl.Resources>
        <Style x:Key="MyControlStyle" TargetType="UserControl">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Grid>
                            <Grid.Resources>
                                <Storyboard x:Key="MyStory">
                                    <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="brdBase">
                                        <SplineColorKeyFrame KeyTime="0:0:1" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:UserControl2}}, Path=SpecialColor}"/>
                                    </ColorAnimationUsingKeyFrames>
                                </Storyboard>
                            </Grid.Resources>

                            <Border x:Name="brdBase" BorderThickness="1" BorderBrush="Gray">
                                <TextBox Text="{Binding SpecialText}"/>
                            </Border>

                            <i:Interaction.Triggers>
                                <ei:DataTrigger Binding="{Binding SpecialText}" Value="Fire!">
                                    <ei:ControlStoryboardAction Storyboard="{StaticResource MyStory}" ControlStoryboardOption="Play"/>
                                </ei:DataTrigger>
                            </i:Interaction.Triggers>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="grdRoot" DataContext="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:UserControl2}}}">
        <UserControl Style="{DynamicResource MyControlStyle}"/>
    </Grid>

</UserControl>

C# code behind:

public partial class UserControl2 : UserControl
{
    #region ________________________________________  SpecialColor

    public Color SpecialColor
    {
        get { return (Color)GetValue(SpecialColorProperty); }
        set { SetValue(SpecialColorProperty, value); }
    }

    public static readonly DependencyProperty SpecialColorProperty =
        DependencyProperty.Register("SpecialColor",
                                    typeof(Color),
                                    typeof(UserControl2),
                                    new FrameworkPropertyMetadata(Colors.Red));
    #endregion


    #region ________________________________________  SpecialText

    public string SpecialText
    {
        get { return (string)GetValue(SpecialTextProperty); }
        set { SetValue(SpecialTextProperty, value); }
    }

    public static readonly DependencyProperty SpecialTextProperty =
        DependencyProperty.Register("SpecialText",
                                    typeof(string),
                                    typeof(UserControl2),
                                    new FrameworkPropertyMetadata(string.Empty));

    #endregion


    public UserControl2()
    {
        InitializeComponent();
    }
}

I expect the above code to play MyStory right after SpecialText set to "Fire!". To do so, we can use one of the following ways:

1.

<Grid>
    <local:UserControl2 SpecialText="Fire!"/>
</Grid>

2. Typing "Fire!" in the UserControl2 text-box at run-time.

The first way doesn't affect on GUI at design-time. I have some complicated UserControls in my app and really need to solve this issue. There are some DPs that call a storyboard to change layout of the UserControl animatedly. Obviously these storyboards involved with one or more bound key-frames. So I must run my app more and more to check it :(

Community
  • 1
  • 1
Mehdi
  • 2,194
  • 2
  • 25
  • 39
  • when you say "using DataTrigger" are you talking about binding to a property in the ViewModel in a MVVM scenario without having a DP in the UserControl? – Viv Apr 14 '13 at 12:13
  • Nope, I believe that a UserControl GUI related DP should not be defined in the VM. I had a discussion [here](http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/b752245a-4a69-4f42-9914-725d8168d392) about it. **Summary:** _The View of the UserControl must contain dependency properties in order for the parent control to use them and to be set and or seen in the property designer. This is just how it works out of the box._ – Mehdi Apr 14 '13 at 15:11
  • @Viv I'm so sorry! I created a new simple app to test usual DataTriggers. They work as expected. I've some problem with the DataTrigger in the _Microsoft.Expression.Interactions.dll_. **The question edited totally.** – Mehdi Apr 14 '13 at 16:47
  • Okay! I got an acceptable answer [here](http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/3d1b27bd-89c0-4a5f-a247-7e703f28e0ab). Now I'm curious to know whether any XAML only solution exists. – Mehdi Apr 15 '13 at 06:08

0 Answers0