This is more of a MVVM application design question. I’m trying to implement a very basic User-based permission management where the Visibility of certain controls in my application is derived from the Current User Role. Here my simplified model:
public class User
{
public string UserName {get;set;}
public Role UserRole {get;set;}
}
public enum Role
{
Developer,
BusinessAnalyst
}
public class MenuItemModel
{
public ICommand Command {get;set;}
public string Header {get;set;}
public bool Visible {get;set;}
private List<MenuItemModel> _Items;
public List<MenuItemModel> Items
{
get { return _Items ?? (_Items = new List<MenuItemModel>()); }
set
{
_Items = value;
}
}
}
My MainViewModel contains the following properties:
public class MainViewModel : ViewModelBase<MainViewModel>
{
private ObservableCollection<MenuItemModel> _MainMenu;
public ObservableCollection<MenuItemModel> MainMenu
{
get { return _MainMenu; }
set
{
_MainMenu = value;
NotifyPropertyChanged(x=>x.MainMenu);
}
}
private User _CurrentUser;
public User CurrentUser
{
get { return _CurrentUser; }
set {
_CurrentUser = value;
NotifyPropertyChanged(x=>x.CurrentUser);
}
}
}
Here my XAML where I declare and bind my Menu:
<Menu DockPanel.Dock="Top" ItemsSource="{Binding Path=MainMenu}">
<Menu.ItemContainerStyle>
<Style>
<Setter Property="MenuItem.Header" Value="{Binding Path=Header}"/>
<Setter Property="MenuItem.ItemsSource" Value="{Binding Path=Items}"/>
<!-- How to bind Visibility????-->
<!--Setter Property="MenuItem.Visibility" /-->
</Style>
</Menu.ItemContainerStyle>
</Menu>
Now here my requirements:
- The Visibility of some UI controls (e.g. MenuItems) is dependent on User.Role. For example: MenuItemA should be visible to Role.Developer, but not for Role.BusinessAnalyst
- Some controls may be visible for more than one Role (e.g. Developer and Business Analyst)
My two options so far
- Create a custom Converter that has the logic to derive Visibility based on the Roles allowed and bind it to the MenuItem.Visibility Value property. The problem with this: a) The Roles allowed for this control need to be passed at Runtime since they come from the database and you cannot bind CommandParameters to a collection of Roles. b)How will the Converter have access to the User.Role to derive Visibility?
- Create the visibility logic inside a property in my UI model (e.g. MenuItemModel). But here I don’t want to create a dependency between my User and MenuItemModel classes.
What is the cleanest way to derive UI control Visibility dynamically based on User.Role without running into tightly-coupled scenarios (dependencies)?
Thanks!
Solution: So this is how I ended up solving it based on @fmunkert suggestion. Notice I had to change the MenuItemModel.Items property to List in order to access the ‘RemoveAll’ method:
public MainViewModel()
{
//Create a new User with a Role
InitializeUser();
//Get all the Menus in the application
List<MenuItemModel> allItems = GetAllMenus();
//Remove recursively all Items that should not be visible for this user
allItems.RemoveAll(x=>!IsVisibleToUser(x));
//Set my MainMenu based on the filtered Menu list
_MainMenu = new ObservableCollection<MenuItemModel>(allItems);
}
private void InitializeUser()
{
CurrentUser = new User {UserName = "apsolis", UserRole = Role.Developer};
}
Here the method in my MainViewModel that removes forbidden Items recursively:
/// <summary>
/// Method to check if current MenuItem is visible to user
/// and remove items that are forbidden to this user
/// </summary>
/// <param name="m"></param>
/// <returns></returns>
public bool IsVisibleToUser(MenuItemModel m)
{
if (m.Items != null && m.Items.Count > 0)
{
m.Items.RemoveAll(y=>!IsVisibleToUser(y));
}
return m.Roles == null || m.Roles.Contains(CurrentUser.UserRole);
}
This seems to be working fine
Since you are generating the menu items in the ViewModel, I suggest not to use
MenuItem.Visibilityat all. Instead, have your ViewModel determine which menu items the user is allowed to see and fill the MainMenu collection only with that subset of menu items. I.e. your MainViewModel must know which menu items the user is allowed to see.I.e., you would use something like this in the constructor of your MainViewModel: