Skip to content

Commit 3b296e3

Browse files
apmanapman
authored
Add MenuFlyout (context menu) & MenuItem styling (#40)
1 parent e1f0361 commit 3b296e3

15 files changed

+784
-2
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ riderModule.iml
1212
# VS Code
1313
.vs
1414

15+
# local
16+
global.json
1517

1618
# macOS
1719
.DS_Store

‎samples/SampleApp/DemoPages/ContextMenuDemo.axaml

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<UserControl xmlns="https://github.com/avaloniaui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
4+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5+
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
6+
x:Class="SampleApp.DemoPages.ContextMenuDemo">
7+
8+
<Border Background="LightGray" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="20">
9+
<Border.ContextMenu>
10+
<ContextMenu>
11+
<MenuItem Header="Copy" />
12+
<MenuItem Header="Paste" />
13+
</ContextMenu>
14+
</Border.ContextMenu>
15+
<TextBlock Margin="10">Right-click anywhere in this space</TextBlock>
16+
</Border>
17+
18+
</UserControl>

‎samples/SampleApp/DemoPages/ContextMenuDemo.axaml.cs

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
using Avalonia;
2+
using Avalonia.Controls;
3+
using Avalonia.Markup.Xaml;
4+
5+
namespace SampleApp.DemoPages;
6+
7+
public partial class ContextMenuDemo : UserControl
8+
{
9+
public ContextMenuDemo()
10+
{
11+
InitializeComponent();
12+
}
13+
}

‎samples/SampleApp/DemoPages/MenuDemo.axaml

+210
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,210 @@
1+
<UserControl xmlns="https://github.com/avaloniaui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
4+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5+
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
6+
x:Class="SampleApp.DemoPages.MenuDemo">
7+
<Panel>
8+
<Panel.Styles>
9+
<Style Selector="MenuItem Image">
10+
<Setter Property="Width" Value="15" />
11+
<Setter Property="Height" Value="15" />
12+
</Style>
13+
14+
<Style Selector="MenuItem > StackPanel">
15+
<Setter Property="Spacing" Value="10" />
16+
<Setter Property="Orientation" Value="Horizontal" />
17+
</Style>
18+
</Panel.Styles>
19+
20+
21+
<DockPanel>
22+
<Menu DockPanel.Dock="Top">
23+
<MenuItem IsEnabled="True">
24+
<MenuItem.Header>
25+
<StackPanel>
26+
<Image Source="{StaticResource FolderIcon}" />
27+
<TextBlock Text="File" />
28+
</StackPanel>
29+
</MenuItem.Header>
30+
<MenuItem Header="Menu Item">
31+
<MenuItem.Icon>
32+
<Image Source="{StaticResource FolderIcon}" />
33+
</MenuItem.Icon>
34+
</MenuItem>
35+
<MenuItem Header="Menu Item">
36+
<MenuItem.Icon>
37+
<Image Source="{StaticResource FolderIcon}" />
38+
</MenuItem.Icon>
39+
</MenuItem>
40+
<MenuItem Header="Big Icon">
41+
<MenuItem.Icon>
42+
<Image Source="{StaticResource FolderIcon}" />
43+
</MenuItem.Icon>
44+
</MenuItem>
45+
<MenuItem Header="Copy">
46+
<MenuItem.Icon>
47+
<PathIcon Data="{StaticResource PasswordRevealPath}" />
48+
</MenuItem.Icon>
49+
</MenuItem>
50+
</MenuItem>
51+
52+
<MenuItem IsEnabled="True" Header="Test">
53+
<MenuItem.Icon>
54+
<PathIcon Data="{StaticResource PasswordRevealPath}"
55+
Height="9" Width="12" />
56+
</MenuItem.Icon>
57+
</MenuItem>
58+
59+
<MenuItem IsEnabled="False">
60+
<MenuItem.Header>
61+
<StackPanel>
62+
<Image Source="{StaticResource FolderIcon}" />
63+
<TextBlock Text="Menu Item" />
64+
</StackPanel>
65+
</MenuItem.Header>
66+
</MenuItem>
67+
68+
<MenuItem IsEnabled="True">
69+
<MenuItem.Header>
70+
<StackPanel>
71+
<Image Source="{StaticResource FolderIcon}" />
72+
<TextBlock Text="Menu Item" />
73+
</StackPanel>
74+
</MenuItem.Header>
75+
</MenuItem>
76+
77+
<MenuItem IsEnabled="True">
78+
<MenuItem.Header>
79+
<StackPanel>
80+
<Image Source="{StaticResource FolderIcon}" />
81+
<TextBlock Text="Menu Item" />
82+
</StackPanel>
83+
</MenuItem.Header>
84+
</MenuItem>
85+
86+
<MenuItem IsEnabled="True">
87+
<MenuItem.Header>
88+
<StackPanel>
89+
<Image Source="{StaticResource FolderIcon}" />
90+
<TextBlock Text="Menu Item" />
91+
</StackPanel>
92+
</MenuItem.Header>
93+
</MenuItem>
94+
95+
<MenuItem IsEnabled="True">
96+
<MenuItem.Header>
97+
<StackPanel>
98+
<Image Source="{StaticResource FolderIcon}" />
99+
<TextBlock Text="Menu Item" />
100+
</StackPanel>
101+
</MenuItem.Header>
102+
</MenuItem>
103+
104+
<MenuItem>
105+
<MenuItem.Header>
106+
<StackPanel>
107+
<Image Source="{StaticResource FolderIcon}" />
108+
<TextBlock Text="Menu Item" />
109+
</StackPanel>
110+
</MenuItem.Header>
111+
</MenuItem>
112+
</Menu>
113+
114+
<Menu DockPanel.Dock="Bottom">
115+
<MenuItem IsEnabled="True">
116+
<MenuItem.Header>
117+
<StackPanel>
118+
<Image Source="{StaticResource FolderIcon}" />
119+
<TextBlock Text="Menu Item" />
120+
</StackPanel>
121+
</MenuItem.Header>
122+
<MenuItem Header="Menu Item">
123+
<MenuItem.Icon>
124+
<Image Source="{StaticResource FolderIcon}" />
125+
</MenuItem.Icon>
126+
</MenuItem>
127+
<MenuItem Header="Menu Item">
128+
<MenuItem.Icon>
129+
<Image Source="{StaticResource FolderIcon}" />
130+
</MenuItem.Icon>
131+
</MenuItem>
132+
<MenuItem Header="Big Icon">
133+
<MenuItem.Icon>
134+
<Image Source="{StaticResource FolderIcon}" />
135+
</MenuItem.Icon>
136+
</MenuItem>
137+
<MenuItem Header="Copy">
138+
<MenuItem.Icon>
139+
<PathIcon Data="{StaticResource PasswordRevealPath}" />
140+
</MenuItem.Icon>
141+
</MenuItem>
142+
</MenuItem>
143+
144+
<MenuItem IsEnabled="True" Header="Test">
145+
<MenuItem.Icon>
146+
<PathIcon Data="{StaticResource PasswordRevealPath}"
147+
Height="9" Width="12" />
148+
</MenuItem.Icon>
149+
</MenuItem>
150+
151+
<MenuItem IsEnabled="False">
152+
<MenuItem.Header>
153+
<StackPanel>
154+
<Image Source="{StaticResource FolderIcon}" />
155+
<TextBlock Text="Menu Item" />
156+
</StackPanel>
157+
</MenuItem.Header>
158+
</MenuItem>
159+
160+
<MenuItem IsEnabled="True">
161+
<MenuItem.Header>
162+
<StackPanel>
163+
<Image Source="{StaticResource FolderIcon}" />
164+
<TextBlock Text="Menu Item" />
165+
</StackPanel>
166+
</MenuItem.Header>
167+
</MenuItem>
168+
169+
<MenuItem IsEnabled="True">
170+
<MenuItem.Header>
171+
<StackPanel>
172+
<Image Source="{StaticResource FolderIcon}" />
173+
<TextBlock Text="Menu Item" />
174+
</StackPanel>
175+
</MenuItem.Header>
176+
</MenuItem>
177+
178+
<MenuItem IsEnabled="True">
179+
<MenuItem.Header>
180+
<StackPanel>
181+
<Image Source="{StaticResource FolderIcon}" />
182+
<TextBlock Text="Menu Item" />
183+
</StackPanel>
184+
</MenuItem.Header>
185+
</MenuItem>
186+
187+
<MenuItem IsEnabled="True">
188+
<MenuItem.Header>
189+
<StackPanel>
190+
<Image Source="{StaticResource FolderIcon}" />
191+
<TextBlock Text="Menu Item" />
192+
</StackPanel>
193+
</MenuItem.Header>
194+
</MenuItem>
195+
196+
<MenuItem>
197+
<MenuItem.Header>
198+
<StackPanel>
199+
<Image Source="{StaticResource FolderIcon}" />
200+
<TextBlock Text="Menu Item" />
201+
</StackPanel>
202+
</MenuItem.Header>
203+
</MenuItem>
204+
</Menu>
205+
206+
<Border Background="Silver" />
207+
</DockPanel>
208+
</Panel>
209+
210+
</UserControl>

‎samples/SampleApp/DemoPages/MenuDemo.axaml.cs

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
using Avalonia;
2+
using Avalonia.Controls;
3+
using Avalonia.Markup.Xaml;
4+
5+
namespace SampleApp.DemoPages;
6+
7+
public partial class MenuDemo : UserControl
8+
{
9+
public MenuDemo()
10+
{
11+
InitializeComponent();
12+
}
13+
}

‎samples/SampleApp/DemoPages/MenuFlyoutDemo.axaml

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<UserControl xmlns="https://github.com/avaloniaui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
4+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
5+
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
6+
x:Class="SampleApp.DemoPages.MenuFlyoutDemo">
7+
8+
<Panel Margin="20">
9+
<TextBlock HorizontalAlignment="Left" VerticalAlignment="Top" Height="20"
10+
Text="Right-click me">
11+
<TextBlock.ContextFlyout>
12+
<MenuFlyout Placement="RightEdgeAlignedTop">
13+
<MenuItem Header="Open session" InputGesture="&#x2318;+O" />
14+
<MenuItem Header="Open with parameters">
15+
<MenuItem Header="Open (embedded/tabbed)" />
16+
<MenuItem Header="Open embedded SFTP connection" />
17+
<MenuItem Header="Open embedded SCP connection" InputGesture="&#x2318;+S" IsEnabled="False" />
18+
<MenuItem Header="-" />
19+
<MenuItem Header="Open (select credentials)..." />
20+
</MenuItem>
21+
<MenuItem Header="View password" />
22+
<MenuItem Header="Copy name" />
23+
<MenuItem Header="Copy password" />
24+
<MenuItem Header="-" />
25+
<MenuItem Header="Focus session" />
26+
<MenuItem Header="Edit" IsEnabled="False">
27+
<MenuItem Header="Dummy1" />
28+
<MenuItem Header="Dummy2" />
29+
</MenuItem>
30+
<MenuItem Header="Toggle Options">
31+
<MenuItem Header="Option 1" ToggleType="CheckBox" />
32+
<MenuItem Header="Option 2" ToggleType="CheckBox" IsChecked="True" />
33+
</MenuItem>
34+
</MenuFlyout>
35+
</TextBlock.ContextFlyout>
36+
</TextBlock>
37+
</Panel>
38+
39+
</UserControl>

‎samples/SampleApp/DemoPages/MenuFlyoutDemo.axaml.cs

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
using Avalonia.Controls;
2+
3+
namespace SampleApp.DemoPages;
4+
5+
public partial class MenuFlyoutDemo : UserControl
6+
{
7+
public MenuFlyoutDemo()
8+
{
9+
InitializeComponent();
10+
}
11+
}

‎samples/SampleApp/MainWindow.axaml

+10-1
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,22 @@
2626
<TabItem Header="ComboBox">
2727
<demoPages:ComboBoxDemo />
2828
</TabItem>
29-
<TabItem Header="DataGrid" IsSelected="True">
29+
<!-- <TabItem Header="ContextMenu"> -->
30+
<!-- <demoPages:ContextMenuDemo /> -->
31+
<!-- </TabItem> -->
32+
<TabItem Header="DataGrid">
3033
<demoPages:DataGridDemo>
3134
<demoPages:DataGridDemo.DataContext>
3235
<vm:DataGridViewModel />
3336
</demoPages:DataGridDemo.DataContext>
3437
</demoPages:DataGridDemo>
3538
</TabItem>
39+
<!-- <TabItem Header="Menu"> -->
40+
<!-- <demoPages:MenuDemo /> -->
41+
<!-- </TabItem> -->
42+
<TabItem Header="MenuFlyout" IsSelected="True">
43+
<demoPages:MenuFlyoutDemo />
44+
</TabItem>
3645
<TabItem Header="TabControl">
3746
<demoPages:TabControlDemo />
3847
</TabItem>

0 commit comments

Comments
 (0)