zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-04-27 03:33:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add LineTabControl Theme.

Browse Source
This commit is contained in:
Zhang Dian
2025-03-25 23:50:21 +08:00
parent a7debb7886
commit c447fd8d5d
3 changed files with 247 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
demo/Semi.Avalonia.Demo/Views/MainView.axaml
View File

@@ -80,7 +80,7 @@
Padding="20,0,0,0" Padding="20,0,0,0"
TabStripPlacement="Left" TabStripPlacement="Left"
Classes.Dismiss="{Binding #ExpandButton.IsChecked}" Classes.Dismiss="{Binding #ExpandButton.IsChecked}"
Theme="{DynamicResource ScrollTabControl}"> Theme="{DynamicResource ScrollLineTabControl}">
<TabControl.Styles> <TabControl.Styles>
<Style Selector=".Dismiss /template/ ScrollViewer#PART_ScrollViewer"> <Style Selector=".Dismiss /template/ ScrollViewer#PART_ScrollViewer">
<Setter Property="IsVisible" Value="False" /> <Setter Property="IsVisible" Value="False" />

150
src/Semi.Avalonia/Controls/TabControl.axaml
View File

@@ -2,6 +2,24 @@
xmlns="https://github.com/avaloniaui" xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:CompileBindings="True"> x:CompileBindings="True">
<Design.PreviewWith>
<StackPanel Width="400" Height="400" Margin="20">
<TabControl
Theme="{DynamicResource LineTabControl}"
TabStripPlacement="Top">
<TabItem Header="文档">
<TextBlock Text="Content1" />
</TabItem>
<TabItem Header="快速起步" IsEnabled="False">
<TextBlock Text="Content2" />
</TabItem>
<TabItem Header="帮助" IsSelected="True">
<TextBlock Text="Content3" />
</TabItem>
</TabControl>
</StackPanel>
</Design.PreviewWith>
<ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl"> <ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate TargetType="TabControl"> <ControlTemplate TargetType="TabControl">
@@ -150,4 +168,136 @@
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" /> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
</Style> </Style>
</ControlTheme> </ControlTheme>
<ControlTheme x:Key="LineTabControl" TargetType="TabControl">
<Setter Property="ItemContainerTheme" Value="{StaticResource LineTabControlItem}" />
<Setter Property="Template">
<ControlTemplate TargetType="TabControl">
<Border
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<DockPanel>
<Border
Name="PART_BorderSeparator"
DockPanel.Dock="{TemplateBinding TabStripPlacement}"
BorderBrush="{DynamicResource TabItemLinePipePressedBorderBrush}">
<ItemsPresenter
Name="PART_ItemsPresenter"
ItemsPanel="{TemplateBinding ItemsPanel}" />
</Border>
<ContentPresenter
Name="PART_SelectedContentHost"
Margin="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding SelectedContent}"
ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
</DockPanel>
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^[TabStripPlacement=Left], ^[TabStripPlacement=Right]">
<Setter Property="TabControl.ItemsPanel">
<ItemsPanelTemplate>
<WrapPanel Orientation="Vertical" />
</ItemsPanelTemplate>
</Setter>
</Style>
<Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 0 0 1" />
</Style>
<Style Selector="^[TabStripPlacement=Bottom] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 1 0 0" />
</Style>
<Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 0 1 0" />
</Style>
<Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="1 0 0 0" />
</Style>
</ControlTheme>
<ControlTheme x:Key="ScrollLineTabControl" TargetType="TabControl">
<Setter Property="ItemContainerTheme" Value="{StaticResource LineTabControlItem}" />
<Setter Property="ItemsPanel">
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</Setter>
<Setter Property="Template">
<ControlTemplate TargetType="TabControl">
<Border
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<DockPanel>
<ScrollViewer
Name="PART_ScrollViewer"
DockPanel.Dock="{TemplateBinding TabStripPlacement}"
HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
<Border
Name="PART_BorderSeparator"
BorderBrush="{DynamicResource TabItemLinePipePressedBorderBrush}">
<ItemsPresenter
Name="PART_ItemsPresenter"
ItemsPanel="{TemplateBinding ItemsPanel}" />
</Border>
</ScrollViewer>
<ContentPresenter
Name="PART_SelectedContentHost"
Margin="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding SelectedContent}"
ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
</DockPanel>
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^[TabStripPlacement=Left], ^[TabStripPlacement=Right]">
<Setter Property="TabControl.ItemsPanel">
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</Setter>
</Style>
<Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 0 0 1" />
</Style>
<Style Selector="^[TabStripPlacement=Bottom] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 1 0 0" />
</Style>
<Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="0 0 1 0" />
</Style>
<Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_BorderSeparator">
<Setter Property="BorderThickness" Value="1 0 0 0" />
</Style>
<Style Selector="^[TabStripPlacement=Top]">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
</Style>
<Style Selector="^[TabStripPlacement=Bottom]">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
</Style>
<Style Selector="^[TabStripPlacement=Left]">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
</Style>
<Style Selector="^[TabStripPlacement=Right]">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
</Style>
</ControlTheme>
</ResourceDictionary> </ResourceDictionary>

