zhaoyushun1999/Semi.Avalonia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Update split button style.

Browse Source
This commit is contained in:
rabbitism 2023-01-30 00:05:42 +08:00
parent d7574237ec
commit dc010357ba
3 changed files with 134 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
demo/Semi.Avalonia.Demo/Pages/ButtonDemo.axaml
View File

@ -84,6 +84,32 @@
</MenuFlyout> </MenuFlyout>
</SplitButton.Flyout> </SplitButton.Flyout>
</SplitButton> </SplitButton>
<SplitButton Classes="Secondary" Content="Submit" />
<SplitButton Classes="Tertiary" Content="Submit" />
<SplitButton Classes="Warning" Content="Submit" />
<SplitButton Classes="Danger" Content="Submit" />
<SplitButton
Classes="Danger"
Content="Submit"
IsEnabled="False" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<ToggleSplitButton Content="Submit">
<ToggleSplitButton.Flyout>
<MenuFlyout Placement="BottomEdgeAlignedRight">
<MenuItem Header="Submit All" />
<MenuItem Header="Submit Updated" />
</MenuFlyout>
</ToggleSplitButton.Flyout>
</ToggleSplitButton>
<ToggleSplitButton Classes="Secondary" Content="Submit" />
<ToggleSplitButton Classes="Tertiary" Content="Submit" />
<ToggleSplitButton Classes="Warning" Content="Submit" />
<ToggleSplitButton Classes="Danger" Content="Submit" />
<ToggleSplitButton
Classes="Danger"
Content="Submit"
IsEnabled="False" />
</StackPanel> </StackPanel>
</StackPanel> </StackPanel>
</UserControl> </UserControl>

26
demo/Semi.Avalonia.Demo/Pages/Overview.axaml
View File

@ -15,14 +15,6 @@
Text="Welcome to Semi Avalonia" Text="Welcome to Semi Avalonia"
Theme="{StaticResource TitleTextBlock}" /> Theme="{StaticResource TitleTextBlock}" />
<StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary">主要按钮</Button>
<Button Classes="Secondary">次要按钮</Button>
<Button Classes="Tertiary">第三按钮</Button>
<Button Classes="Warning">警告按钮</Button>
<Button Classes="Danger">危险按钮</Button>
<Button Classes="Primary" IsEnabled="False">禁用按钮</Button>
</StackPanel>
<StackPanel Orientation="Horizontal" Spacing="20"> <StackPanel Orientation="Horizontal" Spacing="20">
<Button Classes="Primary" Theme="{DynamicResource SolidButton}">Primary</Button> <Button Classes="Primary" Theme="{DynamicResource SolidButton}">Primary</Button>
<Button Classes="Secondary" Theme="{DynamicResource SolidButton}">Secondary</Button> <Button Classes="Secondary" Theme="{DynamicResource SolidButton}">Secondary</Button>
@ -61,8 +53,6 @@
<RadioButton Theme="{StaticResource ButtonRadioButton}">选项 2</RadioButton> <RadioButton Theme="{StaticResource ButtonRadioButton}">选项 2</RadioButton>
</StackPanel> </StackPanel>
</Border> </Border>
</StackPanel>
<StackPanel Orientation="Horizontal">
<RadioButton Margin="4" Theme="{StaticResource CardRadioButton}"> <RadioButton Margin="4" Theme="{StaticResource CardRadioButton}">
<StackPanel> <StackPanel>
<TextBlock FontWeight="Bold">Option 1</TextBlock> <TextBlock FontWeight="Bold">Option 1</TextBlock>
@ -79,6 +69,7 @@
</StackPanel> </StackPanel>
</RadioButton> </RadioButton>
</StackPanel> </StackPanel>
<StackPanel Orientation="Horizontal" />
<StackPanel Orientation="Horizontal"> <StackPanel Orientation="Horizontal">
<CheckBox Margin="0,0,8,0">Avalonia</CheckBox> <CheckBox Margin="0,0,8,0">Avalonia</CheckBox>
<CheckBox Margin="0,0,8,0" IsChecked="True">WPF</CheckBox> <CheckBox Margin="0,0,8,0" IsChecked="True">WPF</CheckBox>
@ -89,6 +80,15 @@
Content="Content" Content="Content"
OffContent="No" OffContent="No"
OnContent="Yes" /> OnContent="Yes" />
<ProgressBar
Classes="Right"
ShowProgressText="True"
Value="20" />
<Slider
Width="200"
Margin="30,0"
Orientation="Horizontal"
Value="30" />
</StackPanel> </StackPanel>
<TabControl> <TabControl>
<TabItem Header="Tab 1"> <TabItem Header="Tab 1">
@ -103,7 +103,9 @@
</TabControl> </TabControl>
<StackPanel Orientation="Horizontal" Spacing="20"> <StackPanel Orientation="Horizontal" Spacing="20">
<ComboBox Width="200" PlaceholderText="Please Select" /> <ComboBox Width="200" PlaceholderText="Please Select" />
<DatePicker />
<TimePicker />
<CalendarDatePicker />
</StackPanel> </StackPanel>
<Grid ColumnDefinitions="* * *"> <Grid ColumnDefinitions="* * *">
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}">
@ -132,6 +134,7 @@
Classes="revealPasswordButton" Classes="revealPasswordButton"
PasswordChar="*" PasswordChar="*"
Text="Avalonia" /> Text="Avalonia" />
</StackPanel> </StackPanel>
<StackPanel Orientation="Horizontal" Spacing="20"> <StackPanel Orientation="Horizontal" Spacing="20">
@ -152,6 +155,7 @@
<TextBlock>List Item 4</TextBlock> <TextBlock>List Item 4</TextBlock>
<TextBlock>List Item 5</TextBlock> <TextBlock>List Item 5</TextBlock>
</ListBox> </ListBox>
<Calendar />
</StackPanel> </StackPanel>
</StackPanel> </StackPanel>
</ScrollViewer> </ScrollViewer>

