如何在ContextMenu中用Icon替换Icon

Question

我需要用一个Rectangle替换MenuItem中的Icon。目前我有这个：

<TextBox.ContextMenu>
    <ContextMenu Focusable="False" ItemsSource="{Binding Categories}">                           
        <ContextMenu.ItemContainerStyle>
            <Style TargetType="{x:Type MenuItem}">
                <Setter Property="Header" Value="{Binding Name}"/>
                <Setter Property="Focusable" Value="False"/>         
            </Style>         
        </ContextMenu.ItemContainerStyle>
    </ContextMenu>
</TextBox.ContextMenu>

哪种方法正常：

但我无法弄清楚如何编辑 MenuItem.Icon 并将其替换为矩形。

我尝试过使用DataTemplate：

<TextBox.ContextMenu>
    <ContextMenu Focusable="False" ItemsSource="{Binding Categories}">
        <ContextMenu.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" >
                    <Rectangle Width="20" Height="20" Fill="{Binding CategoryColor}"/>
                    <Label Content="{Binding Name}"/>
                </StackPanel>
            </DataTemplate>
        <ContextMenu.ItemTemplate>
     </ContextMenu>
</TextBox.ContextMenu>

虽然看起来没问题，但将矩形放入图标区域会更好 - 或者完全删除图标区域。我还必须考虑将Command绑定到MenuItem，如果这对方法有所影响。

可能的解决方案： 我试过了：

<TextBox.ContextMenu>
    <ContextMenu Focusable="False" ItemsSource="{Binding Categories}">
        <ContextMenu.Resources>
            <Rectangle x:Key="myRectangle" x:Shared="False" Width="20" Height="20" Fill="{Binding CategoryColor}"/>
        </ContextMenu.Resources>
        <ContextMenu.ItemContainerStyle>
            <Style TargetType="{x:Type MenuItem}">
                <Setter Property="Header" Value="{Binding Name}"/>
                <Setter Property="Focusable" Value="False"/>  
                <Setter Property="Icon" Value="{StaticResource myRectangle}"/>
            </Style>         
        </ContextMenu.ItemContainerStyle>
   </ContextMenu>
</TextBox.ContextMenu>

但这只显示最后一个矩形：

Answer 1

第二个选项是在ResourceDictionary中定义一个Rectangle，其中x：Shared设置为False：

<ResourceDictionary>
    <Rectangle x:Key="myRectangle" x:Shared="False" Width="20" Height="20" Fill="{Binding CategoryColor}" />
</ResourceDictionary>

...然后在你的风格中使用它：

<TextBox>
    <TextBox.ContextMenu>
        <ContextMenu Focusable="False" ItemsSource="{Binding Categories}">
            <ContextMenu.ItemContainerStyle>
                <Style TargetType="{x:Type MenuItem}">
                    <Setter Property="Header" Value="{Binding Name}"/>
                    <Setter Property="Focusable" Value="False"/>
                    <Setter Property="Icon" Value="{StaticResource myRectangle}" />
                </Style>
            </ContextMenu.ItemContainerStyle>
        </ContextMenu>
    </TextBox.ContextMenu>
</TextBox>

Answer 2

我不得不处理类似的情况，并且在尝试覆盖默认样式并再次完成所有样式之后..我意识到在矩形上有一个-ve边距将是最简单的方法..

<StackPanel Orientation="Horizontal" Margin="-20,0,0,0">
        <Rectangle Width="20" Height="20" Fill="{Binding CategoryColor}"/>
         <Label Content="{Binding Name}"/>
</StackPanel>