feat: update style to make it feels a bit better.
This commit is contained in:
rabbitism
parent
392f432a7b
commit
6b2fd3caae
@ -4,25 +4,33 @@
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" d:DesignHeight="450"
|
||||
d:DesignWidth="800" mc:Ignorable="d">
|
||||
<StackPanel>
|
||||
<TabControl TabStripPlacement="Top">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
<TabControl TabStripPlacement="Left">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
<TabControl TabStripPlacement="Right">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
<TabControl TabStripPlacement="Bottom">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
<Border Theme="{StaticResource CardBorder}">
|
||||
<TabControl TabStripPlacement="Top">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
</Border>
|
||||
<Border Theme="{StaticResource CardBorder}">
|
||||
<TabControl TabStripPlacement="Left">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
</Border>
|
||||
<Border Theme="{StaticResource CardBorder}">
|
||||
<TabControl TabStripPlacement="Right">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
</Border>
|
||||
<Border Theme="{StaticResource CardBorder}">
|
||||
<TabControl TabStripPlacement="Bottom">
|
||||
<TabItem Content="Hello 1" Header="Tab 1" />
|
||||
<TabItem Content="Hello 2" Header="Tab 2" />
|
||||
<TabItem Content="Hello 3" Header="Tab 3" />
|
||||
</TabControl>
|
||||
</Border>
|
||||
</StackPanel>
|
||||
</UserControl>
|
||||
|
||||
@ -1,32 +1,34 @@
|
||||
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<!-- Add Resources Here -->
|
||||
<ControlTheme TargetType="TabControl" x:Key="{x:Type TabControl}">
|
||||
<ControlTheme x:Key="{x:Type TabControl}" TargetType="TabControl">
|
||||
<Setter Property="Margin" Value="0" />
|
||||
<Setter Property="Padding" Value="{DynamicResource TabItemMargin}" />
|
||||
<Setter Property="Padding" Value="0" />
|
||||
<Setter Property="Background" Value="{DynamicResource TabControlBackground}" />
|
||||
<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}"
|
||||
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
|
||||
VerticalAlignment="{TemplateBinding VerticalAlignment}">
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<DockPanel>
|
||||
<ItemsPresenter
|
||||
DockPanel.Dock="{TemplateBinding TabStripPlacement}"
|
||||
ItemTemplate="{TemplateBinding ItemTemplate}"
|
||||
Items="{TemplateBinding Items}"
|
||||
ItemsPanel="{TemplateBinding ItemsPanel}"
|
||||
Name="PART_ItemsPresenter" />
|
||||
<Panel DockPanel.Dock="{TemplateBinding TabStripPlacement}">
|
||||
<ItemsPresenter
|
||||
Name="PART_ItemsPresenter"
|
||||
ItemTemplate="{TemplateBinding ItemTemplate}"
|
||||
Items="{TemplateBinding Items}"
|
||||
ItemsPanel="{TemplateBinding ItemsPanel}" />
|
||||
<Border Name="PART_BorderSeparator" Background="{DynamicResource TabItemLinePipePressedBorderBrush}" />
|
||||
</Panel>
|
||||
<ContentPresenter
|
||||
Content="{TemplateBinding SelectedContent}"
|
||||
ContentTemplate="{TemplateBinding SelectedContentTemplate}"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
Margin="{TemplateBinding Padding}"
|
||||
Name="PART_SelectedContentHost"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" />
|
||||
Margin="{TemplateBinding Padding}"
|
||||
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding SelectedContent}"
|
||||
ContentTemplate="{TemplateBinding SelectedContentTemplate}" />
|
||||
</DockPanel>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
@ -38,8 +40,30 @@
|
||||
<Style Selector="^[TabStripPlacement=Right] /template/ ItemsPresenter#PART_ItemsPresenter > WrapPanel">
|
||||
<Setter Property="Orientation" Value="Vertical" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
|
||||
<Setter Property="Margin" Value="{DynamicResource TabControlTopPlacementItemMargin}" />
|
||||
<Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_BorderSeparator">
|
||||
<Setter Property="Border.Width" Value="2" />
|
||||
<Setter Property="Border.VerticalAlignment" Value="Stretch" />
|
||||
<Setter Property="Border.HorizontalAlignment" Value="Left" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_BorderSeparator">
|
||||
<Setter Property="Border.Width" Value="2" />
|
||||
<Setter Property="Border.VerticalAlignment" Value="Stretch" />
|
||||
<Setter Property="Border.HorizontalAlignment" Value="Right" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_BorderSeparator">
|
||||
<Setter Property="Border.Height" Value="2" />
|
||||
<Setter Property="Border.HorizontalAlignment" Value="Stretch" />
|
||||
<Setter Property="Border.VerticalAlignment" Value="Bottom" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Bottom] /template/ Border#PART_BorderSeparator">
|
||||
<Setter Property="Border.Height" Value="2" />
|
||||
<Setter Property="Border.HorizontalAlignment" Value="Stretch" />
|
||||
<Setter Property="Border.VerticalAlignment" Value="Top" />
|
||||
</Style>
|
||||
<!--
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ ItemsPresenter#PART_ItemsPresenter">
|
||||
<Setter Property="Margin" Value="8" />
|
||||
</Style>
|
||||
-->
|
||||
</ControlTheme>
|
||||
</ResourceDictionary>
|
||||
|
||||
@ -16,17 +16,17 @@
|
||||
<Setter Property="TabItem.MinHeight" Value="5" />
|
||||
<Setter Property="TabItem.VerticalContentAlignment" Value="Center" />
|
||||
<Setter Property="TabItem.Template">
|
||||
<ControlTemplate>
|
||||
<ControlTemplate TargetType="TabItem">
|
||||
<Border
|
||||
Name="PART_LayoutRoot"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
Background="{TemplateBinding Background}"
|
||||
BorderBrush="{TemplateBinding BorderBrush}"
|
||||
BorderThickness="{TemplateBinding BorderThickness}"
|
||||
CornerRadius="{TemplateBinding CornerRadius}">
|
||||
<Grid>
|
||||
<Panel>
|
||||
<ContentPresenter
|
||||
Name="PART_ContentPresenter"
|
||||
Padding="{TemplateBinding Padding}"
|
||||
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
|
||||
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
|
||||
Content="{TemplateBinding Header}"
|
||||
@ -39,7 +39,7 @@
|
||||
Background="{DynamicResource TabItemLinePipeSelectedBackground}"
|
||||
CornerRadius="{DynamicResource ControlCornerRadius}"
|
||||
IsVisible="False" />
|
||||
</Grid>
|
||||
</Panel>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
@ -50,13 +50,16 @@
|
||||
<Setter Property="Foreground" Value="Blue" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^:not(:selected)">
|
||||
<Setter Property="Cursor" Value="Hand" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^:selected /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="IsVisible" Value="True" />
|
||||
</Style>
|
||||
|
||||
<!-- PointerOver state -->
|
||||
<Style Selector="^:pointerover /template/ Border#PART_LayoutRoot">
|
||||
<Setter Property="Background" Value="{DynamicResource TabItemHeaderBackgroundUnselectedPointerOver}" />
|
||||
<Setter Property="TextElement.Foreground" Value="{DynamicResource TabItemHeaderForegroundUnselectedPointerOver}" />
|
||||
</Style>
|
||||
|
||||
@ -87,7 +90,7 @@
|
||||
<!-- TabStripPlacement States Group -->
|
||||
<Style Selector="^[TabStripPlacement=Left] /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="Border.Width" Value="2" />
|
||||
<Setter Property="Border.Margin" Value="0,0,2,0" />
|
||||
<Setter Property="Border.Margin" Value="0,0,8,0" />
|
||||
<Setter Property="Border.HorizontalAlignment" Value="Left" />
|
||||
<Setter Property="Border.VerticalAlignment" Value="Stretch" />
|
||||
</Style>
|
||||
@ -97,11 +100,24 @@
|
||||
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe, ^[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="Height" Value="2" />
|
||||
<Setter Property="Margin" Value="0,0,0,2" />
|
||||
<Setter Property="Margin" Value="0,0,0,0" />
|
||||
<Setter Property="HorizontalAlignment" Value="Stretch" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Bottom] /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="VerticalAlignment" Value="Top" />
|
||||
</Style>
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="VerticalAlignment" Value="Bottom" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^[TabStripPlacement=Top] /template/ ContentPresenter#PART_ContentPresenter">
|
||||
<Setter Property="Margin" Value="0,0,0,8" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^[TabStripPlacement=Bottom] /template/ ContentPresenter#PART_ContentPresenter">
|
||||
<Setter Property="Margin" Value="0,0,0,8" />
|
||||
</Style>
|
||||
|
||||
<Style Selector="^[TabStripPlacement=Right] /template/ Border#PART_SelectedPipe">
|
||||
<Setter Property="Width" Value="2" />
|
||||
<Setter Property="Margin" Value="2,0,0,0" />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user