블렌드를 사용하지 않고 선택된 탭 이벤트로 그리드 여백에 애니메이션을 적용합니다.

Question

여러 개의 탭이있는 프로젝트가 있습니다. 사용자가 탭을 선택하면 그 탭 안에있는 격자를 밖으로 밀어 내고 싶습니다. 그리드 마진을 변경하여이를 달성 할 수 있다고 생각합니다. 사실 실제로 작동하는 솔루션이 있지만 Blend의 DLL 2 개가 포함되어 있어야합니다. 나는 블렌드를 사용하지 않고 같은 효과가 있다고 생각 하겠지만 그것을 이해할 수는 없다. 아래는 스토리 보드이며 tabItems 내가 교체해야하는 부분입니다하지만 난 확신 할 수 없다

<i:Interaction.Triggers> 
    <ei:DataTrigger Binding="{Binding SelectedIndex, ElementName=tabControl}" Value="0"> 
     <ei:ControlStoryboardAction Storyboard="{StaticResource tabAdminSlide}"/> 
    </ei:DataTrigger> 
</i:Interaction.Triggers> 

처럼 보이는

<Storyboard x:Key="tabAdminSlide"> 
     <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="grid1"> 
      <EasingThicknessKeyFrame KeyTime="0" Value="400,0,0,0"/> 
      <EasingThicknessKeyFrame KeyTime="0:0:0.5" Value="0,0,0,0"> 
       <EasingThicknessKeyFrame.EasingFunction> 
        <ExponentialEase EasingMode="EaseOut"/> 
       </EasingThicknessKeyFrame.EasingFunction> 
      </EasingThicknessKeyFrame> 
     </ThicknessAnimationUsingKeyFrames> 
    </Storyboard> 

    <TabItem Header="Run as Admin" x:Name="tabAdmin" Background="LightBlue"> 
     <i:Interaction.Triggers> 
      <ei:DataTrigger Binding="{Binding SelectedIndex, ElementName=tabControl}" Value="0"> 
       <ei:ControlStoryboardAction Storyboard="{StaticResource tabAdminSlide}"/> 
      </ei:DataTrigger> 
     </i:Interaction.Triggers> 
      <Grid Height="Auto" x:Name="grid1" Width="Auto"> 
       <Grid.Background> 
        <LinearGradientBrush StartPoint="-0.002,0.498" EndPoint="1.084,0.498"> 
         <GradientStop Color="LightBlue" Offset="0.446" /> 
         <GradientStop Color="White" Offset="1" /> 
        </LinearGradientBrush> 
       </Grid.Background> 
       <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="40,179,0,0" Name="button1" VerticalAlignment="Top" Width="75" Grid.ColumnSpan="2" /> 
      </Grid> 
    </TabItem> 

을 XAML. 도움이 될 것입니다

고마워요.

Answer 1

당신은

<TabItem.Triggers> 
    <EventTrigger RoutedEvent="Selector.Selected"> 
     <BeginStoryboard Storyboard="{StaticResource tabAdminSlide}" /> 
    </EventTrigger> 
</TabItem.Triggers> 

대신

<i:Interaction.Triggers> 
    <ei:DataTrigger Binding="{Binding SelectedIndex, ElementName=tabControl}" Value="0"> 
     <ei:ControlStoryboardAction Storyboard="{StaticResource tabAdminSlide}"/> 
    </ei:DataTrigger> 
</i:Interaction.Triggers>