List box color for each iteme with Databinding WPF

Question

I use a Listbox that showing different test , I'd like to show a test in green color when the test is OK and red color when the test is not OK , I use data binding for showing ma list of test and also binding for color.

I can show the test result but I can't color each item with my method the program color all items (" all test ") in green or all test in red , but what I m looking for it is two have different foreground for my item ( test ) of my list box depending on test result :

My Xaml :

<ListBox   x:Name="myListBox"  ItemsSource="{Binding MaListe}" Foreground="{Binding ColorStatus}"  ScrollViewer.VerticalScrollBarVisibility="Visible"

enter image description here

// Code behind  :  
// here to bind the color foreground with variable: ColorStatus
  
  public string _colorStatus;
        public string ColorStatus
        {
            get { return _colorStatus; }
            set { _colorStatus = value; OnPropertyChanged(nameof(ColorStatus)); }
        }

//  to bind itemsSource  with variable _maList that contains my string of characters " my Tests"

 public ObservableCollection<string> _maListe;
        public ObservableCollection<string> MaListe
        {

            get { return _maListe; }
            set { _maListe = value; }

        }

//  Mylist of caractère that I constract to show  :  
  
public ObservableCollection<string> Getlist()
          {
                DateTime DateNow = DateTime.Now;
                string DateTimeNow = "DateTime  :  " + DateTime.Now.ToString("");
                int year = DateNow.Year;
                int month = DateNow.Month;
                int day = DateNow.Day;
                int hour = DateNow.Hour;
                int minute = DateNow.Minute;
                int second = DateNow.Second;
                int millisecond = DateNow.Millisecond;

                Results.Add(" * " + DateTimeNow + " : " +
                                     TestName + "   " +
                                     ExpectedValue + " : " + " [   " + 
                                     MinValue + "   ,   " + 
                                     MaxValue + "   ]" + "     >>>     " + 
                                    Status);
                            
                return Results;
            
            }
        }

//  Declaration 
   ResultListContainer ResultList = new ResultListContainer();

//  Here a small trial  :  

            ResultList.TestName = " Contact Test ";
            ResultList.ExpectedValue = "12 V";
            ResultList.MinValue = "11 V";
            ResultList.MaxValue = "13 V";
            ResultList.Status = "OK";
            _maListe = ResultList.Getlist();

            if (ResultList.Status == "OK")
                ColorStatus = "#FFC4FD03"; // Green color 
            else
                ColorStatus = "#FFFF4500"; // Red Color 
            ResultList.TestName = " Leakage Test";
            ResultList.ExpectedValue = "105 mA";
            ResultList.MinValue = "110 V";
            ResultList.MaxValue = "100 V";
            ResultList.Status = "NOK";

            if (ResultList.Status == "OK")
               ColorStatus = "#FFC4FD03"; // Green color 
       
            else
                ColorStatus = "#FFFF4500"; // Red Color 

            _maListe = ResultList.Getlist();

//  here the result  :

enter image description here

thank you for your feedback and don't hesitate if your need more informations :
the global Idea is to see the different test runing with different color => to have possibilité to give to each item of list box the color that we can choose by code behind

Take a look at Data Templating Overview. You should bind the ListBox to a collection of data items with a string and a color property, and bind the Background of an element in the ItemTemplate of the ListBox to the color property. — Clemens
– Clemens, Commented Aug 9, 2023 at 16:09

T McKeown · Accepted Answer · 2023-08-10 20:33:42Z

0

Using a Data Template:

<ListBox   x:Name="myListBox"  ItemsSource="{Binding MaListe}"   ScrollViewer.VerticalScrollBarVisibility="Visible" >
   <ListBox.ItemTemplate>
      <DataTemplate>
          <TextBlock Foreground="{Binding ColorStatus}" ... />
      </DataTemplate>
   </ListBox.ItemTemplate>
 </ListBox>

You would want to move your ColorStatus property to the view model class that handles the ListView Item. The type of a single item in your MaListe collection.

answered Aug 10, 2023 at 20:33

T McKeown

12.9k1 gold badge27 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Tariq RIDA Over a year ago

Dear Mckeon , Thank you for your feedback , I did not understand quite well when you say : " You would want to move your ColorStatus property to the view model class that handles the ListView Item. The type of a single item in your MaListe collection." I declare the variables ColorStatus and Malist in my view model with implementation of public class MainWindowsBusiness : INotifyPropertyChanged I implemented the code you sugguest to me but it's stil not working , I can't see MaList in my listbox it's sames empty the binding of ItemsSource not working and color also

T McKeown Over a year ago

a quick way to find out what DataContext is tied to the ListBox, so I add a Loaded event to the view, and put a breakpoint. i make sure the ListView is given a name so you can see it in the debugger and determine what DataContext is tied to the ListView. That DataContext needs to be the class/object that has the MaListe property. My guess is that you are not binding to what you think you are.

T McKeown Over a year ago

And to answer your other question.. the MaListe is a list of what type? that type needs to have the properties you use in the DataTemplate... because that type is the DataContext of any ItemTemplate capable control like a ListView or GridView etc..

Collectives™ on Stack Overflow

List box color for each iteme with Databinding WPF

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related