Menu icon image binding and visibility

2 posts, 0 answers
  1. Ryan
    Ryan avatar
    33 posts
    Member since:
    May 2009

    Posted 17 Jun 2010 Link to this post

    1) When I bind the menu icon to an image which is defined as a StaticResource, the image does not appear but I can see the text "pack:" What am I doing wrong?

    2) I want to bind the visibility to the underlying datasource using the BooleanToVisibilityConverter, so that when a menu item is selected the image is visible. I know how to use the converter but where in xaml do I set the binding.


    public partial class Toolbar : UserControl 
            public Toolbar() 
                this.zoomMenu.ItemsSource = GetZoomMenuItems(); 
            private ObservableCollection<ZoomMenuItem> GetZoomMenuItems() 
                return new ObservableCollection<ZoomMenuItem>() 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=10, ZoomSettingText="10%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=25, ZoomSettingText="25%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=50, ZoomSettingText="50%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=75, ZoomSettingText="75%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=100, ZoomSettingText="100%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=200, ZoomSettingText="200%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=400, ZoomSettingText="400%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=600, ZoomSettingText="600%" }, 
                    new ZoomMenuItem(){ IsSelected=false, ZoomSetting=800, ZoomSettingText="800%" }                 


    <BitmapImage x:Key="tickImage" UriSource="../Images/tick.png" DecodePixelWidth="10"/> 
    <Style x:Key="ZoomMenuItemStyle" TargetType="telerikNav:RadMenuItem"
                <Setter Property="Icon" Value="{Binding Source={StaticResource tickImage}}" />             
                ItemsSource="{Binding ZoomMenuItem}"
                <TextBlock Text="{Binding ZoomSettingText}" /> 
                            ItemContainerStyle="{StaticResource ZoomMenuItemStyle}" 
                            ItemTemplate="{StaticResource zoomMenuItemTemplate}"

  2. Pana
    Pana avatar
    748 posts

    Posted 22 Jun 2010 Link to this post

    Hello Ryan,

    I am attaching an example with Zoom menu and Style for the RadMenuItems to change the Tick with Image. This means that the mark displayed when the menu IsSelected=true is altered in the template and the IsChecked is bound to IsSelected of the ViewModel.

    Best wishes,
    the Telerik team
Back to Top