Question

我有一个绑定到ViewModel的TabControl。我想设置自动生成的TabPanel的边距，但我无法这样做，因为我认为样式是通过TabControl的实现内联设置的......

这是我的风格......

<TabControl.Resources>
    <Style TargetType="{x:Type TabPanel}">
        <Setter Property="Margin" Value="14,0,0,0" />
    </Style>
</TabControl.Resources>

使用Visual Studio的Live Property Explorer生成的样式就像这样...

更新1：

以下是ItemTemplate的XAML，它自己生成TabPanel：

<TabControl.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition MaxWidth="150" />
            </Grid.ColumnDefinitions>
            <Image Grid.Row="0" Grid.Column="0" Source="{Binding ImageUri}" 
                   Height="25" Width="35" Margin="0,0,0,10" />
            <TextBlock Grid.Row="1" Grid.Column="0" Text="{Binding TestName}" TextAlignment="Center" 
                       TextWrapping="Wrap" FontFamily="Open Sans" FontWeight="Regular" FontSize="14" />
        </Grid>
    </DataTemplate>
</TabControl.ItemTemplate>

Answer 1

您需要覆盖TabControl模板以自定义外观。在这种情况下，您将负责设计模板，但也可以按照您喜欢的方式进行自定义。

示例模板取自MSDN

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="" Width="500" Height="500">
<Window.Resources>

    <Style TargetType="{x:Type TabControl}">
        <Setter Property="OverridesDefaultStyle"
                Value="True" />
        <Setter Property="SnapsToDevicePixels"
                Value="True" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabControl}">
                    <Grid KeyboardNavigation.TabNavigation="Local">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetName="Border"
                                                                      Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFAAAAAA" />
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <TabPanel x:Name="HeaderPanel"
                                  Grid.Row="0"
                                  Panel.ZIndex="1"
                                  Margin="14,0,4,0"
                                  IsItemsHost="True"
                                  KeyboardNavigation.TabIndex="1"
                                  Background="Transparent" />
                        <Border x:Name="Border"
                                Grid.Row="1"
                                BorderThickness="1"
                                CornerRadius="2"
                                KeyboardNavigation.TabNavigation="Local"
                                KeyboardNavigation.DirectionalNavigation="Contained"
                                KeyboardNavigation.TabIndex="2">
                            <Border.Background>
                                <LinearGradientBrush EndPoint="0.5,1"
                                                     StartPoint="0.5,0">
                                    <GradientStop Color="{DynamicResource ContentAreaColorLight}" Offset="0" />
                                    <GradientStop Color="{DynamicResource ContentAreaColorDark}" Offset="1" />
                                </LinearGradientBrush>
                            </Border.Background>
                            <Border.BorderBrush>
                                <SolidColorBrush Color="{DynamicResource BorderMediumColor}" />
                            </Border.BorderBrush>
                            <ContentPresenter x:Name="PART_SelectedContentHost" Margin="4" ContentSource="SelectedContent" />
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>
<TabControl ItemsSource="{Binding Path=Items}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition MaxWidth="150" />
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Row="1" Grid.Column="0" Text="{Binding .}" TextAlignment="Center"
                           TextWrapping="Wrap" FontFamily="Open Sans" FontWeight="Regular" FontSize="14" />
            </Grid>
        </DataTemplate>
    </TabControl.ItemTemplate>
</TabControl>

如何在xaml中覆盖内联样式

1 个答案: