C#•2y ago

❔ Illuminate buttons pressing a row of a DataGrid

Hello! I have a bigger project but to resolve a question I made another one, as an example to show the behavior I want my application to have, continue as follows. I have a People model with basic properties (name, age, and a random boolean) As I am using the MVVM design pattern I am passing a list of People, "previously created in the ViewModel", to a DataGrid that has 2 columns Name and age, and below some buttons, "The behavior I want it to have is that, while I select a row of the datagrid, the buttons change color depending on the boolean of my object passed by list" (Be careful, the behavior does not make much sense, but I would like to do this for another personal project) I have searched for Chat Gpt, and it has given me a solution with triggers, but it has not worked for me. If anyone could help me, I'd be grateful.

15 Replies

Kippachu•2y ago

When you select a row, does all buttons have to change color, or only the one with the same name on it ?

mbllaOP•2y ago

Change only those that have true in their IsOk property Sorry for my english, I'm translating it The DataGrid receives a list of the People object that has several properties and the IsOk is one of them, it is a boolean, and it does not matter which row is selected, just by selecting a row, it performs the color change

Kippachu•2y ago

I found the solution 🙂

Kippachu•2y ago

This is my result when selecting John, when John isOk = true and Jav isOk = false

Kippachu•2y ago

You'll need to implement INotifyPropertyChanged inside People class then add :

        private SolidColorBrush _buttonColor;
        public SolidColorBrush ButtonColor
        {
            get => _buttonColor;
            set
            {
                _buttonColor = value;
                OnPropertyChanged(nameof(ButtonColor));
            }
        }
        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

        private SolidColorBrush _buttonColor;
        public SolidColorBrush ButtonColor
        {
            get => _buttonColor;
            set
            {
                _buttonColor = value;
                OnPropertyChanged(nameof(ButtonColor));
            }
        }
        protected void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

In MainWindow.xaml bind Button Background to ButtonColor property, also in DataGrid properties, add SelectedCellsChanged and create the method DataGrid_SelectedCellsChanged Like this : <DataGrid Margin="20,5,20,5" SelectedCellsChanged="DataGrid_SelectedCellsChanged" Height="200" Width="600" ItemsSource="{Binding MyListOfPeopleForBinding}" AutoGenerateColumns="False"> You have to create this method inside MainWindow.xaml.cs private void DataGrid_SelectedCellsChanged(object sender, SelectedCellsChangedEventArgs e) { if (sender is not DataGrid dataGrid) return; var vm = DataContext as MainViewModel; var selectedPerson = dataGrid.SelectedItem as People; vm?.UpdateButtonColors(selectedPerson); } Add the method UpdateButtonColors(People selectedPerson) in your viewModel or it will not work : public void UpdateButtonColors(People selectedPeople) { foreach (var person in MyListOfPeople) { if (selectedPeople == null) { person.ButtonColor = Brushes.Gray; // Default color } else { person.ButtonColor = person.IsOk ? Brushes.Green : Brushes.Red; } } } I don't know if my solution is the best, maybe it's bad idk but it works, tell me if you succeeded Basically when you select a row then your variable "selectedPerson" in DataGrid_SelectedCellsChanged will not be null, so inside UpdateButtonColors the else case will be run, changing the color of every people in your MyPeopleList, and as you binded the buttons colors to your people color, it will also change, else if unselect the row the selectedPerson will be null and will set the buttons color back to grey

mbllaOP•2y ago

Awesome! I'm gonna try do my self

Kippachu•2y ago

Maybe the triggers way was better and it does everything you need in two lines, but i don't know i did it like this I'm still learning also

mbllaOP•2y ago

What I didn't know was how to pass the list that was sent by binding to the code behind my view to be able to operate, but I couldn't change colors either, I'll try to do it myself, Thank you very much for your time!!

Kippachu•2y ago

No problem, tell me if it worked, now i can go to eat ^^

mbllaOP•2y ago

That's what it told me when I asked ChatGpt, but there were things that it didn't even allow to compile, and I couldn't find a solution. I found this discord by microsoftLearn, while reading documentation about triggers haha

mbllaOP•2y ago

Works!

mbllaOP•2y ago

Now I'm going to try to understand how it works haha, thanks!

Kippachu•2y ago

Hey I just came back, I'm glad to hear you made it If you don't understand something in the code you can ask me

mbllaOP•2y ago

I found a way to do, only with trigers, but only works to change on all button, but, I'm trying to found how can do for one button unique This is de code in de View

<Window.Resources> <Style TargetType="{x:Type Button}"> <Setter Property="Background" Value="Gray"/> <Style.Triggers> <DataTrigger Binding="{Binding ElementName=myDataGrid, Path=SelectedItem.IsOK}" Value="True" > <Setter Property="Background" Value="Green" /> </DataTrigger> <DataTrigger Binding="{Binding ElementName=myDataGrid, Path=SelectedItem.IsOK}" Value="False" > <Setter Property="Background" Value="Red" /> </DataTrigger> </Style.Triggers> </Style> </Window.Resources>

Accord•2y ago

Was this issue resolved? If so, run /close - otherwise I will mark this as stale and this post will be archived until there is new activity.

Gaming

Programming

❔ Illuminate buttons pressing a row of a DataGrid