WPF vertical TabItemボーダーの問題

Question

私はWPFから始まっています.TabControlをLeftおよびRotating TabItemのテキストヘッダーに90度表示した後、視覚的な問題に直面しています。

問題は、TabItemヘッダーの上端が表示されていないことです。 コードはこれです：選択したときに、デフォルトのタブ項目によって

<Window x:Class="WPF_Exemplo1.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="675" Width="900" ResizeMode="NoResize" WindowStyle="None" WindowState="Maximized"> 
    <Grid> 
     <TabControl Margin="12,85.74,98.601,167.193" Name="tabControl1" TabStripPlacement="Left"> 
      <TabItem Name="tabItem1" FlowDirection="LeftToRight" FontSize="22" Height="60"> 
       <TabItem.Header> 
        <StackPanel Orientation="Horizontal"> 
         <Image Height="40" Width="40" Margin="20,0,0,0" VerticalAlignment="Center"></Image> 
         <TextBlock Margin="25,0,25,0" VerticalAlignment="Center">Item 1</TextBlock> 
        </StackPanel> 
       </TabItem.Header> 
       <TabItem.LayoutTransform> 
        <TransformGroup> 
         <RotateTransform Angle="-90"/> 
        </TransformGroup> 
       </TabItem.LayoutTransform> 
       <Grid /> 
      </TabItem> 
     </TabControl> 
    </Grid> 
</Window> 

Answer 1

は彼らの右の枠線を非表示にします。これにより、タブのコンテンツにブレンドされた視覚的な外観が作成されます。しかし、タブ項目を90度回転させたので、この目的は果たされなくなりました。正しい視覚反応を得るには、TabItemのControlTemplateを編集する必要があります。これを行う最も簡単な方法は、テンプレートのコピーから開始することです（Blendを使用している場合は、単にテンプレートのコピーを編集することができます）。 Blendをお持ちでない場合、私のバージョンのBlend（下記）で作成されたデフォルトのリソースを使用することができます。その後、正しい境界線のプロパティを編集して、必要なビジュアルを作成します。

<Window.Resources> 
    <Style x:Key="TabItemFocusVisual"> 
     <Setter Property="Control.Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Rectangle SnapsToDevicePixels="true" Margin="3,3,3,1" Stroke="Black" StrokeDashArray="1 2" StrokeThickness="1"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#8C8E94"/> 
    <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0"> 
     <GradientStop Color="#F3F3F3" Offset="0"/> 
     <GradientStop Color="#EBEBEB" Offset="0.5"/> 
     <GradientStop Color="#DDDDDD" Offset="0.5"/> 
     <GradientStop Color="#CDCDCD" Offset="1"/> 
    </LinearGradientBrush> 
    <LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0"> 
     <GradientStop Color="#EAF6FD" Offset="0.15"/> 
     <GradientStop Color="#D9F0FC" Offset=".5"/> 
     <GradientStop Color="#BEE6FD" Offset=".5"/> 
     <GradientStop Color="#A7D9F5" Offset="1"/> 
    </LinearGradientBrush> 
    <SolidColorBrush x:Key="TabItemSelectedBackground" Color="#F9F9F9"/> 
    <SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#3C7FB1"/> 
    <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/> 
    <SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/> 
    <Style x:Key="TabItemStyle1" TargetType="{x:Type TabItem}"> 
     <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/> 
     <Setter Property="Foreground" Value="Black"/> 
     <Setter Property="Padding" Value="6,1,6,1"/> 
     <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/> 
     <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
     <Setter Property="VerticalContentAlignment" Value="Stretch"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type TabItem}"> 
        <Grid SnapsToDevicePixels="true"> 
         <Border x:Name="Bd" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" Padding="{TemplateBinding Padding}"> 
          <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" x:Name="Content" VerticalAlignment="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" ContentSource="Header" RecognizesAccessKey="True"/> 
         </Border> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="true"> 
          <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemHotBackground}"/> 
         </Trigger> 
         <Trigger Property="IsSelected" Value="true"> 
          <Setter Property="Panel.ZIndex" Value="1"/> 
          <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemSelectedBackground}"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="false"/> 
           <Condition Property="IsMouseOver" Value="true"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource TabItemHotBorderBrush}"/> 
         </MultiTrigger> 
         <Trigger Property="TabStripPlacement" Value="Bottom"> 
          <Setter Property="BorderThickness" TargetName="Bd" Value="1,0,1,1"/> 
         </Trigger> 
         <Trigger Property="TabStripPlacement" Value="Left"> 
          <Setter Property="BorderThickness" TargetName="Bd" Value="1,1,0,1"/> 
         </Trigger> 
         <Trigger Property="TabStripPlacement" Value="Right"> 
          <Setter Property="BorderThickness" TargetName="Bd" Value="0,1,1,1"/> 
         </Trigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Top"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-2,-2,-1"/> 
          <Setter Property="Margin" TargetName="Content" Value="0,0,0,1"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Bottom"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-1,-2,-2"/> 
          <Setter Property="Margin" TargetName="Content" Value="0,1,0,0"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Left"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-2,-2,-1,-2"/> 
          <Setter Property="Margin" TargetName="Content" Value="0,0,1,0"/> 
         </MultiTrigger> 
         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsSelected" Value="true"/> 
           <Condition Property="TabStripPlacement" Value="Right"/> 
          </MultiTrigger.Conditions> 
          <Setter Property="Margin" Value="-1,-2,-2,-2"/> 
          <Setter Property="Margin" TargetName="Content" Value="1,0,0,0"/> 
         </MultiTrigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemDisabledBackground}"/> 
          <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource TabItemDisabledBorderBrush}"/> 
          <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources>