How to Display Arrows for MenuItem?

Question

I am working on/learning WPF to use with PowerShell. I needed a customized MenuItem, and I managed to come up with the code below. The code works well and retains all the functions of a traditional MenuItem without customization, but so far, I haven't been able to add the functionality of displaying an arrow when an item (other than the parent item) has submenus.

In summary

I have this:

I need to add this:

Code:

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Project"
    Width="400" Height="520"
    ResizeMode="CanMinimize"
    WindowStartupLocation="CenterScreen"
    Background="#191919">

<Window.Resources>

    <Style TargetType="MenuItem">
        <Setter Property="Foreground" Value="#E6E6E6"/>
        <Setter Property="Background" Value="#4C4C4C"/>
        <Setter Property="Padding" Value="3"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="MenuItem">
                    <Grid Background="{TemplateBinding Background}">
                        <Border x:Name="Border" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                            <TextBlock x:Name="MenuItemText" 
                                       Text="{Binding Path=Header, RelativeSource={RelativeSource TemplatedParent}}"
                                       HorizontalAlignment="Left" VerticalAlignment="Center" Foreground="{TemplateBinding Foreground}"/>
                        </Border>

                        <Popup x:Name="SubMenuPopup" IsOpen="{TemplateBinding IsSubmenuOpen}" Placement="Right">
                            <Grid Background="{TemplateBinding Background}">
                                <ItemsPresenter/>
                            </Grid>
                        </Popup>
                    </Grid>

                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSubmenuOpen" Value="True">
                            <Setter TargetName="MenuItemText" Property="Foreground" Value="#E6E6E6"/>
                            <Setter TargetName="Border" Property="Background" Value="#2B2B2B"/>
                        </Trigger>

                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="MenuItemText" Property="Foreground" Value="#2B2B2B"/>
                            <Setter TargetName="Border" Property="Background" Value="#E6E6E6"/>
                        </Trigger>

                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="MenuItemText" Property="Foreground" Value="#7F7F7F"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>

    <Grid>

        <Menu HorizontalAlignment="Right" VerticalAlignment="Bottom">
            <MenuItem Header="  Apoiar  "/>
            <MenuItem Header="  Sobre  ">
                <MenuItem Header="EmLogs"/>
                <MenuItem Header="Licenças de Terceiros">
                    <MenuItem Header="BrowserDownloadsView"/>
                    <MenuItem Header="BrowsingHistoryView"/>
                    <MenuItem Header="CSVFileView"/>
                    <MenuItem Header="Everything"/>
                    <MenuItem Header="ExecutedProgramsList"/>
                    <MenuItem Header="InstalledDriversList"/>
                    <MenuItem Header="LastActivityView"/>
                    <MenuItem Header="ProcessExplorer" IsEnabled="False"/>
                    <MenuItem Header="RegScanner"/>
                    <MenuItem Header="ShellBagsView"/>
                    <MenuItem Header="System Informer">
                        <MenuItem Header="Licença"/>
                        <MenuItem Header="Licenças de Terceiros"/>
                    </MenuItem>
                    <MenuItem Header="TaskSchedulerView"/>
                    <MenuItem Header="WebBrowserBookmarksView"/>
                    <MenuItem Header="WhatInStartup"/>
                    <MenuItem Header="WinDefLogView"/>
                </MenuItem>
            </MenuItem>
        </Menu>

    </Grid>

</Window>

Answer 1

I tried this and it works for me:

        <Style TargetType="MenuItem">
            <Setter Property="Foreground" Value="#E6E6E6"/>
            <Setter Property="Background" Value="#4C4C4C"/>
            <Setter Property="Padding" Value="3"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="MenuItem">
                        <Grid Background="{TemplateBinding Background}" MinWidth="150">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>

                            
                            <TextBlock x:Name="MenuItemText"
                                       Text="{Binding Path=Header, RelativeSource={RelativeSource TemplatedParent}}"
                                       HorizontalAlignment="Left" VerticalAlignment="Center"
                                       Foreground="{TemplateBinding Foreground}" Grid.Column="0"/>

                            
                            <Path x:Name="Arrow" Data="M 0 0 L 4 4 L 0 8 Z" Fill="{TemplateBinding Foreground}"
                                  HorizontalAlignment="Center" VerticalAlignment="Center"
                                  Visibility="Collapsed" Grid.Column="1" />

                            
                            <Popup x:Name="SubMenuPopup" IsOpen="{TemplateBinding IsSubmenuOpen}" Placement="Right">
                                <Grid Background="{TemplateBinding Background}">
                                    <ItemsPresenter/>
                                </Grid>
                            </Popup>
                        </Grid>

                        <ControlTemplate.Triggers>
                            <!-- Trigger: Arrow just for child items -->
                            <Trigger Property="HasItems" Value="True">
                                <Setter TargetName="Arrow" Property="Visibility" Value="Visible"/>
                            </Trigger>
                            <Trigger Property="HasItems" Value="False">
                                <Setter TargetName="Arrow" Property="Visibility" Value="Collapsed"/>
                            </Trigger>
                            <!-- Trigger: Hide arrow at parents -->
                            <Trigger Property="Role" Value="TopLevelHeader">
                                <Setter TargetName="Arrow" Property="Visibility" Value="Collapsed"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>