locked
Removing the "Icon Bar" from ContextMenu? RRS feed

  • Question

  • I'd like to have a ContextMenu without the "icon bar" on the left, but for the life of me can't figure out how to get rid of it. I tried playing around with templates for MenuItem, as other people around the web have suggested, but couldn't get rid of the actual bar.

    Considering that the "icon bar" is visible even when you don't add a MenuItem, and add a Button or Canvas or whatever, I don't really understand how editing the MenuItem template would be of any use. I tried fiddling around with the ContextMenu template(http://msdn.microsoft.com/en-us/library/ms744758.aspx), but got this error message in XML: "ContextMenuService does not have a matching DependencyObjectType".

    I've been frustrated with WPF on other issues before as well, but I've never spent this much time trying to figure out a solution for a problem that should be pretty easy&straightforward to fix.

     

    For those of you who don't know what I mean: http://www.wpftutorial.net/images/contextmenu.jpg (the grey bar on the left)

    Saturday, June 11, 2011 7:44 AM

Answers

  • Hi Jellio,

    The Item in ContextMenu will be wrapped by a MenuItem object if it's type is not MenuItem.

    You can re-template the MenuItem to remove the icon column.

    Here is a simple sample.

        <PathGeometry x:Key="Checkmark">
          <PathGeometry.Figures>
            <PathFigureCollection>
              <PathFigure StartPoint="0 2"
                  IsClosed="True"
                  IsFilled="True">
                <PathFigure.Segments>
                  <PathSegmentCollection>
                    <LineSegment Point="0 4.8"/>
                    <LineSegment Point="2.5 7.4"/>
                    <LineSegment Point="7.1 2.8"/>
                    <LineSegment Point="7.1 0"/>
                    <LineSegment Point="2.5 4.6"/>
                  </PathSegmentCollection>
                </PathFigure.Segments>
              </PathFigure>
            </PathFigureCollection>
          </PathGeometry.Figures>
        </PathGeometry>
        <ControlTemplate x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type MenuItem}, ResourceId=SubmenuItemTemplateKey}"
               TargetType="{x:Type MenuItem}">
          <Border Name="Bd"
            Background="{TemplateBinding Background}"
            BorderThickness="{TemplateBinding BorderThickness}"
            BorderBrush="{TemplateBinding BorderBrush}">
            <Grid>
              <Grid.ColumnDefinitions>
                <ColumnDefinition
                       Width="0"
                       SharedSizeGroup="MenuItemIconColumnGroup"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"
                       SharedSizeGroup="MenuItemIGTColumnGroup"/>
                <ColumnDefinition Width="14"/>
              </Grid.ColumnDefinitions>
              <ContentPresenter x:Name="Icon"
                     Margin="4,0,6,0"
                     VerticalAlignment="Center"
                     ContentSource="Icon"/>
              <Path x:Name="GlyphPanel"
               Margin="4,0,6,0"
               Visibility="Hidden"
               VerticalAlignment="Center"
               Fill="{TemplateBinding Foreground}"
               FlowDirection="LeftToRight"
               Data="{StaticResource Checkmark}"/>
              <ContentPresenter 
                     Grid.Column="1"
                     ContentSource="Header"
                     Margin="{TemplateBinding Padding}"
                     RecognizesAccessKey="True"/>
              <TextBlock x:Name="InputGestureText"
                  Grid.Column="2"
                  Text="{TemplateBinding InputGestureText}"
                  Margin="5,2,0,2"
                  DockPanel.Dock="Right"/>
            </Grid>
          </Border>
          <ControlTemplate.Triggers>
            <Trigger Property="Icon"
               Value="{x:Null}">
              <Setter TargetName="Icon"
                Property="Visibility"
                Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsChecked"
               Value="true">
              <Setter TargetName="GlyphPanel"
                Property="Visibility"
                Value="Visible"/>
              <Setter TargetName="Icon"
                Property="Visibility"
                Value="Collapsed"/>
            </Trigger>
            <Trigger Property="IsHighlighted"
               Value="true">
              <Setter TargetName="Bd"
                Property="Background"
                Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
              <Setter Property="Foreground"
                Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
            </Trigger>
            <Trigger Property="IsEnabled"
               Value="false">
              <Setter Property="Foreground"
                Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
            </Trigger>
          </ControlTemplate.Triggers>
        </ControlTemplate>
    

    Best regards,


    Min Zhu [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by Min Zhu Friday, June 17, 2011 2:16 AM
    Tuesday, June 14, 2011 8:56 AM