Skip to content

Commit 198c3ef

Browse files
Add some missing control themes (SplitButton, DropDownButton, ManagedFileChooser), correct FlyoutPresenter (#455)
* Add SplitButton support and some demo * Add DropDownButton themes (Raised and Outline var.) * Copy a ManagedFileChooser from official Avalonia Fluent theme * Correct some behaviour of SplitButton, use Name instead of x:Name * Add new themes to the Index (DropDownButton, ManagedFileChooser) * Update demo (Buttons and Dialog section) * Fix: FlyoutPresenter had no background brush * Update demo (Buttons) * Remove non-meaning comments (PR#455)
1 parent c98a861 commit 198c3ef

File tree

9 files changed

+926
-4
lines changed

9 files changed

+926
-4
lines changed

Material.Avalonia.Demo.Desktop/Program.cs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
using System;
2+
using System.Diagnostics.CodeAnalysis;
23
using Avalonia;
4+
using Avalonia.Dialogs;
35
using ShowMeTheXaml;
46

57
namespace Material.Avalonia.Demo.Desktop {
@@ -15,6 +17,8 @@ public static void Main(string[] args) {
1517
}
1618

1719
// Avalonia configuration, don't remove; also used by visual designer.
20+
// CA1416: only Desktop platform supported (Windows, Linux, macOS)
21+
[SuppressMessage("Interoperability", "CA1416")]
1822
public static AppBuilder BuildAvaloniaApp() {
1923
return AppBuilder.Configure<App>()
2024
.LogToTrace()
@@ -24,6 +28,7 @@ public static AppBuilder BuildAvaloniaApp() {
2428
UseDBusMenu = true,
2529
EnableIme = true
2630
})
31+
.UseManagedSystemDialogs()
2732
.UseXamlDisplay();
2833
}
2934
}

Material.Avalonia.Demo/Pages/ButtonsDemo.axaml

Lines changed: 177 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@
66
xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
77
xmlns:controls="clr-namespace:Material.Styles.Controls;assembly=Material.Styles"
88
xmlns:showMeTheXaml="clr-namespace:ShowMeTheXaml;assembly=ShowMeTheXaml.Avalonia"
9-
xmlns:assists="clr-namespace:Material.Styles.Assists;assembly=Material.Styles"
109
x:Class="Material.Avalonia.Demo.Pages.ButtonsDemo"
1110
Name="ButtonsDemoPageControl">
1211
<StackPanel Margin="16, 0">
@@ -15,6 +14,16 @@
1514
<Setter Property="IsEnabled"
1615
Value="{Binding ElementName=IsEnabledCheckBox, Path=IsChecked}" />
1716
</Style>
17+
18+
<Style Selector="SplitButton">
19+
<Setter Property="IsEnabled"
20+
Value="{Binding ElementName=IsEnabledCheckBox, Path=IsChecked}" />
21+
</Style>
22+
23+
<Style Selector="DropDownButton">
24+
<Setter Property="IsEnabled"
25+
Value="{Binding ElementName=IsEnabledCheckBox, Path=IsChecked}" />
26+
</Style>
1827

1928
<Style Selector="controls|FloatingButton">
2029
<Setter Property="IsEnabled"
@@ -171,6 +180,7 @@
171180
<showMeTheXaml:XamlDisplay UniqueId="ExpandedFloatingButton3">
172181
<controls:FloatingButton Classes="Accent" IsExtended="{Binding ElementName=CheckBox1, Path=IsChecked}" />
173182
</showMeTheXaml:XamlDisplay>
183+
174184
<CheckBox Name="CheckBox1" Content="IsExtended" Margin="16,8" />
175185
</StackPanel>
176186

@@ -191,6 +201,172 @@
191201
<Button Theme="{StaticResource MaterialFlatButton}" Classes="accent" Content="Accent" ToolTip.Tip='Button with classes "Accent" and "Flat"' />
192202
</showMeTheXaml:XamlDisplay>
193203
</StackPanel>
204+
205+
<TextBlock Classes="Headline6 Subheadline2" Text="Split buttons" />
206+
<StackPanel>
207+
<StackPanel.Resources>
208+
<MenuFlyout x:Key="SharedSplitButtonMenuFlyout"
209+
HorizontalOffset="8" VerticalOffset="8"
210+
Placement="TopEdgeAlignedRight">
211+
<MenuItem Header="Item 1">
212+
<MenuItem Header="Subitem 1" />
213+
<MenuItem Header="Subitem 2" />
214+
<MenuItem Header="Subitem 3" />
215+
</MenuItem>
216+
<MenuItem Header="Item 2"
217+
InputGesture="Ctrl+A" />
218+
<MenuItem Header="Item 3" />
219+
</MenuFlyout>
220+
221+
<MenuFlyout x:Key="SharedDownSplitButtonMenuFlyout"
222+
HorizontalOffset="8" VerticalOffset="-8"
223+
Placement="BottomEdgeAlignedRight">
224+
<MenuItem Header="Item 1">
225+
<MenuItem Header="Subitem 1" />
226+
<MenuItem Header="Subitem 2" />
227+
<MenuItem Header="Subitem 3" />
228+
</MenuItem>
229+
<MenuItem Header="Item 2"
230+
InputGesture="Ctrl+A" />
231+
<MenuItem Header="Item 3" />
232+
</MenuFlyout>
233+
</StackPanel.Resources>
234+
<StackPanel.Styles>
235+
<Style Selector="showMeTheXaml|XamlDisplay">
236+
<Setter Property="Margin" Value="8" />
237+
</Style>
238+
</StackPanel.Styles>
239+
<StackPanel Orientation="Horizontal">
240+
<showMeTheXaml:XamlDisplay UniqueId="SplitButtons0">
241+
<SplitButton Theme="{StaticResource MaterialSplitButton}"
242+
Classes="up light"
243+
Content="Light"
244+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
245+
</showMeTheXaml:XamlDisplay>
246+
247+
<showMeTheXaml:XamlDisplay UniqueId="SplitButtons1">
248+
<SplitButton Theme="{StaticResource MaterialSplitButton}"
249+
Classes="up"
250+
Content="Mid (Default)"
251+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
252+
</showMeTheXaml:XamlDisplay>
253+
254+
<showMeTheXaml:XamlDisplay UniqueId="SplitButtons2">
255+
<SplitButton Theme="{StaticResource MaterialSplitButton}"
256+
Classes="up dark"
257+
Content="Dark"
258+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
259+
</showMeTheXaml:XamlDisplay>
260+
261+
<showMeTheXaml:XamlDisplay UniqueId="SplitButtons3">
262+
<SplitButton Theme="{StaticResource MaterialSplitButton}"
263+
Classes="down accent"
264+
Content="Accent"
265+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedDownSplitButtonMenuFlyout}" />
266+
</showMeTheXaml:XamlDisplay>
267+
</StackPanel>
268+
269+
<StackPanel Orientation="Horizontal">
270+
<showMeTheXaml:XamlDisplay UniqueId="OutlineSplitButtons0">
271+
<SplitButton Theme="{StaticResource MaterialOutlineSplitButton}"
272+
Classes="up light"
273+
Content="Light"
274+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
275+
</showMeTheXaml:XamlDisplay>
276+
277+
<showMeTheXaml:XamlDisplay UniqueId="OutlineSplitButtons1">
278+
<SplitButton Theme="{StaticResource MaterialOutlineSplitButton}"
279+
Classes="up"
280+
Content="Default"
281+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
282+
</showMeTheXaml:XamlDisplay>
283+
284+
<showMeTheXaml:XamlDisplay UniqueId="OutlineSplitButtons2">
285+
<SplitButton Theme="{StaticResource MaterialOutlineSplitButton}"
286+
Classes="up dark"
287+
Content="Dark"
288+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedSplitButtonMenuFlyout}" />
289+
</showMeTheXaml:XamlDisplay>
290+
291+
<showMeTheXaml:XamlDisplay UniqueId="OutlineSplitButtons3">
292+
<SplitButton Theme="{StaticResource MaterialOutlineSplitButton}"
293+
Classes="down accent"
294+
Content="Accent"
295+
ToolTip.Tip='Split button' Flyout="{StaticResource SharedDownSplitButtonMenuFlyout}" />
296+
</showMeTheXaml:XamlDisplay>
297+
</StackPanel>
298+
</StackPanel>
299+
300+
<TextBlock Classes="Headline6 Subheadline2" Text="DropDown buttons" />
301+
<StackPanel Orientation="Horizontal">
302+
<StackPanel.Resources>
303+
<MenuFlyout x:Key="SharedSplitButtonMenuFlyout"
304+
HorizontalOffset="8" VerticalOffset="-8"
305+
Placement="BottomEdgeAlignedRight">
306+
<MenuItem Header="Item 1">
307+
<MenuItem Header="Subitem 1" />
308+
<MenuItem Header="Subitem 2" />
309+
<MenuItem Header="Subitem 3" />
310+
</MenuItem>
311+
<MenuItem Header="Item 2"
312+
InputGesture="Ctrl+A" />
313+
<MenuItem Header="Item 3" />
314+
</MenuFlyout>
315+
</StackPanel.Resources>
316+
<StackPanel.Styles>
317+
<Style Selector="showMeTheXaml|XamlDisplay">
318+
<Setter Property="Margin" Value="8" />
319+
</Style>
320+
</StackPanel.Styles>
321+
<showMeTheXaml:XamlDisplay UniqueId="DropDownButtons0">
322+
<DropDownButton Theme="{StaticResource MaterialDropDownButton}" Classes="light" Content="Light" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Light" and "Outline"' />
323+
</showMeTheXaml:XamlDisplay>
324+
<showMeTheXaml:XamlDisplay UniqueId="DropDownButtons1">
325+
<DropDownButton Theme="{StaticResource MaterialDropDownButton}" Content="Mid (Default)" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Outline"' />
326+
</showMeTheXaml:XamlDisplay>
327+
<showMeTheXaml:XamlDisplay UniqueId="DropDownButtons2">
328+
<DropDownButton Theme="{StaticResource MaterialDropDownButton}" Classes="dark" Content="Dark" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Dark" and "Outline"' />
329+
</showMeTheXaml:XamlDisplay>
330+
<showMeTheXaml:XamlDisplay UniqueId="DropDownButtons3">
331+
<DropDownButton Theme="{StaticResource MaterialDropDownButton}" Classes="accent" Content="Accent" Flyout="{StaticResource SharedSplitButtonMenuFlyout}"
332+
ToolTip.Tip='Button with classes "Accent" and "Outline"' />
333+
</showMeTheXaml:XamlDisplay>
334+
</StackPanel>
335+
336+
<StackPanel Orientation="Horizontal">
337+
<StackPanel.Resources>
338+
<MenuFlyout x:Key="SharedSplitButtonMenuFlyout"
339+
HorizontalOffset="8" VerticalOffset="-8"
340+
Placement="BottomEdgeAlignedRight">
341+
<MenuItem Header="Item 1">
342+
<MenuItem Header="Subitem 1" />
343+
<MenuItem Header="Subitem 2" />
344+
<MenuItem Header="Subitem 3" />
345+
</MenuItem>
346+
<MenuItem Header="Item 2"
347+
InputGesture="Ctrl+A" />
348+
<MenuItem Header="Item 3" />
349+
</MenuFlyout>
350+
</StackPanel.Resources>
351+
<StackPanel.Styles>
352+
<Style Selector="showMeTheXaml|XamlDisplay">
353+
<Setter Property="Margin" Value="8" />
354+
</Style>
355+
</StackPanel.Styles>
356+
<showMeTheXaml:XamlDisplay UniqueId="OutlineDropDownButtons0">
357+
<DropDownButton Theme="{StaticResource MaterialOutlineDropDownButton}" Classes="light" Content="Light" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Light" and "Outline"' />
358+
</showMeTheXaml:XamlDisplay>
359+
<showMeTheXaml:XamlDisplay UniqueId="OutlineDropDownButtons1">
360+
<DropDownButton Theme="{StaticResource MaterialOutlineDropDownButton}" Content="Mid (Default)" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Outline"' />
361+
</showMeTheXaml:XamlDisplay>
362+
<showMeTheXaml:XamlDisplay UniqueId="OutlineDropDownButtons2">
363+
<DropDownButton Theme="{StaticResource MaterialOutlineDropDownButton}" Classes="dark" Content="Dark" Flyout="{StaticResource SharedSplitButtonMenuFlyout}" ToolTip.Tip='Button with classes "Dark" and "Outline"' />
364+
</showMeTheXaml:XamlDisplay>
365+
<showMeTheXaml:XamlDisplay UniqueId="OutlineDropDownButtons3">
366+
<DropDownButton Theme="{StaticResource MaterialOutlineDropDownButton}" Classes="accent" Content="Accent" Flyout="{StaticResource SharedSplitButtonMenuFlyout}"
367+
ToolTip.Tip='Button with classes "Accent" and "Outline"' />
368+
</showMeTheXaml:XamlDisplay>
369+
</StackPanel>
194370

