如何缩进TabControl的TabStrip [英] How to Indent TabStrip of a TabControl

问题描述

嗨

我有一个带有网格的窗口，其中包含一些标签和文本框，然后是一个TabControl.为了改善布局，我需要在屏幕上移动".从左上角到右侧的TabStrip.

I have a Window with a Grid containing some Labels and TextBoxes and then a TabControl. In order to improve the Layout I need to "move" the TabStrip from the top left corner to the right.

我知道，通过使用TabStripPlacement属性，我可以将TabStrip放置在TabControl的顶部，左侧，右侧或底部.但我想将其保持在顶部，仅约.左角右边120像素.

I know that by using the TabStripPlacement property I can place the TabStrip on top, left, right or at the bottom of the TabControl. But I want to keep it at the top, just ca. 120 px right of the left corner. 

有人可以帮助我实现这一目标吗?

Can anybody help me to achieve this?

谢谢.

彼得

推荐答案

您需要修改TabControl的控件模板才能更改TabPanel元素的边距.您没有可以设置的属性来完成此操作.

You need to modify the control template of the TabControl to be able to change the margin of the TabPanel element. There is no property you can set to accomplish this.

在Visual Studio 2012+或Blend中的设计模式下，右键单击TabControl，然后选择编辑模板".选项，然后选择编辑副本..."选项.这会将默认模板复制到您的XAML标记中，然后您可以进行修改 TabPanel的边距:

Right-click on the TabControl in design mode in Visual Studio 2012+ or Blend and select the "Edit template" option and then the "Edit a copy…" option. This will copy the default template into your XAML markup and you can then modify the margins of the TabPanel:

<Window x:Class="WpfApplication1.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication1"
        mc:Ignorable="d"
        Title="Window7" Height="300" Width="300">
    <Window.Resources>
        <SolidColorBrush x:Key="TabItem.Selected.Background" Color="#FFFFFF"/>
        <SolidColorBrush x:Key="TabItem.Selected.Border" Color="#ACACAC"/>
        <Style x:Key="TabControlStyle1" TargetType="{x:Type TabControl}">
            <Setter Property="Padding" Value="2"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="Background" Value="{StaticResource TabItem.Selected.Background}"/>
            <Setter Property="BorderBrush" Value="{StaticResource TabItem.Selected.Border}"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabControl}">
                        <Grid x:Name="templateRoot" ClipToBounds="true" SnapsToDevicePixels="true" KeyboardNavigation.TabNavigation="Local">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition x:Name="ColumnDefinition0"/>
                                <ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition x:Name="RowDefinition0" Height="Auto"/>
                                <RowDefinition x:Name="RowDefinition1" Height="*"/>
                            </Grid.RowDefinitions>
                            <TabPanel x:Name="headerPanel" Background="Transparent" Grid.Column="0" IsItemsHost="true" Margin="20,2,2,0" Grid.Row="0" KeyboardNavigation.TabIndex="1" Panel.ZIndex="1"/>
                            <Border x:Name="contentPanel" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="0" KeyboardNavigation.DirectionalNavigation="Contained" Grid.Row="1" KeyboardNavigation.TabIndex="2" KeyboardNavigation.TabNavigation="Local">
                                <ContentPresenter x:Name="PART_SelectedContentHost" ContentSource="SelectedContent" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="TabStripPlacement" Value="Bottom">
                                <Setter Property="Grid.Row" TargetName="headerPanel" Value="1"/>
                                <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                                <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                                <Setter Property="Height" TargetName="RowDefinition1" Value="Auto"/>
                                <Setter Property="Margin" TargetName="headerPanel" Value="2,0,2,2"/>
                            </Trigger>
                            <Trigger Property="TabStripPlacement" Value="Left">
                                <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                                <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                                <Setter Property="Grid.Column" TargetName="headerPanel" Value="0"/>
                                <Setter Property="Grid.Column" TargetName="contentPanel" Value="1"/>
                                <Setter Property="Width" TargetName="ColumnDefinition0" Value="Auto"/>
                                <Setter Property="Width" TargetName="ColumnDefinition1" Value="*"/>
                                <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                                <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                                <Setter Property="Margin" TargetName="headerPanel" Value="2,2,0,2"/>
                            </Trigger>
                            <Trigger Property="TabStripPlacement" Value="Right">
                                <Setter Property="Grid.Row" TargetName="headerPanel" Value="0"/>
                                <Setter Property="Grid.Row" TargetName="contentPanel" Value="0"/>
                                <Setter Property="Grid.Column" TargetName="headerPanel" Value="1"/>
                                <Setter Property="Grid.Column" TargetName="contentPanel" Value="0"/>
                                <Setter Property="Width" TargetName="ColumnDefinition0" Value="*"/>
                                <Setter Property="Width" TargetName="ColumnDefinition1" Value="Auto"/>
                                <Setter Property="Height" TargetName="RowDefinition0" Value="*"/>
                                <Setter Property="Height" TargetName="RowDefinition1" Value="0"/>
                                <Setter Property="Margin" TargetName="headerPanel" Value="0,2,2,2"/>
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <StackPanel>
        <TabControl Style="{StaticResource TabControlStyle1}">
            <TabItem Header="1"></TabItem>
            <TabItem Header="2"></TabItem>
            <TabItem Header="3"></TabItem>
        </TabControl>
    </StackPanel>
</Window>

希望有帮助.

Hope that helps.

请记住，通过将有用的帖子标记为答案来关闭话题，然后在遇到新问题时开始新话题.请不要在同一线程中问几个问题.

Please remember to close your threads by marking helpful posts as answer and then start a new thread if you have a new question. Please don't ask several questions in the same thread.

这篇关于如何缩进TabControl的TabStrip的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！