无法设置 TabControl 样式

Question

在我的应用程序中，我最近尝试在外观方面对其进行优化，因此我尝试使用MahApps.Metro。但是我遇到了一些障碍。

在我的应用程序中，我有一个tabcontrol，我使用了一个style，如下所示；

<Page.Resources>
    <ResourceDictionary>

      <ResourceDictionary.MergedDictionaries>
         <!--Resource dictionary for mahapps. -->
      </ResourceDictionary.MergedDictionaries>

      <Style TargetType="{x:Type TabItem}">
         <Setter Property="HeaderTemplate">
             <Setter.Value>
                 <DataTemplate> 
                     <StackPanel Orientation="Horizontal">
                        <!-- FormName is the name of the ViewModel-->
                        <TextBlock Text="{Binding FormName}" VerticalAlignment="Center" Margin="2" /> 
                     </StackPanel>
                     <DataTemplate.Triggers>
                        <DataTrigger Binding="{Binding IsValid}"
                                 Value="False">
                        </DataTrigger>
                     </DataTemplate.Triggers>
                 </DataTemplate>
             </Setter.Value>                    
         </Setter>                
     </Style>
 </ResourceDictionary>
</Page.Resources>

<!-- The itemsource that is bound to is a ObservableCollection of Forms that are used to validate for a Progress bar, It uses the ViewModels-->
<TabControl x:Name="tabcontrol" 
            Grid.Row="1"  
            ItemsSource="{Binding Forms}"
            SelectedIndex="0" BorderBrush="Black" />

显然，这不是使用MahApps.Metro tabcontrol。但是，在tabcontrol 的style 中，我将TargetType 更改为以下内容，但这会导致Page 中的所有内容增加其大小并将两个选项卡内容有效地合并为一个；

<Style TargetType="{x:Type Controls:MetroTabItem}"  BasedOn="{StaticResource MetroTabItem}">

如果能帮助我实施 MahApps.Meto tab control 并清除我做错的事情，我们将不胜感激。干杯。

Answer 1

你得到所有混淆结果的原因是因为MetroTabItem 没有自己的Template 我认为而是使用TabItem 样式覆盖。您最初的方法是正确的。

我不知道您的实际样式是如何配置的（您在此处粘贴的 ResourceDictionary 的剪切粘贴不会按原样编译）但是如果您使用这个资源块（并添加您的资源），它应该管用。在这里测试和工作。

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
        <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
        <ResourceDictionary>
            <Style TargetType="{x:Type TabItem}" BasedOn="{StaticResource {x:Type TabItem}}">
                <Setter Property="HeaderTemplate">
                    <Setter.Value>
                        <DataTemplate >
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="{Binding FormName}" VerticalAlignment="Center" Margin="2" />
                            </StackPanel>
                            <DataTemplate.Triggers>
                                <DataTrigger Binding="{Binding IsValid}" Value="False" />
                            </DataTemplate.Triggers>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

注意：VS 会报错“在属性表达式中检测到循环”。这是真的，但工作正常。您可以忽略该错误。该解决方案将构建并运行良好。

Answer 2

基于 Maverik 上面所说的（没有声誉只添加评论...）尝试使用 BasedOn="{StaticResources MetroTabItem}" 来防止循环投诉。

<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" />
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
    <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
    <ResourceDictionary>
        <Style TargetType="{x:Type TabItem}" BasedOn="{StaticResource MetroTabItem}">
            <Setter Property="HeaderTemplate">
                <Setter.Value>
                    <DataTemplate >
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding FormName}" VerticalAlignment="Center" Margin="2" />
                        </StackPanel>
                        <DataTemplate.Triggers>
                            <DataTrigger Binding="{Binding IsValid}" Value="False" />
                        </DataTemplate.Triggers>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>
</ResourceDictionary.MergedDictionaries>