WPF - Comment style le contrôle de menu pour supprimer la marge de gauche?

Ce n'est pas très simple, mais vous devez créer un MenuItemStyle, plus facile grâce à l'Expression Blend:

<Menu>
    <MenuItem Header="MyMenu" Style="{DynamicResource MenuItemStyle1}">
        <MenuItem Header="Options..." />
        <MenuItem Header="About" />
    </MenuItem>
</Menu> 

Il crée une très verbeux ensemble de modèles et de styles, et vous avez besoin de modifier l'élément de menu pour supprimer le fixe la largeur de la première colonne de la grille, puis dans le SubMenuBorder ContentControl modèle, supprimer les rectangles qui forment la trame de fond. J'ai joint un exemple de projet avec des marges supprimé.
Télécharger des exemples de projet ici.

Ma façon simple est d'utiliser une marge négative de la Grille dans l'ItemTemplate

<ContextMenu.ItemTemplate>
    <DataTemplate>
        <Grid Margin="-20,0,-40,0"><!--this part is important-->
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="20"/>
                <ColumnDefinition Width="1*"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" Text="{Binding Ident}"/>
            <TextBlock Grid.Column="1" Text="{Binding Description}"/>
        </Grid>
    </DataTemplate>
</ContextMenu.ItemTemplate>

voir la réponse complète ici

Pour supprimer l'espace et de ne jamais utiliser les icônes que vous avez à changer le modèle de MenuItem.SubmenuItemTemplateKey ou le modèle de MenuItem.
Si vous avez juste besoin de lire de la ligne verticale et de continuer à utiliser les icônes de l'espace de suivre cette answare.

Fenêtres avec grille a mon CustomContextMenu.xaml comme une grille de ressources:

<Window ...>
    <Grid>
        <Grid.Resources>
            <ResourceDictionary Source="CustomContextMenu.xaml"/>
        </Grid.Resources>
        <Grid.ContextMenu>
            <ContextMenu>
                <MenuItem Header="Menu item 1" >
                    <MenuItem Header="Menu item 2" >
                        <MenuItem.Icon>
                            <Image Source="icon.jpg"/>
                        </MenuItem.Icon>
                    </MenuItem>
                </MenuItem>
                <Separator Style="{StaticResource MySeparatorStyle}" />
                <MenuItem IsEnabled="False" Header="Menu item 3" />
            </ContextMenu>
        </Grid.ContextMenu>
        <TextBlock>test</TextBlock>
    </Grid>
</Window>

Voici mon CustomContextMenu.xaml qui a un CustomSeparatorStyle modèle de prolonger la ligne de séparation de la marge de gauche du menu de contexte. Et un ContextMenu modèle pour masquer la ligne verticale.

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Outer menu -->
<Style TargetType="{x:Type ContextMenu}">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="MaxWidth" Value="295" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ContextMenu}">
<!--Here is where you change the border thickness to zero on the menu-->
<Border BorderThickness="1"
x:Name="Border"
CornerRadius="0"
BorderBrush="{TemplateBinding BorderBrush}"
Background="#CCCCC7">
<Border.Effect>
<DropShadowEffect
ShadowDepth="2" Color="Black" Direction="135" Opacity=".8"/>
</Border.Effect>
<StackPanel ClipToBounds="True"
Orientation="Vertical"
IsItemsHost="True" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter TargetName="Border"
Property="Background"
Value="#F7F7F4" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- Separator -->
<Style TargetType="{x:Type Separator}" x:Key="CustomSeparatorStyle">
<Setter Property="Height" Value="1" />
<Setter Property="Margin" Value="-30,5,0,5"/>
<Setter Property="Background" Value="#F7F7F4" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Separator}">
<Border BorderBrush="#DADAD6" BorderThickness="1" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Le droit sude menu est créé avec le code ci-dessus. Vous pouvez remarquer la différence de taille et d'ombre. Afin de garder l'ombre du menu initial, vous devez exclure de la Frontière.Effet

Utiliser un RadMenuGroupItem.

RadMenuGroupItem hérite de RadMenuItem classe et il est utilisé comme conteneur d'un RadMenuItem liste déroulante. En d'autres termes un élément de l'INTERFACE utilisateur peut être placé à l'intérieur de RadMenuGroupItem. Par défaut, la couleur de fond de RadMenuGroupItem est Blanc et il n'y a pas d'Icône de la zone avec une couleur différente à la différence de RadMenuItem, de sorte que vous pouvez facilement utiliser différentes tailles d'Icônes dans la liste déroulante. En plus de cette RadMenuGroupItem a également un en-Tête de la propriété, qui est affiché sur le haut de tous les éléments de groupe.

<telerik:RadMenu VerticalAlignment="Top">
<telerik:RadMenuItem Header="Shapes" />
<telerik:RadMenuItem Header="Sizes">
<telerik:RadMenuGroupItem Header="Header">
<telerik:RadMenuItem Header="Small" IconTemplate="{StaticResource IconTemplate}" IconColumnWidth="35" Height="35" />
<telerik:RadMenuItem Header="Medium" IconTemplate="{StaticResource IconTemplate}" IconColumnWidth="45" Height="45" />
<telerik:RadMenuItem Header="Large" IconTemplate="{StaticResource IconTemplate}" IconColumnWidth="55" Height="55" />
</telerik:RadMenuGroupItem>
</telerik:RadMenuItem>

Et voilà le résultat: