2014-02-19 4 views
0

У меня есть TabControl в MVV-приложении MVVM. Я создал шаблон для TabItem и TabControl на основе этого msdn topic. Я сделал некоторые изменения, и я добавил еще несколько состояний VisualStatManagers для поддержки состояний выбора и наведения на tabItems.WPF, TabControl, состояния выбора и наведения на TabItem

Вот мой шаблон ItemControl

<Style x:Key="TabItemStyle" TargetType="TabItem"> 
    <Setter Property="Background" Value="{StaticResource TabControlBackgroundBrush}" /> 
    <Setter Property="Foreground" Value="{StaticResource ForegroundBrush}" /> 
    <Setter Property="FontSize" Value="13.333" /> 
    <Setter Property="FontFamily" Value="Segoe UI" /> 
    <Setter Property="MinHeight" Value="30" /> 
    <Setter Property="Padding" Value="6,2" /> 
    <Setter Property="Margin" Value="0" /> 
    <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
    <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
    <Setter Property="BorderThickness" Value="1" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="TabItem"> 
       <Grid> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal" /> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Bd" Storyboard.TargetProperty="Fill"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TabItemHoverBackgroundBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Bd" Storyboard.TargetProperty="Stroke"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TabItemHoverBorderBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="contentControl"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource LightForegroundBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="DisabledVisualElement"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="SelectionStates"> 
          <VisualState x:Name="Unselected" /> 
          <VisualState x:Name="Selected"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BgSelected"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="contentControl"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Collapsed</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="contentControl1"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="contentControl1"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource LightForegroundBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="SelectedUnfocused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="BgSelected"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="contentControl"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource LightForegroundBrush}" /> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
         <VisualStateGroup x:Name="FocusStates"> 
          <VisualState x:Name="Focused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="FocusedVisualElement"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Unfocused" /> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Rectangle x:Name="Bd" Fill="{TemplateBinding Background}" Stroke="{StaticResource TabItemHoverBorderBrush}" StrokeThickness="1" /> 
        <Rectangle x:Name="BgSelected" Fill="{StaticResource TabItemSelectedBackgroundBrush}" Stroke="{StaticResource TabItemSelectedBorderBrush}" Visibility="Collapsed" /> 
        <ContentControl x:Name="contentControl" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Foreground="{TemplateBinding Foreground}"> 
         <ContentPresenter x:Name="ContentSite" 
          ContentSource="Header" 
          RecognizesAccessKey="True" 
          Margin="-1,-1,-1,0" 
          VerticalAlignment="Center"/> 
        </ContentControl> 
        <ContentControl x:Name="contentControl1" Visibility="Collapsed" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" Foreground="{StaticResource ForegroundBrush}"> 
         <ContentPresenter x:Name="ContentSite1" 
          ContentSource="Header" 
          RecognizesAccessKey="True" 
          Margin="-5,-5,-5,0" 
          VerticalAlignment="Center"/> 
        </ContentControl> 
        <Rectangle x:Name="FocusedVisualElement" IsHitTestVisible="False" Visibility="Collapsed" Stroke="{StaticResource TabControlPressedBorderBrush}" StrokeThickness="2"/> 
        <Rectangle x:Name="DisabledVisualElement" Fill="{StaticResource DisabledVisualElement}" Visibility="Collapsed"/> 
       </Grid> 
       <!--<ControlTemplate.Triggers> 
        <Trigger Property="IsSelected" Value="True"> 
         <Setter Property="Panel.ZIndex" Value="100" /> 
        </Trigger> 
       </ControlTemplate.Triggers>--> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

И мой шаблон TabControl

<Style x:Key="TabControlStyle" TargetType="TabControl"> 
    <Setter Property="Padding" Value="0" /> 
    <Setter Property="Background" Value="{StaticResource TabControlBackgroundBrush}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource TabControlBorderBrush}" /> 
    <Setter Property="HorizontalContentAlignment" Value="Left" /> 
    <Setter Property="VerticalContentAlignment" Value="Top" /> 
    <Setter Property="IsTabStop" Value="False" /> 
    <Setter Property="BorderThickness" Value="1" /> 
    <!--<Setter Property="ItemContainerStyle" Value="{StaticResource TabItemStyle}" />--> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="TabControl"> 
       <Grid KeyboardNavigation.TabNavigation="Local"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="*" /> 
        </Grid.RowDefinitions> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="ValidationStates"> 
          <VisualState x:Name="Valid" /> 
          <VisualState x:Name="InvalidUnfocused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="InvalidFocused"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <Visibility>Visible</Visibility> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsOpen" Storyboard.TargetName="validationTooltip"> 
             <DiscreteObjectKeyFrame KeyTime="0"> 
              <DiscreteObjectKeyFrame.Value> 
               <System:Boolean>True</System:Boolean> 
              </DiscreteObjectKeyFrame.Value> 
             </DiscreteObjectKeyFrame> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <!--Tabs strip--> 
        <TabPanel x:Name="HeaderPanel" Grid.Row="0" Panel.ZIndex="1" IsItemsHost="True" KeyboardNavigation.TabIndex="1" Background="Transparent" Margin="0,0,4,-1"/> 
        <!--Border of the content--> 
        <Border x:Name="Border" Grid.Row="1" KeyboardNavigation.TabNavigation="Local" KeyboardNavigation.DirectionalNavigation="Contained" KeyboardNavigation.TabIndex="2" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"> 
         <ScrollViewer x:Name="ScrollViewer" BorderThickness="0" Padding="{TemplateBinding Padding}" Style="{StaticResource ScrollViewerStyle}"> 
          <ContentPresenter Name="PART_SelectedContentHost" Margin="4" ContentSource="SelectedContent" /> 
         </ScrollViewer> 
        </Border> 
        <Border x:Name="ValidationErrorElement" Grid.Row="1" BorderBrush="{StaticResource ValidationErrorElement}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2" Visibility="Collapsed"> 
         <ToolTipService.ToolTip> 
          <ToolTip x:Name="validationTooltip" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" Template="{StaticResource ValidationToolTipTemplate}"> 
           <ToolTip.Triggers> 
            <EventTrigger RoutedEvent="Canvas.Loaded"> 
             <BeginStoryboard> 
              <Storyboard> 
               <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsHitTestVisible" Storyboard.TargetName="validationTooltip"> 
                <DiscreteObjectKeyFrame KeyTime="0"> 
                 <DiscreteObjectKeyFrame.Value> 
                  <System:Boolean>true</System:Boolean> 
                 </DiscreteObjectKeyFrame.Value> 
                </DiscreteObjectKeyFrame> 
               </ObjectAnimationUsingKeyFrames> 
              </Storyboard> 
             </BeginStoryboard> 
            </EventTrigger> 
           </ToolTip.Triggers> 
          </ToolTip> 
         </ToolTipService.ToolTip> 
         <Grid Background="{StaticResource TransparentBrush}" HorizontalAlignment="Right" Height="10" Margin="0,-4,-4,0" VerticalAlignment="Top" Width="10"> 
          <Path Data="M 1,0 L6,0 A 2,2 90 0 1 8,2 L8,7 z" Fill="{StaticResource ValidationErrorElement}" Margin="-1,3,0,0" /> 
          <Path Data="M 0,0 L2,0 L 8,6 L8,8" Fill="{StaticResource LightForegroundBrush}" Margin="-1,3,0,0" /> 
         </Grid> 
        </Border> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Моя проблема странное поведение моего шаблона в моем проекте. В VS2012 в дизайне xaml TabControl выглядит нормально. Но это полностью противоположно в скомпилированном приложении. Состояние выбора не работает. Фактически он представляет только нормальное состояние vsm. Я могу переключаться между содержимым TabItems, но состояние выделения и наведения (mouseOver) на вкладке не меняет цвет фона и границы. Как я сказал, только нормальное состояние VisualStateManager работает в выполненном приложении. Поскольку мы не можем отлаживать wpf vsm, я не могу понять, что вызывает эту проблему. Я думаю, что это проблема с VisualSateManager. Для тестирования я использовал одиночные окна с простым управлением вкладкой размещен ниже

<TabControl> 
    <TabItem Header="A">content A</TabItem> 
    <TabItem Header="B">content B</TabItem> 
    <TabItem Header="C">content C</TabItem> 
</TabControl> 

Если вы знаете, что вызывает проблемы с моим приложением, или вы встретились с подобной ситуацией с контролем в WPF мольбы помочь мне.

ответ

0

Я думаю, что ваша проблема может находится в VisualStateManager class. Если бы вы просмотрели эту страницу, вы бы увидели VisualStateManager.GoToState Method. Это метод, который вы,, должны позвонить, чтобы изменить текущее визуальное состояние ... вы не указали это ни в одном из своих кодов, поэтому я могу только предположить, что вы этого не вызвали. На связанной странице в MSDN этот метод:

Передает контроль между двумя состояниями. Используйте этот метод для перехода состояний на элемент управления с ControlTemplate.

Кроме того, вы можете найти описание в углубленных в VisualStateManager класса в ответ на VisualStateManager — showing mouseover state when control is focused

Смежные вопросы