WPF 滑块更改按钮 colors 点击

Question

I am doing a project where I have to change button colors based on sliders in WPF. This is my XAML design.

XAML file

So, I have made 64 buttons, and I have tried implementing multiple options, and none worked for me.

I have this xaml code:

<Grid Grid.Column="0" Grid.RowSpan="4" Grid.ColumnSpan="4" HorizontalAlignment="Left" Height="790" Margin="0,10,0,0" Grid.Row="0" VerticalAlignment="Top" Width="800">
            <Grid Margin="230,114,230,346" AutomationProperties.Name="ledMatrix" Tag="ledMatrix" >
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>

<Button Grid.Column="0" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED00" Click="changeLedIndicatiorColor" x:Name="LEDButton"/>
                <Button Grid.Column="1" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED01"/>
                <Button Grid.Column="2" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED02"/>
                <Button Grid.Column="3" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED03"/>
                <Button Grid.Column="4" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED04"/>
                <Button Grid.Column="5" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED05"/>
                <Button Grid.Column="6" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED06"/>
                <Button Grid.Column="7" Grid.Row="0" Height="40" Width="40" Command="{Binding LEDBtn}" Background="#FFAAAAAA" Tag="LED07"/>

and sliders:

<Grid Margin="230,480,230,170">
                <Slider x:Name="SeekR" Margin="0,0,0,120" Tag="seekR" Maximum="255" Background="Red" ></Slider>
                <Slider x:Name="SeekG" Margin="0,50,0,70" Tag="seekG" Maximum="255" Background="Green"></Slider>
                <Slider x:Name="SeekB" Margin="0,100,0,20" Tag="seekB" Maximum="255" Background="Blue"></Slider>
            </Grid>

I have tried placing this in my xaml.cs file:

public void changeColor()
        {
            byte rr = (byte)SeekR.Value;
            byte gg = (byte)SeekG.Value;
            byte bb = (byte)SeekB.Value;
            Color cc = Color.FromRgb(rr, gg, bb); //Create object of Color class.
            SolidColorBrush colorBrush = new SolidColorBrush(cc); //Creating object of SolidColorBruch class.
            LEDButton.Background = colorBrush; //Setting background of stack panel.
        }
        private void changeLedIndicatiorColor(object sender, RoutedEventArgs e)
        {
            changeColor();
        }

But from this code, I have to name all the buttons differently butI want to have the same binding for all buttons and try to connect it all together, so for example I would like to set color by sliders and when I click the button color would change. Then, I can change the color, and make other buttons that different color.

Answer 1

Refactor ChangeColor to accept a Button , the button to change the color for:

private void ChangeLedIndicatiorColor_OnClick(object sender, RoutedEventArgs e)
{
  ChangeColor(sender as Button);
}

public void ChangeColor(Button button)
{
  byte rr = (byte)SeekR.Value;
  byte gg = (byte)SeekG.Value;
  byte bb = (byte)SeekB.Value;
  Color cc = Color.FromRgb(rr, gg, bb); 
  SolidColorBrush colorBrush = new SolidColorBrush(cc); 

  button.Background = colorBrush;
}

Then register the ChangeLedIndicatiorColor event handler for each Button.Click :

...

<Button Click="ChangeLedIndicatiorColor" />
<Button Click="ChangeLedIndicatiorColor" />
<Button Click="ChangeLedIndicatiorColor" />
...

Answer 2

You can use the EventSetter so that the event can be applicable to all the buttons. You don't need to attach the click event handler to each button anymore.

    <Window.Resources>
        <Style TargetType="Button">
            <EventSetter Event="Click" Handler="ChangeLedIndicatiorColor"/>
        </Style>
    </Window.Resources>

And inside event handler you can change the color of the button which triggered the click event.

private void changeLedIndicatiorColor(object sender, RoutedEventArgs e)
{
    byte rr = (byte)SeekR.Value;
    byte gg = (byte)SeekG.Value;
    byte bb = (byte)SeekB.Value;
    Color cc = Color.FromRgb(rr, gg, bb); 
    SolidColorBrush colorBrush = new SolidColorBrush(cc); 
    (sender as Button).Background = colorBrush; 
}