2011-12-16 52 views
1

我发明了一个metro风格的选项卡控件,它构建为包含两个级别的选项卡,就像Zune媒体库一样;一个大,一个小于那个。当您更改第一级的选项卡时,它工作正常并且动画正确。两个选项卡中的每一个都包含另一个使用相同模板的TabControl,但是当您更改选项卡时,即使是选项卡动画也是如此;如容器TabControl的整个ContentPresenter动画而不是子TabControl的ContentPresenter。如果是有道理的:P 这里的风格:XAML样式 - 嵌套tabcontrols触发海誓山盟的动画

<Style x:Key="MetroTabControl" TargetType="{x:Type TabControl}"> 
    <Setter Property="SnapsToDevicePixels" Value="True" /> 
    <Setter Property="Background" Value="White" /> 
    <Setter Property="BorderThickness" Value="0" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type TabControl}"> 
       <ControlTemplate.Resources> 
        <Storyboard x:Key="TabSelectionChangedStoryboard"> 
         <DoubleAnimation Storyboard.TargetName="TabControlContent" 
        Storyboard.TargetProperty="Opacity" 
        To="100" 
        From="0" 
        FillBehavior="HoldEnd" 
        Duration="0:0:45.0" /> 
         <ThicknessAnimation Storyboard.TargetName="TabControlContent" 
              Storyboard.TargetProperty="Margin" 
              From="0,25,0,-25" 
              To="0,0,0,0" 
              FillBehavior="HoldEnd" 
              Duration="0:0:0.3"> 

         </ThicknessAnimation> 
        </Storyboard> 
       </ControlTemplate.Resources> 
       <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 
        <Border> 
         <TabPanel 
           IsItemsHost="True"> 
         </TabPanel> 
        </Border> 
        <Border x:Name="BorderPresenter" BorderThickness="0" 
           Grid.Row="1" 
           BorderBrush="White" 
           Background="White"> 
         <ContentPresenter x:Name="TabControlContent" ContentSource="SelectedContent" Margin="0" > 
         </ContentPresenter> 
        </Border> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <EventTrigger RoutedEvent="SelectionChanged"> 
         <BeginStoryboard Storyboard="{StaticResource TabSelectionChangedStoryboard}" /> 
        </EventTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
+0

你解决问题? – icebat 2011-12-23 06:51:32

回答

1

这是因为SelectionChanged事件冒泡于母公司的TabControl,并触发其动画。作为一种可能的简单的解决方案,你可以添加SelectionChanged事件处理于母公司的TabControl,并检查它是否是此事件的原始来源:

<TabControl SelectionChanged="RootTabControl_SelectionChanged"> 
    <TabItem> 
     <TabControl> 
      <!-- TabItems here --> 
     </TabControl> 
    </TabItem> 
</TabControl> 

而且here`s代码:

private void RootTabControl_SelectionChanged(object sender, SelectionChangedEventArgs e) 
{ 
    if (sender != e.OriginalSource) 
     e.Handled = true; 
}