如何根據ViewModel屬性值添加淡入/淡出動畫？

Question

我有一個視圖模型暴露的字符串屬性PageToolBarVisible可以是真正或假：

private string _pageToolBarVisible; 
public string PageToolBarVisible 
{ 
    get 
    { 
     return _pageToolBarVisible; 
    } 

    set 
    { 
     _pageToolBarVisible = value; 
     OnPropertyChanged("PageToolBarVisible"); 
    } 
} 

然後在我的查看我有這個DataTrigger這顯示或隱藏相應的工具欄：

<Style x:Key="PageToolBarStyle" TargetType="Border"> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding PageToolBarVisible}" Value="false"> 
      <Setter Property="Visibility" Value="Collapsed"/> 
     </DataTrigger> 
    </Style.Triggers> 
</Style> 

<Border Style="{StaticResource PageToolBarStyle}" 
    DockPanel.Dock="Bottom" Padding="5 5 5 0" Background="#eee"> 
    <Grid Background="#eee"> 
     ... 
    </Grid> 
</Border> 

我現在該如何添加動畫使：

• 當視圖模型屬性從真改爲假，則工具欄淡出
• 當視圖模型屬性從false改爲true，工具欄淡入

我想我不得不這樣的事情添加到我的風格，但我不知道如何或在哪裏：

<BeginStoryboard> 
<Storyboard> 
    <DoubleAnimation 
    Storyboard.TargetName="PageToolBar" 
    Storyboard.TargetProperty="(TextBlock.Opacity)" 
    From="0.0" To="1.0" Duration="0:0:3"/> 
</Storyboard> 
</BeginStoryboard> 

Answer 1

你可以把你的BeginStoryboard裏面DataTrigger.EnterActions

<DataTrigger Binding="{Binding PageToolBarVisible}" Value="false"> 
    <DataTrigger.EnterActions> 
     <BeginStoryboard> 
      <Storyboard> 
       <DoubleAnimation 
       Storyboard.TargetName="PageToolBar" 
       Storyboard.TargetProperty="(TextBlock.Opacity)" 
       From="0.0" To="1.0" Duration="0:0:3"/> 
      </Storyboard> 
     </BeginStoryboard> 
    </DataTrigger.EnterActions> 

    <DataTrigger.ExitActions> 
     <BeginStoryboard> 
      <Storyboard> 
       <DoubleAnimation 
        Storyboard.TargetName="PageToolBar" 
        Storyboard.TargetProperty="(TextBlock.Opacity)" 
        From="1.0" To="0.0" Duration="0:0:3"/> 
      </Storyboard> 
     </BeginStoryboard> 
    </DataTrigger.ExitActions> 
</DataTrigger>