Làm thế nào để thiết lập một biểu tượng trong MenuItem một ContextMenu khi sử dụng ItemContainerStyle

Question

Vì vậy, tôi có một Context Menu Và một MenuItem trong nó mà phá vỡ ra thành một danh sách các tên:

<ContextMenu> 
    <MenuItem Header="Set As Default For" ItemsSource="{Binding Source={StaticResource Names}}"> 
     <MenuItem.ItemContainerStyle> 
      <Style TargetType="MenuItem"> 
       <Setter Property="Header" Value={Binding Name}/> 
       <Setter Property="Command" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=MenuItem}, Path=DataContext.DoSomething}" /> 
       <Setter Property="CommandParameter" Value="{Binding }" /> 
      </Style> 
     </MenuItem.ItemContainerStyle> 
    </MenuItem> 
</ContextMenu> 

Bây giờ các mã trên hoạt động tập tin và hiển thị của tôi danh sách tên. Bây giờ tôi muốn thêm một biểu tượng bên cạnh mỗi tên sử dụng một gói URI .. Vì vậy, từ this question tôi có thể thấy cách tốt nhất để làm điều đó là để template các Header vì vậy tôi cố gắng mà lần đầu tiên như câu hỏi

<ContextMenu> 
    <MenuItem Header="Set As Default For" ItemsSource="{Binding Source={StaticResource Names}}"> 
     <MenuItem.ItemContainerStyle> 
      <Style TargetType="MenuItem"> 
       <Setter Property="Header"> 
        <Setter.Value> 
         <StackPanel> 
           <Image Width="20" Height="20" Source="/MyProj;component/Resources/MyImg.png" /> 
           <ContentPresenter Content="{Binding Name}" /> 
          </StackPanel> 
        </Setter.Value> 
       </Setter> 
       <Setter Property="Command" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=MenuItem}, Path=DataContext.DoSomething}" /> 
       <Setter Property="CommandParameter" Value="{Binding }" /> 
      </Style> 
     </MenuItem.ItemContainerStyle> 
    </MenuItem> 
</ContextMenu> 

nhưng điều này đã cho tôi lỗi:

Specified element is already the logical child of another element. Disconnect it first.

Vì vậy, tôi sau khi một số nghiên cứu tôi đã cố gắng:

<ContextMenu> 
    <MenuItem Header="Set As Default For" ItemsSource="{Binding Source={StaticResource Names}}"> 
     <MenuItem.ItemContainerStyle> 
      <Style TargetType="MenuItem"> 
       <Setter Property="Header"> 
        <Setter.Value> 
         <ControlTemplate> 
          <StackPanel> 
            <Image Width="20" Height="20" Source="/MyProj;component/Resources/MyImg.png" /> 
            <ContentPresenter Content="{Binding Name}" /> 
           </StackPanel> 
          </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
       <Setter Property="Command" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=MenuItem}, Path=DataContext.DoSomething}" /> 
       <Setter Property="CommandParameter" Value="{Binding }" /> 
      </Style> 
     </MenuItem.ItemContainerStyle> 
    </MenuItem> 
</ContextMenu> 

nhưng bây giờ tất cả các tên của tôi là ControlTemplate và không có biểu tượng là màn hình ed ...

Làm cách nào để thêm biểu tượng vào Menu của Menu ngữ cảnh thông qua ItemContainerStyle?

EDIT

Tôi đã thử:

<Setter Property="Header" Value="{Binding Name}"/> 
    <Setter Property="Icon"> 
     <Setter.Value> 
      <Image Width="20" Height="20" Source="/MyProj;component/Resources/MyImg.png" /> 
     </Setter.Value> 
    </Setter> 

Và tôi nhận được một biểu tượng render nhưng chỉ cho mục cuối cùng trong trình đơn của tôi?

Answer 1

Vấn đề là bạn không thể sử dụng một hình ảnh ở nhiều nơi hơn một nơi. Bạn có thể làm điều đó bằng cách sử dụng HeaderTemplate thay vì Header, nhưng sử dụng DataTemplate thay vì ControlTemplate

<Style TargetType="MenuItem"> 
    <Setter Property="HeaderTemplate"> 
     <Setter.Value> 
     <DataTemplate> 
      <StackPanel> 
       <Image Width="20" Height="20" Source="/MyProj;component/Resources/MyImg.png" /> 
       <ContentPresenter Content="{Binding Name}" /> 
      </StackPanel> 
     </DataTemplate> 
     </Setter.Value> 
    </Setter> 
    <!-- other setters --> 
</Style> 

Lưu ý rằng giải pháp này sẽ đặt biểu tượng ở phần nội dung của MenuItem, không phải là biểu tượng. Một giải pháp khác là đặt thuộc tính Icon của MenuItem là Setter khác nhưng trong trường hợp này, Image cần phải riêng biệt Resource với x:Shared đặt thành false nếu không bạn sẽ kết thúc với cùng một vấn đề mà chỉ mục cuối cùng có biểu tượng.

<ContextMenu> 
    <ContextMenu.Resources> 
     <Image Width="20" Height="20" Source="/MyProj;component/Resources/MyImg.png" x:Key="myMenuIcon" x:Shared="False" /> 
    </ContextMenu.Resources> 
    <MenuItem Header="Set As Default For" ItemsSource="{Binding Source={StaticResource Names}}"> 
     <MenuItem.ItemContainerStyle> 
     <Style TargetType="{x:Type MenuItem}"> 
      <Setter Property="Header" Value="{Binding Name}"/> 
      <Setter Property="Icon" Value="{StaticResource myMenuIcon}"/> 
     </Style> 
     </MenuItem.ItemContainerStyle> 
    </MenuItem> 
</ContextMenu>