246 lines
12 KiB
XML
246 lines
12 KiB
XML
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||
|
||
|
||
<LinearGradientBrush x:Key="TabItemSelectedBgBrush" StartPoint="0,0" EndPoint="0,1">
|
||
<GradientStop Color="#348EF6" Offset="0"/>
|
||
<!-- 浅蓝 -->
|
||
<GradientStop Color="#4AA2FF" Offset="1"/>
|
||
<!-- 深蓝 -->
|
||
</LinearGradientBrush>
|
||
|
||
<!-- 悬浮态背景 -->
|
||
<SolidColorBrush x:Key="TabItemHoverBgBrush" Color="#EFF6FF"/>
|
||
|
||
<!-- 默认态背景 -->
|
||
<SolidColorBrush x:Key="TabItemNormalBgBrush" Color="Transparent"/>
|
||
|
||
<!-- 选中态文字色 -->
|
||
<SolidColorBrush x:Key="TabItemSelectedForegroundBrush" Color="White"/>
|
||
|
||
<!-- 悬浮态文字色 -->
|
||
<SolidColorBrush x:Key="TabItemHoverForegroundBrush" Color="#348EF6"/>
|
||
|
||
<!-- 默认态文字色 -->
|
||
<SolidColorBrush x:Key="TabItemNormalForegroundBrush" Color="#666666"/>
|
||
|
||
<!-- 下划线/边框色 -->
|
||
<SolidColorBrush x:Key="TabItemUnderlineBrush" Color="#1A70B6"/>
|
||
|
||
|
||
<!-- ====================== 2. TabItem 样式：自定义外观 + 状态反馈 ====================== -->
|
||
<Style x:Key="FancyTabItemStyle" TargetType="TabItem">
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<!-- TabItem 之间的间距 -->
|
||
<Setter Property="Padding" Value="10,5"/>
|
||
<!-- TabItem 内边距（控制文字与边框距离） -->
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
<Setter Property="Width" Value="120"/>
|
||
<Setter Property="FontSize" Value="18"/>
|
||
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="TabItem">
|
||
<Grid SnapsToDevicePixels="True">
|
||
<!-- 步骤1：TabItem 背景（带顶部圆角） -->
|
||
<!-- 仅顶部圆角，与内容区域的底部圆角呼应 -->
|
||
<Border
|
||
x:Name="tabBackground"
|
||
CornerRadius="5,5,0,0"
|
||
Background="{TemplateBinding Background}"
|
||
BorderThickness="0"
|
||
Margin="{TemplateBinding Margin}"/>
|
||
|
||
<!-- 步骤2：选中时的底部下划线（默认隐藏） -->
|
||
<Border
|
||
x:Name="tabUnderline"
|
||
Height="3"
|
||
VerticalAlignment="Bottom"
|
||
Background="{StaticResource TabItemUnderlineBrush}"
|
||
Visibility="Collapsed"/>
|
||
|
||
<!-- 步骤3：Tab 标题的内容呈现器 -->
|
||
<ContentPresenter
|
||
x:Name="tabHeader"
|
||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||
Margin="{TemplateBinding Padding}"
|
||
ContentSource="Header"
|
||
Focusable="False"
|
||
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
|
||
</Grid>
|
||
|
||
<!-- 触发器：处理不同状态的样式变化 -->
|
||
<ControlTemplate.Triggers>
|
||
<!-- 状态1：鼠标悬浮 -->
|
||
<Trigger Property="IsMouseOver" Value="True">
|
||
<Setter TargetName="tabBackground" Property="Background" Value="{StaticResource TabItemHoverBgBrush}"/>
|
||
<Setter Property="Foreground" Value="{StaticResource TabItemHoverForegroundBrush}"/>
|
||
</Trigger>
|
||
<!-- 状态2：选中 -->
|
||
<Trigger Property="IsSelected" Value="True">
|
||
<Setter TargetName="tabBackground" Property="Background" Value="{StaticResource TabItemSelectedBgBrush}"/>
|
||
<Setter Property="Foreground" Value="{StaticResource TabItemSelectedForegroundBrush}"/>
|
||
<Setter TargetName="tabUnderline" Property="Visibility" Value="Visible"/>
|
||
</Trigger>
|
||
</ControlTemplate.Triggers>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
</Style>
|
||
|
||
|
||
<Style x:Key="FancyTabItemStyle1" TargetType="TabItem">
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<!-- TabItem 之间的间距 -->
|
||
<Setter Property="Padding" Value="10,5"/>
|
||
<!-- TabItem 内边距（控制文字与边框距离） -->
|
||
<Setter Property="HorizontalContentAlignment" Value="Center"/>
|
||
<Setter Property="VerticalContentAlignment" Value="Center"/>
|
||
<Setter Property="Width" Value="120"/>
|
||
<Setter Property="FontSize" Value="16"/>
|
||
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="TabItem">
|
||
<Grid SnapsToDevicePixels="True">
|
||
<!-- 步骤1：TabItem 背景（带顶部圆角） -->
|
||
<!-- 仅顶部圆角，与内容区域的底部圆角呼应 -->
|
||
<Border
|
||
x:Name="tabBackground"
|
||
CornerRadius="5"
|
||
Background="{TemplateBinding Background}"
|
||
BorderThickness="0"
|
||
Margin="{TemplateBinding Margin}"/>
|
||
|
||
<!-- 步骤2：选中时的底部下划线（默认隐藏） --><!--
|
||
<Border
|
||
x:Name="tabUnderline"
|
||
Height="3"
|
||
VerticalAlignment="Bottom"
|
||
Background="{StaticResource TabItemUnderlineBrush}"
|
||
Visibility="Collapsed"/>-->
|
||
|
||
<!-- 步骤3：Tab 标题的内容呈现器 -->
|
||
<ContentPresenter
|
||
x:Name="tabHeader"
|
||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||
Margin="{TemplateBinding Padding}"
|
||
ContentSource="Header"
|
||
Focusable="False"
|
||
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
|
||
</Grid>
|
||
|
||
<!-- 触发器：处理不同状态的样式变化 -->
|
||
<ControlTemplate.Triggers>
|
||
<!-- 状态1：鼠标悬浮 -->
|
||
<Trigger Property="IsMouseOver" Value="True">
|
||
<Setter TargetName="tabBackground" Property="Background" Value="{StaticResource TabItemHoverBgBrush}"/>
|
||
<Setter Property="Foreground" Value="{StaticResource TabItemHoverForegroundBrush}"/>
|
||
</Trigger>
|
||
<!-- 状态2：选中 -->
|
||
<Trigger Property="IsSelected" Value="True">
|
||
<Setter TargetName="tabBackground" Property="Background" Value="{StaticResource TabItemSelectedBgBrush}"/>
|
||
<Setter Property="Foreground" Value="{StaticResource TabItemSelectedForegroundBrush}"/>
|
||
<!--<Setter TargetName="tabUnderline" Property="Visibility" Value="Visible"/>-->
|
||
</Trigger>
|
||
</ControlTemplate.Triggers>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
</Style>
|
||
|
||
|
||
<!-- ====================== 3. TabControl 样式：整体布局 + 背景分层 ====================== -->
|
||
<Style x:Key="FancyTabControlStyle" TargetType="TabControl">
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<Setter Property="Padding" Value="0"/>
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="TabControl">
|
||
<Grid SnapsToDevicePixels="True">
|
||
<Grid.RowDefinitions>
|
||
<RowDefinition Height="Auto"/>
|
||
<!-- TabItem 行 -->
|
||
<RowDefinition Height="*"/>
|
||
<!-- 内容行 -->
|
||
</Grid.RowDefinitions>
|
||
|
||
<!-- 步骤1：承载所有 TabItem 的面板 -->
|
||
<TabPanel
|
||
x:Name="HeaderPanel"
|
||
Grid.Row="0"
|
||
Panel.ZIndex="1"
|
||
Margin="0"
|
||
IsItemsHost="True"
|
||
Background="Transparent"
|
||
HorizontalAlignment="Left"/>
|
||
|
||
<!-- 步骤2：内容区域的边框（带底部圆角，与 TabItem 顶部圆角呼应） -->
|
||
<Border
|
||
Grid.Row="1"
|
||
BorderThickness="1"
|
||
BorderBrush="#E0E0E0"
|
||
Background="{TemplateBinding Background}"
|
||
Margin="0"
|
||
CornerRadius="0,0,5,5"/>
|
||
|
||
<!-- 步骤3：内容呈现器 -->
|
||
<ContentPresenter
|
||
Grid.Row="1"
|
||
Margin="1"
|
||
ContentSource="SelectedContent"
|
||
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
|
||
</Grid>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
</Style>
|
||
|
||
<Style x:Key="FancyTabControlStyle2" TargetType="TabControl">
|
||
<Setter Property="BorderThickness" Value="0"/>
|
||
<Setter Property="Padding" Value="0"/>
|
||
<Setter Property="Template">
|
||
<Setter.Value>
|
||
<ControlTemplate TargetType="TabControl">
|
||
<Grid SnapsToDevicePixels="True">
|
||
<Grid.RowDefinitions>
|
||
<RowDefinition Height="Auto"/>
|
||
<!-- TabItem 行 -->
|
||
<RowDefinition Height="*"/>
|
||
<!-- 内容行 -->
|
||
</Grid.RowDefinitions>
|
||
|
||
<!-- 步骤1：承载所有 TabItem 的面板 -->
|
||
<TabPanel
|
||
x:Name="HeaderPanel"
|
||
Grid.Row="0"
|
||
Panel.ZIndex="1"
|
||
Margin="0"
|
||
IsItemsHost="True"
|
||
Background="Transparent"
|
||
HorizontalAlignment="Left"/>
|
||
|
||
<!-- 步骤2：内容区域的边框（带底部圆角，与 TabItem 顶部圆角呼应） -->
|
||
<Border
|
||
Grid.Row="1"
|
||
BorderThickness="1"
|
||
BorderBrush="#E0E0E0"
|
||
Background="{TemplateBinding Background}"
|
||
Margin="0"
|
||
CornerRadius="0,0,0,0"/>
|
||
|
||
<!-- 步骤3：内容呈现器 -->
|
||
<ContentPresenter
|
||
Grid.Row="1"
|
||
Margin="1"
|
||
ContentSource="SelectedContent"
|
||
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
|
||
</Grid>
|
||
</ControlTemplate>
|
||
</Setter.Value>
|
||
</Setter>
|
||
</Style>
|
||
</ResourceDictionary> |