101
src/Semi.Avalonia/Controls/TabItem.axaml
View File

@@ -2,12 +2,21 @@
xmlns="https://github.com/avaloniaui" xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:CompileBindings="True"> x:CompileBindings="True">
<!-- Theme: Card, Strip default is Strip -->
<Design.PreviewWith> <Design.PreviewWith>
<StackPanel Margin="20"> <StackPanel Width="400" Height="400" Margin="20">
<TabItem Header="Hello"> <TabControl
<TextBlock Text="Content" /> Theme="{DynamicResource LineTabControl}"
</TabItem> TabStripPlacement="Top">
<TabItem Header="文档">
<TextBlock Text="Content1" />
</TabItem>
<TabItem Header="快速起步" IsEnabled="False">
<TextBlock Text="Content2" />
</TabItem>
<TabItem Header="帮助" IsSelected="True">
<TextBlock Text="Content3" />
</TabItem>
</TabControl>
</StackPanel> </StackPanel>
</Design.PreviewWith> </Design.PreviewWith>
@@ -122,4 +131,86 @@
</Style> </Style>
</Style> </Style>
</ControlTheme> </ControlTheme>
<ControlTheme x:Key="LineTabControlItem" TargetType="TabItem">
<Setter Property="Background" Value="{DynamicResource TabItemLinePipeBackground}" />
<Setter Property="Foreground" Value="{DynamicResource TabItemLineHeaderForeground}" />
<Setter Property="Template">
<ControlTemplate TargetType="TabItem">
<ContentPresenter
Name="PART_HeaderPresenter"
Padding="{TemplateBinding Padding}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"
FontFamily="{TemplateBinding FontFamily}"
FontWeight="{TemplateBinding FontWeight}"
Foreground="{TemplateBinding Foreground}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}" />
</ControlTemplate>
</Setter>
<!-- Selected state -->
<Style Selector="^:selected /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource TabItemLineHeaderSelectedForeground}" />
<Setter Property="FontWeight" Value="{DynamicResource TabItemSelectedFontWeight}" />
<Setter Property="BorderBrush" Value="{DynamicResource TabItemLinePipeSelectedBackground}" />
</Style>
<Style Selector="^[TabStripPlacement=Left], ^[TabStripPlacement=Right]">
<Style Selector="^:selected /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Background" Value="{DynamicResource SemiColorPrimaryLight}" />
</Style>
</Style>
<!-- Unselected state -->
<Style Selector="^:not(:selected)">
<Setter Property="Cursor" Value="Hand" />
<Style Selector="^:pointerover /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource TabItemLineHeaderPointeroverForeground}" />
<Setter Property="BorderBrush" Value="{DynamicResource TabItemLinePipePointeroverBorderBrush}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="BorderBrush" Value="{DynamicResource TabItemLinePipePressedBorderBrush}" />
</Style>
<Style Selector="^[TabStripPlacement=Left], ^[TabStripPlacement=Right]">
<Style Selector="^:pointerover /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Background" Value="{DynamicResource SemiColorFill0}" />
</Style>
<Style Selector="^:pressed /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Background" Value="{DynamicResource SemiColorFill1}" />
</Style>
</Style>
</Style>
<!-- Disabled state -->
<Style Selector="^:disabled /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource TabItemHeaderForegroundDisabled}" />
<Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundDisabled}" />
</Style>
<!-- TabStripPlacement States Group -->
<Style Selector="^[TabStripPlacement=Top]">
<Setter Property="Margin" Value="0 0 24 0" />
<Setter Property="Padding" Value="4 16 4 14" />
<Setter Property="BorderThickness" Value="0 0 0 2" />
</Style>
<Style Selector="^[TabStripPlacement=Bottom]">
<Setter Property="Margin" Value="0 0 24 0" />
<Setter Property="Padding" Value="4 14 4 16" />
<Setter Property="BorderThickness" Value="0 2 0 0" />
</Style>
<Style Selector="^[TabStripPlacement=Left]">
<Setter Property="Padding" Value="12" />
<Setter Property="BorderThickness" Value="2 0 0 0" />
</Style>
<Style Selector="^[TabStripPlacement=Right]">
<Setter Property="Padding" Value="12" />
<Setter Property="BorderThickness" Value="0 0 2 0" />
<Setter Property="HorizontalContentAlignment" Value="Right" />
</Style>
</ControlTheme>
</ResourceDictionary> </ResourceDictionary>