microsoft / microsoft/microsoft-ui-xaml
Compact sizing resource does not affect MenuBar styles, remains non-compact after enabling compact sizing
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 8.4k
- Forks
- 942
- Avg merge
- 2d 7h
- Merged PRs (30d)
- 105
Description
Describe the bug
When the app enables compact sizing via the documented compact sizing resource, controls such as ListView, TextBox, etc, properly adopt compact spacing. However MenuBar does not change it retains default spacing, padding and font sizes. This makes menus visually inconsistent with other compact controls.
Why is this important?
The documentation in the sample app says that it is supported, however, when you use the stylesheet with a MenuBar, the style does not change to become more compact.
Steps to reproduce the bug
Create a blank WinUI application, use the compact density styles globally, and add a MenuBar to MainWindow.xaml
App.xaml
<?xml version="1.0" encoding="utf-8" ?>
<Application
x:Class="App1.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
<ResourceDictionary Source="ms-appx:///Microsoft.UI.Xaml/DensityStyles/Compact.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>
MainWindow.xaml
<?xml version="1.0" encoding="utf-8" ?>
<Window
x:Class="App1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:App1"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Title="App1"
mc:Ignorable="d">
<Window.SystemBackdrop>
<MicaBackdrop />
</Window.SystemBackdrop>
<Grid RowSpacing="50">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<MenuBar Grid.Row="2">
<MenuBarItem Title="File" FontSize="5">
<MenuFlyoutSubItem Text="New">
<MenuFlyoutItem Text="Plain Text Document" />
<MenuFlyoutItem Text="Rich Text Document" />
<MenuFlyoutItem Text="Other Formats..." />
</MenuFlyoutSubItem>
<MenuFlyoutItem Text="Open..." />
<MenuFlyoutItem Text="Save" />
<MenuFlyoutSeparator />
<MenuFlyoutItem Text="Exit" />
</MenuBarItem>
<MenuBarItem Title="Edit">
<MenuFlyoutItem Text="Undo" />
<MenuFlyoutItem Text="Cut" />
<MenuFlyoutItem Text="Copy" />
<MenuFlyoutItem Text="Paste" />
</MenuBarItem>
<MenuBarItem Title="View">
<MenuFlyoutItem Text="Output" />
<MenuFlyoutSeparator />
<RadioMenuFlyoutItem GroupName="OrientationGroup" Text="Landscape" />
<RadioMenuFlyoutItem
GroupName="OrientationGroup"
IsChecked="True"
Text="Portrait" />
<MenuFlyoutSeparator />
<RadioMenuFlyoutItem GroupName="SizeGroup" Text="Small icons" />
<RadioMenuFlyoutItem
GroupName="SizeGroup"
IsChecked="True"
Text="Medium icons" />
<RadioMenuFlyoutItem GroupName="SizeGroup" Text="Large icons" />
</MenuBarItem>
<MenuBarItem Title="Help">
<MenuFlyoutItem Text="About" />
</MenuBarItem>
</MenuBar>
<TextBox Grid.Row="1" PlaceholderText="text box that is compact" />
</Grid>
</Window>
Actual behavior
MenuBar does not change
Expected behavior
Compact Sizing should reduce the font size, padding of the MenuBar
Screenshots
Compact Styles applied globally, but not to menubar:
No compact styles applied, menubar has same styles as above:
NuGet package version
WinUI 3 - Windows App SDK 1.8.3: 1.8.251106002
Windows version
Windows 11 (24H2): Build 26100
Additional context
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the compact resource merged in App.xaml and the MenuBar usage in MainWindow.xaml. Compare the MenuBar styling with the compact controls shown in the reproduction, then run the sample to verify the font size and padding change when Compact.xaml is enabled.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- cpp
- Domain
- desktop, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100