Triggering an animation with a DataTrigger and binding

Question

I'm trying to make a grid "fade in" or "fade out" depending on the value of a property. The property is getting called, but the animation doesn't seem to be affecting the grid. My grid and triggers look like:

<Grid Background="White"
      Opacity="0">
  <Grid.Style>
    <Style TargetType="Grid">
      <Style.Triggers>
        <DataTrigger Binding="{Binding IsWaiting}"
                     Value="False">
          <DataTrigger.EnterActions>
            <BeginStoryboard Name="pickIn">
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                 From="0"
                                 To="1"
                                 Duration="0:0:0.8" />
              </Storyboard>
            </BeginStoryboard>
          </DataTrigger.EnterActions>
          <DataTrigger.ExitActions>
            <StopStoryboard BeginStoryboardName="pickIn" />
          </DataTrigger.ExitActions>
        </DataTrigger>
        <DataTrigger Binding="{Binding IsWaiting}"
                     Value="True">
          <DataTrigger.EnterActions>
            <BeginStoryboard Name="pickOut">
              <Storyboard>
                <DoubleAnimation Storyboard.TargetProperty="Opacity"
                                 From="1"
                                 To="0"
                                 Duration="0:0:0.8" />
              </Storyboard>
            </BeginStoryboard>
          </DataTrigger.EnterActions>
          <DataTrigger.ExitActions>
            <StopStoryboard BeginStoryboardName="pickOut" />
          </DataTrigger.ExitActions>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Grid.Style>
  <Grid.Triggers>
    <EventTrigger RoutedEvent="Loaded">
      <BeginStoryboard>
        <Storyboard>
          <DoubleAnimation Storyboard.TargetProperty="Opacity"
                           From="0"
                           To="1"
                           Duration="0:0:0.8" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Grid.Triggers>
  <!-- etc -->
</Grid>

My IsWaiting property looks like:

public bool IsWaiting{
  get { return _isWaiting; }
  set {
    _isWaiting = value;
    OnPropertyChanged("IsWaiting");
  }
}

There are no binding errors in the output log when the property changes. What am I doing wrong?

check out this post http://stackoverflow.com/questions/1013817/wpf-fade-animation?rq=1 — Rachel Gallen, Jan 17 '13 at 21:09
I just copy pasted your code and it works fine, the only thing I changed was the duration so I could see it fade (I used `0:0:5`) — sa_ddam213, Jan 17 '13 at 21:40
@sa_ddam213 Jeez, you're right. It turns out there was another animation that was interfering with it. I'll update my code above to include the interfering code. If you would like to post a reply I can mark it as the answer. The `` portion needs to be removed. — Daniel, Jan 17 '13 at 21:55

score 2 · Accepted Answer · answered Jan 17 '13 at 22:23

2

The <Grid.Triggers> are overruling your <Style.Triggers> you can replace the <Grid.Triggers> animation by just setting IsWaiting to true when the grid loads or set it to true bu default.

answered Jan 17 '13 at 22:23

sa_ddam213

42,848
7
101
110

Triggering an animation with a DataTrigger and binding

1 Answers1