WPF (.Net5) Dropdown menu - menu item not lining up with main menu

Question

I've created a simple WPF app with a menubar in the first row of the main grid. I've added several menuitems to the grid:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="20"/>
    </Grid.RowDefinitions>

    <Menu x:Name="MainMenuBar" Grid.Row="0" HorizontalContentAlignment="Left">
        <MenuItem Header="_File" HorizontalContentAlignment="Left">
            <MenuItem x:Name="NewProjectMenuItem"
                      Header="_New Project"
                      InputGestureText="Ctrl+N"
                      Click="NewProjectMenuItem_Click"
                      HorizontalAlignment="Left"/>
            <MenuItem x:Name="OpenProjectMenuItem" 
                      Header="_Open Project" 
                      InputGestureText="Ctrl+O" 
                      Click="OpenProjectMenuItem_Click" 
                      HorizontalAlignment="Left"/>
            <MenuItem x:Name="CloseProjectMenuItem" 
                      Header="_Close Project" 
                      Click="CloseProjectMenuItem_Click" 
                      HorizontalAlignment="Left"/>
            <Separator/>
            <MenuItem x:Name="SaveProjectMenuItem" 
                      Header="_Save Project" 
                      InputGestureText="Ctrl+S" 
                      Click="SaveProjectMenuItem_Click" 
                      HorizontalAlignment="Left"/>
        </MenuItem>
        <MenuItem Header="_Edit" HorizontalContentAlignment="Left">
            <MenuItem x:Name="ToggleIncludeInBuild" 
                      Header="Toggle Include in _Build" 
                      InputGestureText="Shift+F1" 
                      Click="ToggleIncludeInBuild_Click" 
                      HorizontalAlignment="Left"/>
        </MenuItem>
    </Menu>
    <Grid x:Name="ContenGrid" Grid.Row="1"></Grid>
    <StatusBar x:Name="StatusBar" Grid.Row="2"></StatusBar>
</Grid>

When I click on the File or Edit menu items, the child menu items do not line up with how drop down menus normally behave in a windows forms app. They are offset with the right edge of the child menu item aligned with the right edge of the parent menu.

score 0 · Answer 1 · answered Jun 25 '21 at 04:50

If I understood you correctly you are either talking about gesture alignment as its not consistent and a bit off in that case just remove all unnecessary HorizontalAlignment="Left".

 <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="20"/>
    </Grid.RowDefinitions>

    <Menu x:Name="MainMenuBar" Grid.Row="0" HorizontalContentAlignment="Left">
        <MenuItem Header="_File"  >
            
            <MenuItem x:Name="NewProjectMenuItem"
                  Header="_New Project"
                  InputGestureText="Ctrl+N"
                  
                 />
            <MenuItem x:Name="OpenProjectMenuItem" 
                  Header="_Open Project" 
                  InputGestureText="Ctrl+O" 
                  
                  />
            <MenuItem x:Name="CloseProjectMenuItem" 
                  Header="_Close Project" 
                  
                  />
            <Separator/>
            <MenuItem x:Name="SaveProjectMenuItem" 
                  Header="_Save Project" 
                  InputGestureText="Ctrl+S" 
                  
                  />
        </MenuItem>
        <MenuItem Header="_Edit"  >
            <MenuItem x:Name="ToggleIncludeInBuild" 
                  Header="Toggle Include in _Build" 
                  InputGestureText="Shift+F1" 
                  />
        </MenuItem>
    </Menu>
    <Grid x:Name="ContenGrid" Grid.Row="1"></Grid>
    <StatusBar x:Name="StatusBar" Grid.Row="2"></StatusBar>
</Grid>

Or you maybe want to remove that left Icon column then here is a link for that... WPF - How to style the menu control to remove the left margin?

And Check MaterialDesign for better controls and styles... http://materialdesigninxaml.net https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit

No, the HorizontalAlignment attribute was added in an attempt to solve the problem. — user1325543, Jun 27 '21 at 16:47

score 0 · Answer 2 · answered Sep 28 '21 at 15:01

0

I had a similar problem. Found it was actually a windows setting not a WPF setting. I was programming on a laptop that has a touch screen which defaulted to right hand menu mode. If you notice that visual studio is doing this also, it is not a code issue but a windows 10 setting.

This solved it for me

answered Sep 28 '21 at 15:01

Robert Thompson

1

1

This does not really answer the question. If you have a different question, you can ask it by clicking [Ask Question](https://stackoverflow.com/questions/ask). To get notified when this question gets new answers, you can [follow this question](https://meta.stackexchange.com/q/345661). Once you have enough [reputation](https://stackoverflow.com/help/whats-reputation), you can also [add a bounty](https://stackoverflow.com/help/privileges/set-bounties) to draw more attention to this question. - [From Review](/review/late-answers/29943701) – Beso Sep 28 '21 at 17:09

WPF (.Net5) Dropdown menu - menu item not lining up with main menu

2 Answers2