Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get an image from a resource file into an WPF menuitem.icon

I have the following piece of code (XAML C#):

        <Menu IsMainMenu="True" DockPanel.Dock="Top">
            <MenuItem Name="fileMenu" Header="_File" />
            <MenuItem Name="editMenu" Header="_Edit" />
            <MenuItem Name="setupMenu" Header="_Setup">
                <MenuItem Header="_Language">
                    <MenuItem.Icon> 
                         //I want to insert image here
                    </MenuItem.Icon>
                </MenuItem>
            </MenuItem>
            <MenuItem Name="helpMenu" Header="_Help" />
        </Menu>

And a resource file named images.resx containing an image called lang.png. How can I insert the image as an icon for the Menu-Item? Is there a better way?

like image 348
Gilad Naaman Avatar asked Nov 26 '10 11:11

Gilad Naaman


People also ask

How do you insert an image into RESX?

To add images as resources, go to Project properties (if you already don't have resources. resx) and go to Resources Tab and click the link to create the default resource file. You can by the way add a new item of Type resource file and it will be equal, but normaly you will use default one.

How do I add a resource to WPF?

To add a Resource Dictionary into your WPF application, right click the WPF project > add a Resource Dictionary. Now apply the resource "myAnotherBackgroundColor" to button background and observe the changes.


1 Answers

As Jason said, it's better to add your images as Resources to your project.

  1. Open "Properties" for your project
  2. Select Vertical-tab Resources
  3. Choose Images from the left ComboBox
  4. Choose "Add Resource -> Add Existing File..." from the right ComboBox
  5. Locate the Image you would like to use, e.g "C1.png" (it will automatically be copied to the Resources folder in the root of your project)
  6. Select properties on your newly added Resource Image
  7. In properties, set Build Action to Resource
  8. Open the designer for the .xaml file containing the Menu and add an Image in MenuItem.Icon and then place the cursor on Image.

xaml

<Menu IsMainMenu="True" DockPanel.Dock="Top"> 
    <MenuItem Name="fileMenu" Header="_File" /> 
    <MenuItem Name="editMenu" Header="_Edit" /> 
    <MenuItem Name="setupMenu" Header="_Setup"> 
        <MenuItem Header="_Language"> 
            <MenuItem.Icon>  
                 <Image/>
            </MenuItem.Icon> 
        </MenuItem> 
    </MenuItem> 
    <MenuItem Name="helpMenu" Header="_Help" /> 
</Menu> 

From properties you can now select the alt text symbol on the Source Property and all available Image resources will be displayed.

alt text

From this dialog you can also choose "Add", locate an image file on the disk and all the above steps will be made for you by Visual Studio.

alt text

The resulting uri for the Image.Source in xaml will look something like this (which ofcourse also can be added by hand)

<Menu IsMainMenu="True" DockPanel.Dock="Top">
    <MenuItem Name="fileMenu" Header="_File" />
    <MenuItem Name="editMenu" Header="_Edit" />
    <MenuItem Name="setupMenu" Header="_Setup">
        <MenuItem Header="_Language">
            <MenuItem.Icon>
                <Image Source="/MenuIconImage;component/Resources/C1.png" />
            </MenuItem.Icon>
        </MenuItem>
    </MenuItem>
    <MenuItem Name="helpMenu" Header="_Help" />
</Menu>
like image 158
Fredrik Hedblad Avatar answered Sep 20 '22 11:09

Fredrik Hedblad