WPF Dynamically Change Background Color of Label


As a Windows Presentation Foundation (WPF) developer you may want to allow your user to set some properties of a control (user interface element) at runtime. As a simple example, suppose that control was a Label and the Property was Background. How would you allow the user to set the background color of a label at run time? How would you write code to dynamically or programmatically change a control’s property? This post shows a very simple example, but by following this pattern you can adapt the code to your needs. Please feel free to copy this code and use it in your projects.

Below is how the program looks before the user clicks the button.

WPF Dynamically Change Background Color of Label

Below is how the program looks after the user has clicked the button. The background color of the label has changed.

WPF Dynamically Change Background Color of Label Yellow

Here is the XAML code. There is a click event for the button: Click=”Button_Click”. Also notice that we have named the text “hello” by including the code Name=”hello”.

<Window x:Class="SetPropertiesProgramatically2.MainWindow"
        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:SetPropertiesProgramatically2"
        mc:Ignorable="d"
        Title="SetPropertiesProgramatically2" Height="150" Width="350">
    <Grid>
        <StackPanel>
            <Label Name="hello" Background="Aqua">Hello</Label>
            <Label Name="world">World</Label>
            <Button Click="Button_Click" Width="200" Content="Change hello background color"/>
        </StackPanel>
    </Grid>
</Window>

Here is the code behind. Just for illustration, I have included many lines of code when you really only need one line of code. All we need to do is change the Background property of the label called hello. There are several different ways to do this. Below I show a few ways. You can use named colors, RGB or ARGB. You may often find you need to use the RGB method because the company you are working for will want to use their own corporate colors.

using System.Windows;
using System.Windows.Media;
namespace SetPropertiesProgramatically2
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            hello.Background = Brushes.MediumVioletRed;
            hello.Background = Brushes.White;
            hello.Background = new SolidColorBrush(Colors.White);  // named colors
            hello.Background = new SolidColorBrush(Color.FromRgb(230, 230, 25));  // yellowish
            hello.Background = new SolidColorBrush(Color.FromArgb(100, 230, 230, 25)); // yellowish
        }
    }
}

A Better Example

The above example isn’t very realistic in the real world because the color that the user changes is fixed. What if the user could choose the color? We could have a drop-down list. Have a look at the post called WPF ComboBox Colors or WPF ListBox Colors.

Leave a Reply