WPF TabItem Header 自定义样式

最新推荐文章于 2024-05-22 10:30:00 发布

Dark-Source

最新推荐文章于 2024-05-22 10:30:00 发布

阅读量1w

点赞数 1

Visual Basic.Net 同时被 2 个专栏收录

12 篇文章 0 订阅

订阅专栏

WPF

10 篇文章 0 订阅

订阅专栏

1 外部边框

<Style TargetType="{x:TypeTabItem}">

           <Setter Property="Template">
               <Setter.Value>
                   <ControlTemplate TargetType="{x:TypeTabItem}">
                       <Grid>
                           <Border Name="Border"  Margin="0,0,0,0" Background="Transparent" BorderBrush="Black"  BorderThickness="1,1,1,1" CornerRadius="0,0,15,0" Width="23">
                               <ContentPresenterx:Name="ContentSite"  VerticalAlignment="Center"  HorizontalAlignment="Center" ContentSource="Header" Margin="4,12,4,4" RecognizesAccessKey="True">
                                   <ContentPresenter.LayoutTransform>
                                       <RotateTransform Angle="90" />
                                   </ContentPresenter.LayoutTransform>
                               </ContentPresenter>
                           </Border>
                       </Grid>
                       <ControlTemplate.Triggers>
                           <Trigger Property="IsSelected"Value="True">
                               <Setter Property="Panel.ZIndex" Value="100"/>
                               <Setter TargetName="Border" Property="Background">
                                   <Setter.Value>
                                       <LinearGradientBrush EndPoint="0.5,1"StartPoint="0.5,0">
                                           <GradientStop Color="#d0e5f7" Offset="0"/>
                                           <GradientStop Color="#48b0e2" Offset="1"/>
                                       </LinearGradientBrush>
                                   </Setter.Value>
                               </Setter>
                               <Setter TargetName="Border"Property="BorderThickness" Value="1,1,1,0" />
                           </Trigger>
                           <Trigger Property="IsEnabled"Value="False">
                               <Setter TargetName="Border" Property="Background"Value="Silver"/>
                               <Setter TargetName="Border" Property="BorderBrush"Value="Black" />
                               <Setter Property="Foreground" Value="DarkGray"/>
                           </Trigger>
                       </ControlTemplate.Triggers>
                   </ControlTemplate>
               </Setter.Value>
           </Setter>
       </Style>

结果如图:

2 内部边框

<TabControl Grid.Column="1"  Name="control"  TabStripPlacement="Right"Width="400" >

 <TabControl.Resources>
    <Style TargetType="{x:TypeTabItem}">
         <SetterProperty="BorderThickness" Value="0"/>
             <SetterProperty="Padding" Value="0" />
                 <SetterProperty="HeaderTemplate">
                    <Setter.Value>
                        <DataTemplate>
                             <Borderx:Name="grid"  CornerRadius="0,0,15,0"Background="Silver" >
                                <ContentPresenterContent="{TemplateBinding Content}" Margin="4,12,4,4">
                                 <ContentPresenter.LayoutTransform>
                                       <RotateTransform Angle="90"/>
                                  </ContentPresenter.LayoutTransform>
                                  </ContentPresenter>
                              </Border>
                             <DataTemplate.Triggers>
                                <DataTriggerBinding="{Binding RelativeSource={RelativeSourceMode=FindAncestor,AncestorType={x:Type TabItem}},Path=IsSelected}"Value="True">
                                    <Setter TargetName="grid" Property="Background">
                                         <Setter.Value>
                                             <LinearGradientBrush EndPoint="0.5,1"StartPoint="0.5,0">
                                              <GradientStop Color="#d0e5f7" Offset="0"/>
                                               <GradientStop Color="#48b0e2" Offset="1"/>
                                                 </LinearGradientBrush>
                                             </Setter.Value>
                                        </Setter>
                                    </DataTrigger>
                                </DataTemplate.Triggers>
                           </DataTemplate>
                        </Setter.Value>
                   </Setter>
                </Style>
           </TabControl.Resources>

   </TabControl>

结果如图：