Setting Triggers for a Custom Control in a Data Grid using WPF

Posted on 2009-02-11
Last Modified: 2013-11-12
I am new to WPF and am trying to achieve the following:

Display a DataGrid that has 'Round Buttons' as cells
Each button will have a different color based on its value
If 0 then button is  Black
If 1 then button is  Blue
If 2 then button is  Yellow
If 3 then button is  Pink

I've been able to get the DataGrid with the Round buttons
What I'm struggling to do is change the background color based on the value

Have inserted the project code below. Let me know if I have missed something or am doing it wrong

//////////////////////////////// XAML ////////////////////////////////////////////////////

<Window x:Class="ProgressGridTest.Window1"




    Title="Window1" Height="300" Width="300">


    <Style x:Key="CustomRoundedButton" TargetType="Button" >

        <Setter Property="Template">


                <ControlTemplate TargetType="{x:Type Button}" >

                    <Border x:Name="bdr"






                        <ContentPresenter x:Name="cp"

                                          Content="{TemplateBinding Content}"





                            <Trigger SourceName="cp" Property="Content" Value="0">

                                <Setter TargetName="bdr" Property="Background" Value="Black"/>


                            <Trigger SourceName="cp" Property="Content" Value="1">

                                <Setter TargetName="bdr" Property="Background" Value="Blue"/>


                            <Trigger SourceName="cp" Property="Content" Value="2">

                                <Setter TargetName="bdr" Property="Background" Value="Yellow"/>


                            <Trigger SourceName="cp" Property="Content" Value="3">

                                <Setter TargetName="bdr" Property="Background" Value="Pink"/>










        <dg:DataGrid x:Name="dgItemList" AutoGenerateColumns="False"


                     CanUserAddRows="False" CanUserDeleteRows="False" 

                     CanUserReorderColumns="False" CanUserResizeColumns="False"

                     CanUserSortColumns="False" SelectionUnit="Cell"

                     SelectionMode="Extended" HeadersVisibility="All"

                     RowHeaderWidth="30" RowHeight="30"





                <dg:DataGridTemplateColumn Header="Ch1">



                        <Button Content="{Binding Path = Ch1}"                                

                                Style="{StaticResource CustomRoundedButton}"/>




                <dg:DataGridTemplateColumn Header="Ch2">



                            <Button Content="{Binding Path = Ch2}"                                

                                Style="{StaticResource CustomRoundedButton}"/>




                <dg:DataGridTemplateColumn Header="Ch3">



                            <Button Content="{Binding Path = Ch3}"


                                Style="{StaticResource CustomRoundedButton}"/>




                <dg:DataGridTemplateColumn Header="Ch4">



                            <Button Content="{Binding Path = Ch4}"


                                Style="{StaticResource CustomRoundedButton}"/>








//////////////////////////////// XAML ////////////////////////////////////////////////////

//////////////////////////////// XAML.cs ////////////////////////////////////////////////////

using System;

using System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Navigation;

using System.Windows.Shapes;

using System.Data;

using Microsoft.Windows.Controls;

namespace ProgressGridTest {

    /// <summary>

    /// Interaction logic for Window1.xaml

    /// </summary>

    public partial class Window1 : Window {

        public Window1() {


            DataTable objDataTable = new DataTable("Progress");

            objDataTable.Columns.Add("Ch1", typeof(int));

            objDataTable.Columns.Add("Ch2", typeof(int));

            objDataTable.Columns.Add("Ch3", typeof(int));

            objDataTable.Columns.Add("Ch4", typeof(int));

            for (int nCount = 0; nCount < 10; nCount++) {

                DataRow objDataRow = objDataTable.NewRow();

                int nRowNumber = nCount + 1;

                objDataRow[0] = Convert.ToInt32(0 % nRowNumber);

                objDataRow[1] = Convert.ToInt32(1 % nRowNumber);

                objDataRow[2] = Convert.ToInt32(2 % nRowNumber);

                objDataRow[3] = Convert.ToInt32(3 % nRowNumber);




            dgItemList.ItemsSource = objDataTable.DefaultView;





//////////////////////////////// XAML.cs ////////////////////////////////////////////////////

Open in new window

Question by:davidjjoseph
    LVL 8

    Accepted Solution

    well, the type of your columns are integer and in trigger you are comparing with text. so this is just type incompatibility. u should use valueconverters while binding to convert integer to text.
    you can verify  what i said above as,
    change the type of your columns as "string" and use Convert.ToString instead of Convert.ToInt32. (this is just to verify, you can still use integer columns and use value converters while binding.)

    Author Closing Comment

    Thanks so much. That worked!!

    Featured Post

    Better Security Awareness With Threat Intelligence

    See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

    Join & Write a Comment

    This article shows a few slightly more advanced techniques for Windows 7 gadget programming, including how to save and restore user settings for your gadget and how to populate the "details" panel that is displayed in the Windows 7 gadget gallery.  …
    After several hours of googling I could not gather any information on this topic. There are several ways of controlling the USB port connected to any storage device. The best example of that is by changing the registry value of "HKEY_LOCAL_MACHINE\S…
    This is Part 3 in a 3-part series on Experts Exchange to discuss error handling in VBA code written for Excel. Part 1 of this series discussed basic error handling code using VBA.…
    In this tutorial you'll learn about bandwidth monitoring with flows and packet sniffing with our network monitoring solution PRTG Network Monitor ( If you're interested in additional methods for monitoring bandwidt…

    755 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    17 Experts available now in Live!

    Get 1:1 Help Now