tsai
/
Avalonia
mirror of https://github.com/AvaloniaUI/Avalonia.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Add separator border

pull/7422/head
Max Katz 5 years ago
parent
4327cb23c8
commit
cb7663a086
1 changed files with 53 additions and 33 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 86
      src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml

86
src/Avalonia.Themes.Fluent/Controls/SplitButton.xaml
View File

@ -1,6 +1,7 @@
<Styles xmlns="https://github.com/avaloniaui" <Styles 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"
xmlns:converters="using:Avalonia.Controls.Converters">
<Design.PreviewWith> <Design.PreviewWith>
<Border Padding="60"> <Border Padding="60">
@ -22,6 +23,10 @@
<Styles.Resources> <Styles.Resources>
<x:Double x:Key="SplitButtonPrimaryButtonSize">32</x:Double> <x:Double x:Key="SplitButtonPrimaryButtonSize">32</x:Double>
<x:Double x:Key="SplitButtonSecondaryButtonSize">32</x:Double> <x:Double x:Key="SplitButtonSecondaryButtonSize">32</x:Double>
<converters:MarginMultiplierConverter x:Key="PrimaryButtonBorderMultiplier" Left="True" Top="True" Bottom="True" Indent="1" />
<converters:MarginMultiplierConverter x:Key="SecondaryButtonBorderMultiplier" Right="True" Top="True" Bottom="True" Indent="1" />
<converters:MarginMultiplierConverter x:Key="SeparatorBorderMultiplier" Top="True" Bottom="True" Indent="1" />
</Styles.Resources> </Styles.Resources>
<Style Selector="SplitButton"> <Style Selector="SplitButton">
@ -44,6 +49,7 @@
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="*" /> <ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<Button x:Name="PART_PrimaryButton" <Button x:Name="PART_PrimaryButton"
@ -51,7 +57,7 @@
MinWidth="{DynamicResource SplitButtonPrimaryButtonSize}" MinWidth="{DynamicResource SplitButtonPrimaryButtonSize}"
Foreground="{TemplateBinding Foreground}" Foreground="{TemplateBinding Foreground}"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource PrimaryButtonBorderMultiplier}}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
Content="{TemplateBinding Content}" Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" ContentTemplate="{TemplateBinding ContentTemplate}"
@ -68,13 +74,20 @@
Focusable="False" Focusable="False"
KeyboardNavigation.IsTabStop="False" /> KeyboardNavigation.IsTabStop="False" />
<Button x:Name="PART_SecondaryButton" <Border x:Name="SeparatorBorder"
Grid.Column="1" Grid.Column="1"
Background="Transparent"
Width="1"
BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SeparatorBorderMultiplier}}"
BorderBrush="{TemplateBinding BorderBrush}" />
<Button x:Name="PART_SecondaryButton"
Grid.Column="2"
MinWidth="{DynamicResource SplitButtonSecondaryButtonSize}" MinWidth="{DynamicResource SplitButtonSecondaryButtonSize}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
Foreground="{TemplateBinding Foreground}" Foreground="{TemplateBinding Foreground}"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness, Converter={StaticResource SecondaryButtonBorderMultiplier}}"
Padding="0" Padding="0"
HorizontalContentAlignment="Center" HorizontalContentAlignment="Center"
VerticalContentAlignment="Center" VerticalContentAlignment="Center"
@ -106,8 +119,8 @@
<!-- Primary and Secondary buttons PointerOver State --> <!-- Primary and Secondary buttons PointerOver State -->
<Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter, <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
SplitButton /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter"> SplitButton /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPointerOver}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPointerOver}" /> <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPointerOver}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPointerOver}" />
</Style> </Style>
<Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pointerover PathIcon"> <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pointerover PathIcon">
@ -117,8 +130,8 @@
<!-- Primary and Secondary buttons Pressed State --> <!-- Primary and Secondary buttons Pressed State -->
<Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter, <Style Selector="SplitButton /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
SplitButton /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter"> SplitButton /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" /> <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
</Style> </Style>
<Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pressed PathIcon"> <Style Selector="SplitButton /template/ Button#PART_SecondaryButton:pressed PathIcon">
@ -127,9 +140,10 @@
<!-- SplitButton Pressed State --> <!-- SplitButton Pressed State -->
<Style Selector="SplitButton:pressed /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:pressed /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:pressed /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:pressed /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPressed}" /> SplitButton:pressed /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
</Style> </Style>
<Style Selector="SplitButton:pressed /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:pressed /template/ Button#PART_SecondaryButton PathIcon">
@ -138,9 +152,10 @@
<!-- Primary and Secondary buttons Flyout Open State --> <!-- Primary and Secondary buttons Flyout Open State -->
<Style Selector="SplitButton:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundPressed}" /> SplitButton:flyout-open /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundPressed}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundPressed}" />
</Style> </Style>
<Style Selector="SplitButton:flyout-open /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
@ -149,9 +164,10 @@
<!-- Disabled State --> <!-- Disabled State -->
<Style Selector="SplitButton:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundDisabled}" /> SplitButton:disabled /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushDisabled}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundDisabled}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushDisabled}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundDisabled}" />
</Style> </Style>
<Style Selector="SplitButton:disabled /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:disabled /template/ Button#PART_SecondaryButton PathIcon">
@ -160,9 +176,10 @@
<!-- Checked State --> <!-- Checked State -->
<Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundChecked}" /> SplitButton:checked /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushChecked}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundChecked}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushChecked}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundChecked}" />
</Style> </Style>
<Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton PathIcon">
@ -172,8 +189,8 @@
<!-- Checked PointerOver State --> <!-- Checked PointerOver State -->
<Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter, <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pointerover /template/ ContentPresenter,
SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter"> SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPointerOver}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPointerOver}" />
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPointerOver}" /> <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPointerOver}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPointerOver}" />
</Style> </Style>
<Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover PathIcon"> <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pointerover PathIcon">
@ -183,8 +200,8 @@
<!-- Checked Pressed State --> <!-- Checked Pressed State -->
<Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter, <Style Selector="SplitButton:checked /template/ Button#PART_PrimaryButton:pressed /template/ ContentPresenter,
SplitButton:checked /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter"> SplitButton:checked /template/ Button#PART_SecondaryButton:pressed /template/ ContentPresenter">
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" /> <Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
</Style> </Style>
<Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pressed PathIcon"> <Style Selector="SplitButton:checked /template/ Button#PART_SecondaryButton:pressed PathIcon">
@ -193,9 +210,10 @@
<!-- SplitButton Checked Pressed State --> <!-- SplitButton Checked Pressed State -->
<Style Selector="SplitButton:pressed:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:pressed:checked /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:pressed:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:pressed:checked /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" /> SplitButton:pressed:checked /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
</Style> </Style>
<Style Selector="SplitButton:pressed:checked /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:pressed:checked /template/ Button#PART_SecondaryButton PathIcon">
@ -204,9 +222,10 @@
<!-- Checked Flyout Open State --> <!-- Checked Flyout Open State -->
<Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" /> SplitButton:checked:flyout-open /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedPressed}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedPressed}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedPressed}" />
</Style> </Style>
<Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:checked:flyout-open /template/ Button#PART_SecondaryButton PathIcon">
@ -215,9 +234,10 @@
<!-- Disabled Checked State --> <!-- Disabled Checked State -->
<Style Selector="SplitButton:checked:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter, <Style Selector="SplitButton:checked:disabled /template/ Button#PART_PrimaryButton /template/ ContentPresenter,
SplitButton:checked:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter"> SplitButton:checked:disabled /template/ Button#PART_SecondaryButton /template/ ContentPresenter,
<Setter Property="Background" Value="{DynamicResource SplitButtonBackgroundCheckedDisabled}" /> SplitButton:checked:disabled /template/ Border#SeparatorBorder">
<Setter Property="BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedDisabled}" /> <Setter Property="Border.Background" Value="{DynamicResource SplitButtonBackgroundCheckedDisabled}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource SplitButtonBorderBrushCheckedDisabled}" />
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" /> <Setter Property="TextBlock.Foreground" Value="{DynamicResource SplitButtonForegroundCheckedDisabled}" />
</Style> </Style>
<Style Selector="SplitButton:checked:disabled /template/ Button#PART_SecondaryButton PathIcon"> <Style Selector="SplitButton:checked:disabled /template/ Button#PART_SecondaryButton PathIcon">

Write Preview
Loading…
Cancel
Save