Open egvijayanand opened 11 months ago
Setting the AccessKey property enables this Alt key menu activation in the WinUI desktop app.
Assuming the below XML namespace is imported for this menu code snippet.
xmlns:ui="using:Microsoft.UI.Xaml.Controls"
<ui:MenuBar>
<ui:MenuBarItem
Title="File"
AccessKey="F">
<ui:MenuFlyoutItem
AccessKey="N"
Text="New" />
<ui:MenuFlyoutItem
AccessKey="X"
Text="Exit" />
</ui:MenuBarItem>
</ui:MenuBar>
Have tried a sample with the AccessKey property and it worked fine for the WinUI app. Will upload the sample to my GitHub repo and share the URL.
Here's the screenshot.
Sample app now made available here: https://github.com/egvijayanand/maui-issue-18782
Have tried to make use of this Alt key mnemonic feature with a variety of controls (Button. CheckBox, Entry), it works like a charm and it'll prove to be a great value addition to the Desktop apps.
On the Windows platform, the AccessKey property is defined at the UIElement level, so it can be applied to any Visual control. The property needs to be defined at the appropriate base control in .NET MAUI so those dummy interfaces and classes can be removed from the sample.
Have pushed the newer version of the source to the same repo.
Here's the updated screenshot:
@jsuarezruiz @davidortinau @maddymontaquila
Description
Usually, a shortcut key would be assigned for each top-level menu item (like F -> File meu, E -> Edit menu), and upon pressing the Alt key, the corresponding menu item gets activated (it gets displayed).
When the Alt key alone is pressed, the corresponding shortcut key gets highlighted in the menu bar.
In classic Windows desktop app models like WinForms, while providing the menu item text, the Ampersand char needs to be prefixed with the preferred shortcut key like &File and &Edit.
This enables us to work with the menu items using the Keyboard.
Public API Changes
A similar approach can be followed like how it's done in the classic scenario.
MenuBarItem has a Text property, the Ampersand char can be prefixed to the intended shortcut key.
Internally, while processing, the shortcut key needs to be activated by parsing the Text property.
This can be extended to MenuFlyoutItem as well so that menu items can also be activated with Keyboard.
File -> Exit as Alt + F + X for the below snippet
Since it's XAML (XML-based), the Ampersand key is encoded as &
Intended Use-Case
This enables us to work with the menu items using the Keyboard.
The missing piece of the Keyboard Accelerators and makes it feature complete.