195371
<TextBlock Classes="Headline6 Subheadline2" Text="Hyperlink buttons" />
196372
<StackPanel Orientation="Horizontal" Spacing="8">

Material.Avalonia.Demo/Pages/DialogDemo.axaml

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,14 @@
1717
</UserControl.Resources>
1818

1919
<StackPanel Margin="16, 0">
20+
<StackPanel.Styles>
21+
<Style Selector="WrapPanel#ModulesRoot > StackPanel">
22+
<Setter Property="MaxWidth" Value="360"/>
23+
</Style>
24+
</StackPanel.Styles>
25+
2026
<TextBlock Classes="Headline4 Subheadline" Text="Dialogs" />
21-
<Grid ColumnDefinitions="*, *">
27+
<WrapPanel Name="ModulesRoot">
2228

2329
<StackPanel>
2430
<TextBlock Classes="Headline6 Subheadline2" Text="DialogHost" />
@@ -32,7 +38,7 @@
3238
</StackPanel>
3339
</StackPanel>
3440

35-
<StackPanel Grid.Column="1">
41+
<StackPanel>
3642
<TextBlock Classes="Headline6 Subheadline2" Text="Standalone dialog" />
3743

3844
<TextBlock IsVisible="{Binding !IsDialogsAvailable}">
@@ -66,7 +72,12 @@
6672
</ItemsControl.ItemTemplate>
6773
</ItemsControl>
6874
</StackPanel>
69-
</Grid>
75+
76+
<StackPanel>
77+
<TextBlock Classes="Headline6 Subheadline2" Text="Managed file picker" />
78+
<Button Classes="flat" Content="Example" Click="FilePickerExampleButton_OnClick"/>
79+
</StackPanel>
80+
</WrapPanel>
7081
</StackPanel>
7182

7283

Material.Avalonia.Demo/Pages/DialogDemo.axaml.cs

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
using Avalonia.Controls;
44
using Avalonia.Controls.Primitives;
55
using Avalonia.Interactivity;
6+
using Avalonia.Platform.Storage;
67
using DialogHostAvalonia;
78
using Material.Avalonia.Demo.Models;
89
using Material.Avalonia.Demo.ViewModels;
@@ -33,4 +34,15 @@ private void OpenDialogWithModel(object? sender, RoutedEventArgs e) {
3334
private void OpenMoreDialogHostExamples(object? sender, RoutedEventArgs e) {
3435
Process.Start(new ProcessStartInfo { FileName = "https://github.com/AvaloniaUtils/DialogHost.Avalonia", UseShellExecute = true });
3536
}
37+
38+
private async void FilePickerExampleButton_OnClick(object? sender, RoutedEventArgs e) {
39+
var toplevel = TopLevel.GetTopLevel(this);
40+
var folders = await toplevel!
41+
.StorageProvider
42+
.OpenFolderPickerAsync(new FolderPickerOpenOptions
43+
{
44+
Title = "Folder file",
45+
SuggestedFileName = "FileName",
46+
});
47+
}
3648
}

Material.Styles/MaterialToolKit.xaml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@
4343
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ContextMenu.axaml" />
4444
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/DataValidationErrors.axaml" />
4545
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/DatePicker.axaml" />
46+
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/DropDownButton.axaml" />
4647
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/EmbeddableControlRoot.axaml" />
4748
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Expander.axaml" />
4849
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/FlyoutPresenter.axaml" />
@@ -53,6 +54,7 @@
5354
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Label.axaml" />
5455
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ListBox.axaml" />
5556
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ListBoxItem.axaml" />
57+
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/ManagedFileChooser.axaml" />
5658
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Menu.axaml" />
5759
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/MenuFlyoutPresenter.axaml" />
5860
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/MenuItem.axaml" />
@@ -73,6 +75,7 @@
7375
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/SelectableTextBlock.axaml" />
7476
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Separator.axaml" />
7577
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/Slider.axaml" />
78+
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/SplitButton.axaml" />
7679
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/SplitView.axaml" />
7780
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/TabControl.axaml" />
7881
<ResourceInclude Source="avares://Material.Styles/Resources/Themes/TabItem.axaml" />

0 commit comments

Comments
 (0)