151
src/Semi.Avalonia/Controls/SplitButton.axaml
View File

@ -18,67 +18,102 @@
<Setter Property="SplitButton.MinHeight" Value="12" /> <Setter Property="SplitButton.MinHeight" Value="12" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate TargetType="SplitButton"> <ControlTemplate TargetType="SplitButton">
<Border <Grid ColumnDefinitions="*,Auto,Auto">
Background="{TemplateBinding Background}" <Button
BorderBrush="{TemplateBinding BorderBrush}" x:Name="PART_PrimaryButton"
BorderThickness="{TemplateBinding BorderThickness}" Grid.Column="0"
ClipToBounds="True" Padding="{TemplateBinding Padding}"
CornerRadius="{TemplateBinding CornerRadius}"> HorizontalAlignment="Stretch"
<Grid ColumnDefinitions="*,Auto,Auto"> VerticalAlignment="Stretch"
<Button HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
x:Name="PART_PrimaryButton" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
Grid.Column="0" Background="{TemplateBinding Background}"
Padding="{TemplateBinding Padding}" BorderBrush="{TemplateBinding BorderBrush}"
HorizontalAlignment="Stretch" BorderThickness="{TemplateBinding BorderThickness}"
VerticalAlignment="Stretch" Command="{TemplateBinding Command}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" CommandParameter="{TemplateBinding CommandParameter}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}"
Background="{TemplateBinding Background}" ContentTemplate="{TemplateBinding ContentTemplate}"
BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="3 0 0 3"
BorderThickness="{TemplateBinding BorderThickness}" Focusable="False"
Command="{TemplateBinding Command}" FontFamily="{TemplateBinding FontFamily}"
CommandParameter="{TemplateBinding CommandParameter}" FontSize="{TemplateBinding FontSize}"
Content="{TemplateBinding Content}" FontWeight="{TemplateBinding FontWeight}"
ContentTemplate="{TemplateBinding ContentTemplate}" Foreground="{TemplateBinding Foreground}"
CornerRadius="3 0 0 3" KeyboardNavigation.IsTabStop="False" />
Focusable="False"
FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontWeight="{TemplateBinding FontWeight}"
Foreground="{TemplateBinding Foreground}"
KeyboardNavigation.IsTabStop="False" />
<Border <Border
x:Name="SeparatorBorder" x:Name="SeparatorBorder"
Grid.Column="1" Grid.Column="1"
Width="{DynamicResource SplitButtonSeparatorWidth}" Width="{DynamicResource SplitButtonSeparatorWidth}"
Background="White" Background="White"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="0.5" /> BorderThickness="0.5" />
<Button <Button
x:Name="PART_SecondaryButton" x:Name="PART_SecondaryButton"
Grid.Column="2" Grid.Column="2"
Padding="4,0" Padding="4,0"
HorizontalAlignment="Stretch" HorizontalAlignment="Stretch"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
HorizontalContentAlignment="Center" HorizontalContentAlignment="Center"
VerticalContentAlignment="Center" VerticalContentAlignment="Center"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="0 3 3 0" CornerRadius="0 3 3 0"
Focusable="False" Focusable="False"
KeyboardNavigation.IsTabStop="False"> Foreground="{TemplateBinding Foreground}"
<PathIcon KeyboardNavigation.IsTabStop="False">
Width="12" <PathIcon
Height="12" Width="12"
Data="{DynamicResource SplitButtonIconGlyph}" Height="12"
Foreground="{TemplateBinding Foreground}" /> Data="{DynamicResource SplitButtonIconGlyph}"
</Button> Foreground="{Binding $parent[Button].Foreground}" />
</Grid> </Button>
</Border> </Grid>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^.Secondary /template/ Button">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultSecondaryForeground}" />
</Style>
<Style Selector="^.Tertiary /template/ Button">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultTertiaryForeground}" />
</Style>
<Style Selector="^.Warning /template/ Button">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultWarningForeground}" />
</Style>
<Style Selector="^.Danger /template/ Button">
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDangerForeground}" />
</Style>
<Style Selector="^:checked">
<Style Selector="^ /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonSolidPrimaryBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
</Style>
<Style Selector="^.Secondary /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonSolidSecondaryBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
</Style>
<Style Selector="^.Tertiary /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonSolidTertiaryBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
</Style>
<Style Selector="^.Warning /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonSolidWarningBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
</Style>
<Style Selector="^.Danger /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonSolidDangerBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonSolidForeground}" />
</Style>
</Style>
<Style Selector="^:disabled /template/ Button">
<Setter Property="Background" Value="{DynamicResource ButtonDefaultDisabledBackground}" />
<Setter Property="Foreground" Value="{DynamicResource ButtonDefaultDisabledForeground}" />
</Style>
</ControlTheme> </ControlTheme>
</ResourceDictionary> </ResourceDictionary>