2017-07-16 66 views
0

如何刪除TabItemWindow邊緣之間的空間。似乎還有一個標籤內容框周圍的邊框,這是不需要的。我怎樣才能刪除它?如何刪除第一個TabItem和Window邊緣之間的這個小空間?

enter image description here

這裏是我的XAML:

<Grid> 
     <TabControl Margin="0" ItemsSource="{Binding TabItems}" SelectedIndex="0"> 
      <TabControl.ItemContainerStyle> 
       <Style TargetType="TabItem"> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="TabItem"> 
           <Grid Name="Panel"> 
            <Border Name="Border" 
              Margin="0,0,-4,0"> 
            </Border> 
            <ContentPresenter x:Name="ContentSite" 
                  VerticalAlignment="Center" 
                  HorizontalAlignment="Center" 
                  ContentSource="Header" 
                  Margin="10,2"/> 
           </Grid> 
           <ControlTemplate.Triggers> 
            <Trigger Property="IsSelected" Value="True"> 
             <Setter TargetName="Panel" Property="Background" Value="Orange" /> 
            </Trigger> 
            <Trigger Property="IsSelected" Value="False"> 
             <Setter TargetName="Panel" Property="Background" Value="LightGray" /> 
            </Trigger> 
           </ControlTemplate.Triggers> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
        <Setter Property="Header" Value="{Binding Header}"/> 
        <Setter Property="Content" Value="{Binding Content}"/> 
       </Style> 
      </TabControl.ItemContainerStyle> 
     </TabControl> 
    </Grid> 

我嘗試添加一個邊框,並將其設置到-4保證金,但似乎並不奏效。任何幫助將不勝感激。謝謝!

回答

1

設置TabControlBorderThickness屬性設置爲0:

<TabControl Margin="0" 
      ItemsSource="{Binding TabItems}" 
      SelectedIndex="0" 
      BorderThickness="0"> 
    <!--The rest of your code here--> 
</TabControl> 

更新 - 調整標籤頭

這一個是有點棘手 - 這將需要更新TabControl的模板。你可以用手做,但TabControl的模板非常大,所以我推薦使用Blend開始。在Blend中打開項目,打開「對象和時間線」窗口,右鍵單擊您的TabControl,單擊編輯模板,然後選擇「編輯副本」。這將創建一個默認TabControl的模板的副本供您開始使用。

enter image description here

這將創建XAML的很多你。你會最終有一個風格的資源,它看起來是這樣的:

<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="2,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> 

找到TabPanel名爲「headerPanel」,其左邊距設置爲0,最後一件事,如果你使用的混合它應該設置您TabControl的風格來使用你的新風格,但如果沒有你需要確保你自己設定的風格:

Style="{StaticResource TabControlStyle1}" 
+0

,消除周圍的標籤控件的內容部分的邊界。大!第一個標籤項目也有點偏離邊緣的問題。不知何故可以調整嗎? – konrad

+0

@konrad - 查看更新後的答案。 –

相關問題