Posted
on Dec 12, 2011
(permalink)
I have a menu inside the telerik grid, what I want to achieve is to hide or show the menu item base on user's access when the user hover on the top menu. I bind the visibility of the menu item to the viewmodel's property but the problem is its not working, here are the sample of my code.
<UserControl xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation" x:Class="AllInventoriesSL.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:AllInventoriesSL.ViewModels"
xmlns:telerikQuickStart="clr-namespace:Telerik.Windows.Controls.QuickStart;assembly=Telerik.Windows.Controls"
mc:Ignorable="d"
VerticalAlignment="Center" HorizontalAlignment="Center">
<UserControl.DataContext>
<local:MainViewModel/>
</UserControl.DataContext>
<telerikQuickStart:QuickStart.ExampleHeader>
<TextBlock Text="Inventory" Margin="8"></TextBlock>
</telerikQuickStart:QuickStart.ExampleHeader>
<UserControl.Resources>
<local:VisibilityConverter x:Key="VisibilityConverter"/>
<Style x:Key="TextBlockStyle" TargetType="TextBlock">
<Setter Property="FontFamily" Value="Segoe UI" />
<Setter Property="FontSize" Value="13" />
<Setter Property="Foreground" Value="#B2626262" />
</Style>
<Storyboard x:Key="ShowClickedElAnimation">
<DoubleAnimation
Storyboard.TargetName="transition"
Storyboard.TargetProperty="Opacity"
From="0" To="1" Duration="0:0:0.4" />
</Storyboard>
<Storyboard x:Key="HideTransitionAnimation">
<DoubleAnimation
Storyboard.TargetName="transition"
Storyboard.TargetProperty="Opacity"
From="1" To="0" Duration="0:0:0.4" />
</Storyboard>
<Storyboard x:Key="HideStatsAnimation">
<DoubleAnimation
Storyboard.TargetName="spaceStats"
Storyboard.TargetProperty="Opacity"
From="1" To="0" Duration="0:0:0.4" />
</Storyboard>
<Storyboard x:Key="ShowStatsAnimation">
<DoubleAnimation
Storyboard.TargetName="spaceStats"
Storyboard.TargetProperty="Opacity"
From="0" To="1" Duration="0:0:0.4" />
</Storyboard>
</UserControl.Resources>
<Grid>
<Grid.Resources>
<telerik:MetroColors x:Key="MetroColors"/>
<SolidColorBrush x:Key="AccentBrush" Color="{Binding Source={StaticResource MetroColors},Path=Palette.AccentColor}"/>
<SolidColorBrush x:Key="BasicBrush" Color="{Binding Source={StaticResource MetroColors}, Path=Palette.BasicColor}" />
</Grid.Resources>
<telerik:RadGridView x:Name="gridInventory" ItemsSource="{Binding Inventory}" AutoGenerateColumns="False"
IsReadOnly="True">
<telerik:RadGridView.Columns>
<telerik:GridViewDataColumn IsVisible="False" DataMemberBinding="{Binding TheoHeaderId}"/>
<telerik:GridViewDynamicHyperlinkColumn Header="Store Id" NavigateUrlFormatString="http://www.google.com?id={0}" NavigateUrlMemberPaths="StoreId"
TargetName="_blank">
<telerik:GridViewDynamicHyperlinkColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<telerik:RadMenu x:Name="RadStoreMenu" ClickToOpen="False" ItemClick="StoreMenu_ItemClick"
VerticalAlignment="Top" HorizontalAlignment="Stretch" >
<telerik:RadMenuItem x:Name="StoreId" Header="{Binding StoreId}"
HorizontalAlignment="Center" HorizontalContentAlignment="Center"
Foreground="{StaticResource AccentBrush}" >
<telerik:RadMenuItem x:Name="EditMenuItem" Header="Edit" Command="{Binding NavigateEditMenu}" Foreground="{StaticResource AccentBrush}" Visibility="{Binding Path=ShowEdit, Converter={StaticResource VisibilityConverter}}">
<telerik:RadMenuItem.Icon>
<Image x:Name="editMenuItemImg" Source="Images/TreeView/edit.gif" Stretch="None"/>
</telerik:RadMenuItem.Icon>
</telerik:RadMenuItem>
<telerik:RadMenuItem x:Name="CountSheetMenuItem" Header="Count Sheet" Foreground="{StaticResource AccentBrush}" Visibility="{Binding Path=ShowPrintCountSheet, Converter={StaticResource VisibilityConverter}}">
<telerik:RadMenuItem.Icon>
<Image x:Name="CountSheetImg" Source="Images/TreeView/count-sheet.gif" Stretch="None"/>
</telerik:RadMenuItem.Icon>
</telerik:RadMenuItem>
<telerik:RadMenuItem x:Name="PrintCountSheetMenuItem" Header="Print Count Sheet" Foreground="{StaticResource AccentBrush}" Visibility="Visible">
<telerik:RadMenuItem.Icon>
<Image x:Name="PrintLinkCmd" Source="Images/TreeView/printer.png" Stretch="None"/>
</telerik:RadMenuItem.Icon>
</telerik:RadMenuItem>
<telerik:RadMenuItem x:Name="PostInventoryMenuItem" Header="Post Inventory" Foreground="{StaticResource AccentBrush}">
<telerik:RadMenuItem.Icon>
<Image x:Name="PostLinkCmd" Source="Images/TreeView/add.png" Stretch="None"/>
</telerik:RadMenuItem.Icon>
</telerik:RadMenuItem>
</telerik:RadMenuItem>
</telerik:RadMenu>
</StackPanel>
</DataTemplate>
</telerik:GridViewDynamicHyperlinkColumn.CellTemplate>
</telerik:GridViewDynamicHyperlinkColumn>
<telerik:GridViewDataColumn Header="Name" DataMemberBinding="{Binding Name}"/>
<telerik:GridViewDataColumn Header="Status" DataMemberBinding="{Binding Status}"/>
<telerik:GridViewDataColumn Header="Period To" DataMemberBinding="{Binding PeriodTo}" DataFormatString="{}{0:d}"/>
<telerik:GridViewDataColumn Header="Value" DataMemberBinding="{Binding Value}" DataFormatString="{}{0:c}"/>
<telerik:GridViewDynamicHyperlinkColumn Header="Report" NavigateUrlFormatString="http://www.google.com?id={0}" NavigateUrlMemberPaths="InventoryId"
TargetName="_blank" >
<telerik:GridViewDynamicHyperlinkColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
<TextBlock Text="View" Tag="View" Foreground="{StaticResource AccentBrush}" Width="20" HorizontalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</telerik:GridViewDynamicHyperlinkColumn.CellTemplate>
</telerik:GridViewDynamicHyperlinkColumn>
<telerik:GridViewDataColumn Header="Updated By" DataMemberBinding="{Binding UpdatedBy}"/>
<telerik:GridViewDataColumn Header="Update Date" DataMemberBinding="{Binding UpdateDate}"/>
</telerik:RadGridView.Columns>
</telerik:RadGridView>
</Grid>
</UserControl>
viewmodel
namespace AllInventoriesSL.ViewModels
{
public class Menu
{
public string StoreId { get; set; }
public string InventoryId { get; set; }
public string ImageUrl { get; set; }
public string Url { get; set; }
}
public class MainViewModel:ViewModel
{
AllInventoriesSLServiceClient _client = new AllInventoriesSLServiceClient();
public MainViewModel()
{
Initialize();
}
private void Initialize()
{
_client.GetAllInventoriesCompleted += new EventHandler<GetAllInventoriesCompletedEventArgs>(_client_GetAllInventoriesCompleted);
_client.GetInventoriesByViewCompleted += new EventHandler<GetInventoriesByViewCompletedEventArgs>(_client_GetInventoriesByViewCompleted);
_client.GetInventoryListCompleted += new EventHandler<GetInventoryListCompletedEventArgs>(_client_GetInventoryListCompleted);
}
private bool _showPrintCountSheet;
private bool _showEdit;
public bool ShowEdit
{
get { return _showEdit; }
set {
_showEdit = value;
OnPropertyChanged("ShowEdit");
}
}
public bool ShowPrintCountSheet
{
get { return _showPrintCountSheet; }
set {
_showPrintCountSheet = value;
OnPropertyChanged("ShowPrintCountSheet");
}
}
void _client_GetInventoryListCompleted(object sender, GetInventoryListCompletedEventArgs e)
{
if (e.Error != null)
{
MessageBox.Show(e.Error.ToString());
return;
}
_inventory = e.Result;
OnPropertyChanged("Inventory");
//TODO LOGIC FOR validating user's access to the menu
ShowEdit = false;
ShowPrintCountSheet = true;
}
public void Load(string view, string storeId)
{
_client.GetInventoryListAsync(view, storeId);
}
//VISIBILITY CONVERTER
using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Globalization;
using System.Windows.Data;
namespace AllInventoriesSL.ViewModels
{
public class VisibilityConverter:IValueConverter
{
public object Convert(
object value,
Type targetType,
object parameter,
CultureInfo culture)
{
bool visibility = (bool)value;
return visibility ? Visibility.Visible : Visibility.Collapsed;
}
public object ConvertBack(
object value,
Type targetType,
object parameter,
CultureInfo culture)
{
Visibility visibility = (Visibility)value;
return (visibility == Visibility.Visible);
}
}
}