RadContextMenu Icons not showing

[Kornelije]

I have found a strange behavior for RadContextMenu.

I have a class that inherits from RadMenuItem. It contains some properties I need for specific scenario, but none of them are related to the problem, so I have excluded them from the posted code.

public class MyContextMenuItem : RadMenuItem
{
    // code excluded for brevity
}

Then, there's a constructor for that class that looks like this:

public MyContextMenuItem(String text, String imageName = null, object userState = null)
{
    if (imageName != null)
    {
        DataTemplate template =
            Application.Current.Resources["cm_" + imageName] as DataTemplate;

        if (template != null)
            IconTemplate = template;
    }

    Header = text;

    // rest of the code not relevant or related to Icons
    // ...
}

There you can see that I have set the IconTemplate for the specific menu item.

I have tested and ensured that the Application.Current.Resources really returns the DataTemplate from the dictionary:

<ResourceDictionary
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <DataTemplate x:Key="cm_edit">
        <Image Source="/MyProject;component/Images/edit.png" />
    </DataTemplate>

    <DataTemplate x:Key="cm_exit">
        <Image Source="/MyProject;component/Images/exit.png" />
    </DataTemplate>

</ResourceDictionary>




Context menu with items created this way DOES NOT show the icons.

I am opening the context menu on button click:

contextMenu.SetControl(btnTest, "Click");

Then I thought maybe that the paths were incorrect, so I've taken my images and put them into that button to see if it can show them:

<Button x:Name="btnTest" Width="100" Height="20">
    <StackPanel Orientation="Horizontal">
        <Image Source="/MyProject;component/Images/edit.png" />
        <Image Source="/MyProject;component/Images/exit.png" />
    </StackPanel>
</Button>

Then I ran the application and the button was correctly displaying the images.

But here comes the strange part. Now that I've set the same icons in that button, now even the ContextMenu shows the images.

How is that possible? It seems as if the images have to be already loaded in some way for them to be able to show in Context menu.

Note that I've tried even setting the images directly, by not using the IconTemplate, but setting it like this:

String path = "/MyProject;component/Images/edit.png";
Uri uri = new Uri(path, UriKind.Relative);
BitmapImage img = new BitmapImage(uri);
contextMenuItem.Icon = new Image() { Source = img };

The behaviour is exactly the same, when that same icons are already used (by setting it via XAML) the context menu would show them, otherwise it wouldn't. Also, it doesn't matter that they are in the button related to the ContextMenu. The icons can be defined anywhere on the page (but thru XAML) and then ContextMenu would be able to show them.

I don't understand why would loading the images in code-behind be any different than in XAML, and for some reasons we have to programatically set them. Is that possible without this behavior occuring? How to deal with this problem?

[John Kears]

Hi,

I am attempting to do something similar however, in my case I am using databinding to bind the ImageSource, but I am also not having much success.

Here I created a simple class and using following the same logic path, I am adding a resourced based datatemplate...

public class RadMenuItemEx : RadMenuItem, INotifyPropertyChanged
    {
        private ImageSource _image;

        public ImageSource ImageSourceEx
        {
            get { return _image; }
            set { _image = value;
            RaisePropertyChanged("ImageSourceEx");
            }
        }


        public RadMenuItemEx()
        {
            var template = Application.Current.Resources["RadMenuItemTemplate"] as DataTemplate;

            if (template != null)
            {
                IconTemplate = template;
                DataContext = this;
            }
        }

        #region INotifyPropertyChanged Members

        public event PropertyChangedEventHandler PropertyChanged;

        #endregion

        public void RaisePropertyChanged(string propertyName)
        {
            // Exit if no subscribers
            if (PropertyChanged == null) return;

            // Raise event
            var e = new PropertyChangedEventArgs(propertyName);
            PropertyChanged(this, e);
        }
    }

... and here is the resource file ...

<Windows:ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:Windows="clr-namespace:System.Windows;assembly=System.Windows">

    <DataTemplate x:Key="RadMenuItemTemplate">
        <Image Source="{Binding ImageSourceEx}" />
    </DataTemplate>



</Windows:ResourceDictionary>

I create and new instance of my class and then set the ImageSourceEx with a valid image source.   I never see any binding on the datatemplate even though I see that it assigns the RadMenuItemTemplate datatemplate to the IconDataTemplate.

I suspect that since this is a datatemplate that the binding's is not set correctly?

Any ideas would be greatly appreciated.

[Kornelije]

I woud really appreciate if someone from Telerik would respond to the question. We have stumbled upon another occurence of this problem, and we really need to know the cause for this behavior.

Thanks.

[Hristo]

Hello all,

What you experience is a but in the Silverlight platform. I've reported it to Microsoft long time before (e.g. reproducible in SL4) but it is still unresolved.
Here is the link:
https://connect.microsoft.com/VisualStudio/feedback/details/630341/images-are-not-resolved-in-certan-scenarios-silverlight-4-gdr2

The only workaround I'm aware of is the one that Kornelije have found. What you can do is to set several Images in the MainPage with correct Source and Visibility=Collapsed so that Images are preloaded (but not visible in the UI). This way they will appear correctly in RadContextMenu.

I hope that this will help you.

Regards,
Hristo
the Telerik team