Improving the display of a specific column as a WPF grid

I have some user admin features in the WPF application that I am writing now and would like to make it more intuitive for the end user.

I would like to be able to provide some means for simply editing the list of roles that this user belongs to. Currently, the grid is filled as a result of binding to the List<ApplicationUser>

ApplicationUser is my own class, defined as:

 public class ApplicationUser { public Guid? UserId { get; set; } public string GivenName { get; set; } public string Surname { get; set; } public string EmailAddress { get; set; } public string UserPhone { get; set; } public string NtLoginName { get; set; } public List<Role> ApplicationRoles { get; set; } } 

As you can see, the roles the user is in are stored in a List<Role> . Role is my own class, defined as:

 public class Role { public Guid RoleId; public string RoleName; public string RoleDescription; } 

Below the layout represents the current state, when I just get the roles as a list and using the converter they simply display the roles as strings separated by a new row in gridview

Current state of gridview

However, this is what I would like to achieve in order to facilitate the transition and membership in various groups.

Desired state of gridview

Now that I’m thinking about this, I’ll probably have to change the definition of the role to include the IsMember property to make flag binding easier, but if anyone has a better way, I also welcome this. I can change the JOIN type in sproc, so I return all roles with a request for a specific user and accordingly populate the IsMember property.

Thank you for your time!

+8
c # wpf wpfdatagrid
source share
2 answers

Here is a short piece of code that I whipped to get you started. I suggested that you can inherit the IsMember property of the Role class when creating the application user. I chose the simplest route, having all the roles for all users ( enum flags would be better, but given your data, I'm not sure if the option is without any plumbing). I used minimal columns to get this idea. If you at least implement INotifyPropertyChanged in roles, you can connect to the notification and save it back to the database when the flags change on the front side.


Core xaml

 <DataGrid DataContext="{StaticResource ResourceKey=AllUsers}" ItemsSource="{Binding}" AutoGenerateColumns="False"> <DataGrid.Columns> <DataGridTextColumn Binding="{Binding GivenName}" /> <DataGridTextColumn Binding="{Binding Surname}" /> <DataGridTemplateColumn> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <ItemsControl ItemsSource="{Binding ApplicationRoles}"> <ItemsControl.ItemTemplate> <DataTemplate> <CheckBox Content="{Binding RoleName}" IsChecked="{Binding IsMember, Mode=TwoWay}" /> </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid> 

Xaml data

 <x:Array x:Key="AllUsers" Type="Sample:ApplicationUser"> <Sample:ApplicationUser GivenName="Andrew" Surname="Fuller"> <Sample:ApplicationUser.ApplicationRoles> <Sample:Role RoleName="Administrators" IsMember="True"/> <Sample:Role RoleName="Shift Analysts"/> <Sample:Role RoleName="Shift Managers" IsMember="True"/> </Sample:ApplicationUser.ApplicationRoles> </Sample:ApplicationUser> <Sample:ApplicationUser GivenName="Anne" Surname="Dodsworth"> <Sample:ApplicationUser.ApplicationRoles> <Sample:Role RoleName="Administrators"/> <Sample:Role RoleName="Shift Analysts" IsMember="True"/> <Sample:Role RoleName="Shift Managers" IsMember="True"/> </Sample:ApplicationUser.ApplicationRoles> </Sample:ApplicationUser> </x:Array> 

Class definitions

 public class ApplicationUser { public Guid? UserId { get; set; } public string GivenName { get; set; } public string Surname { get; set; } public string EmailAddress { get; set; } public string UserPhone { get; set; } public string NtLoginName { get; set; } public List<Role> ApplicationRoles { get; set; } public ApplicationUser() { ApplicationRoles = new List<Role>(); } } public class Role { public Guid RoleId { get; set; } public string RoleName { get; set; } public string RoleDescription { get; set; } public bool IsMember { get; set; } } 

Result

Screenshothot

+5
source share

If the Roles column always displays the same list of roles, you can easily bind the ListView to a list of all roles using the ItemTemplate, which is built from CheckBox and TextBlock.
Then you can easily associate the IsChecked property with the CheckBox with User Roles and use a converter that returns True if the role is in the User Roles list.

+2
source share

All Articles