Estilo de menú contextual predeterminado: WPF

Question

Estoy tratando de modificar el estilo predeterminado de ContextMenu en WPF.

Normalmente, puede crear una copia del valor predeterminado en Expression Blend utilizando Editar partes de control (Plantilla) > Edite una opción de menú Copiar. Sin embargo, no puedo resolver cómo hacer esto con un ContextMenu. ¿Alguna idea de cómo puedo modificar el estilo predeterminado?

Estoy tratando de desactivar el lado izquierdo del menú contextual donde normalmente se muestran los iconos.

¡Gracias!

Actualización: Tal vez no estaba claro acerca de eliminar los íconos. Por ejemplo, si tiene un menú contextual sin iconos, todo el lado izquierdo del menú es espacio desperdiciado. Me gustaría modificar el estilo predeterminado del fondo del menú contextual para eliminar esto. Simplemente no sé cómo acceder a este estilo predeterminado.

Answer 1

Para plantillas y estilos a los que no se puede acceder a través de la interfaz de expresión (como la plantilla ContextMenu), puede usar el siguiente código para extraer la plantilla:

Dim sb As System.Text.StringBuilder = New System.Text.StringBuilder
Using Writer As TextWriter = New StringWriter(sb)
    System.Windows.Markup.XamlWriter.Save(ContextMenu.Template, Writer)
End Using
Debug.Write(sb.ToString)

O en C #

var str = new StringBuilder();
using (var writer = new StringWriter(str))
    XamlWriter.Save(ContextMenu.Template, writer);
Debug.Write(str);

Answer 2

Encontré la manera fácil de obtener la plantilla ContextMenu en Blend:

1. Agregué un menú contextual a un botón con algunos elementos de menú.
2. En " miscelánea " en el panel de propiedades, hay un elemento agrupado para ContextMenu.
3. Abre esto. Encontrarás las propiedades habituales de estilo y plantilla.
4. Haga clic en el cuadrado del menú emergente y seleccione Convertir en nuevo recurso ...

Eso es todo. Elija dónde desea colocar la plantilla / estilo y listo.

Aquí está el marcado que tenía:

<StackPanel x:Name="LayoutRoot">
    <Button Content="Click for ContextMenu" Width="30" HorizontalAlignment="Center" VerticalAlignment="Center">
        <Button.ContextMenu>
            <ContextMenu Template="{DynamicResource ContextMenuControlTemplate1}" Style="{DynamicResource ContextMenuStyle1}">
                <MenuItem Header="File"/>
                <MenuItem Header="Edit"/>
                <MenuItem Header="View"/>
                <MenuItem Header="Recent Files"/>
                    <MenuItem Header="file1.txt"/>
                    <MenuItem Header="file2.txt"/>
            </ContextMenu>
        </Button.ContextMenu>
    </Button>
</StackPanel>

Y el estilo / plantilla que obtuve:

<Style x:Key="ContextMenuStyle1" TargetType="{x:Type ContextMenu}">
    <Setter Property="Background" Value="{DynamicResource MenuBackgroundBrush}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="BorderBrush" Value="{DynamicResource WindowBorderBrush}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ContextMenu}">
                <Border Uid="Border_93">
                    <Border.Style>
                        <Style TargetType="{x:Type Border}">
                            <Setter Property="Tag" Value="{DynamicResource {x:Static SystemParameters.DropShadowKey}}"/>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" Value="True">
                                    <Setter Property="Background" Value="Transparent"/>
                                    <Setter Property="Padding" Value="0,0,5,5"/>
                                    <Setter Property="Effect">
                                        <Setter.Value>
                                            <DropShadowEffect BlurRadius="4" Opacity="0.8" ShadowDepth="1"/>
                                        </Setter.Value>
                                    </Setter>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Border.Style>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Espero que esto ayude. En la minuciosidad habitual de MS, no se encuentran los pinceles en el estilo predeterminado. :)

Answer 3

Pruebe esto: (Ponga este código en su parte de Recursos de su XAML) Esto debería eliminar la tira de iconos del menú contextual.

<Style TargetType="{x:Type ContextMenu}">
    <Setter Property="OverridesDefaultStyle" Value="True" />
    <Setter Property="SnapsToDevicePixels" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ContextMenu}">
                <Border BorderThickness="1" CornerRadius="4" BorderBrush="Black" x:Name="Border" Background="White">
                    <StackPanel ClipToBounds="True" Orientation="Vertical" IsItemsHost="True" />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="Border" Property="Background" Value="White" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 4

En realidad, el espacio no es parte de ContextMenu, es parte de MenuItem. Tan solo arrastre un MenuItem a su ventana en una combinación de expresiones y cree una copia del control. Espero que su declaración de ContextMenu sea la siguiente

 <ContextMenu  >
    <MenuItem Header="Copy"/>
    <MenuItem Header="Paste"/>
    <MenuItem Header="Clear"/>
 </ContextMenu>

Y dentro de su MenuItem ControlTemplate puede ver el espacio a continuación. Elimine el ícono y la primera columna de la cuadrícula que marqué en la captura de pantalla.

??

Answer 5

El espacio extra a la izquierda se debe a la pequeña marca de verificación que aparece cuando configura IsCheckable y IsChecked en true en MenuItem .

La marca de verificación está en la plantilla para MenuItem , de modo que si edita, puede eliminarla.