This is a migrated thread and some comments may be shown as answers.

Menu icon image binding and visibility

1 Answer 153 Views
ContextMenu
This is a migrated thread and some comments may be shown as answers.
Ryan
Top achievements
Rank 1
Ryan asked on 17 Jun 2010, 12:19 PM
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.

Datasource:

public partial class Toolbar : UserControl 
    { 
        public Toolbar() 
        { 
            InitializeComponent(); 
 
            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%" }                 
            }; 
        } 
    } 

Menu:

<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}}" />             
</Style> 
 
<HierarchicalDataTemplate  
            x:Key="zoomMenuItemTemplate" 
            ItemsSource="{Binding ZoomMenuItem}"
            <TextBlock Text="{Binding ZoomSettingText}" /> 
</HierarchicalDataTemplate> 
 
<telerik:RadDropDownButton  
                x:Name="RadDropBtnZoom" 
                Height="20" 
                Width="15"
                <telerik:RadDropDownButton.DropDownContent> 
                    <telerikNav:RadContextMenu 
                        x:Name="zoomMenu" 
                        Width="75"  
                        BorderThickness="0" 
                        ItemContainerStyle="{StaticResource ZoomMenuItemStyle}" 
                        ItemTemplate="{StaticResource zoomMenuItemTemplate}"
                    </telerikNav:RadContextMenu> 
                </telerik:RadDropDownButton.DropDownContent>                 
</telerik:RadDropDownButton> 



1 Answer, 1 is accepted

Sort by
0
Pana
Telerik team
answered on 22 Jun 2010, 08:02 AM
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,
Panayot
the Telerik team
Tags
ContextMenu
Asked by
Ryan
Top achievements
Rank 1
Answers by
Pana
Telerik team
Share this question
or