Answers

• JohnH GBMember ✭✭✭✭✭

  May 3

  ItemsSource should be populated with a list of models instead of strings, the model contains a property that you can bind to to set the colour to black or red as per your logic.

  0
• ganesh96 Member ✭✭✭

  May 3

  Thanks for the response.

  I'm very new to data binding and I don't know (yet) how to implement it. I saw this Documentation https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/listview/data-and-databinding , but I'm still having difficulties with it.

  Are you able to help me a bit?

  Regards, Ganesh

  0
• joergsc Member ✭✭

  May 3

  In XAML define a resource like::
  
  Then

  <Label Text= "{Binding .}" TextColor="{Binding ., Converter={StaticResource TextToColorConverter}}

  And you need a Converter like:
  public class TextToColorConverter :IValueConverter
  {
  public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
  {
  switch ((string)value)
  {
  case "Text4":
  return Color.Red;
  break;

              default:
                  return Color.Black;
          }
  
      }
  

  0
• joergsc Member ✭✭

  May 3 edited May 3

  The resource definition went missing...
  local:StatusToColorConverter x:Key="StatusToColorConverter"

  0
• ColeX Member, Xamarin Team Xamurai

  May 4 edited May 4 Accepted Answer

  You could refer the following steps .

  1. Convert the binding content from string list to model list , the model has two properties (text and color) used to binding on label .

  2. Make model class implement INotifyPropertyChanged .

  3. Modify the property if the statement becomes true .

  Sample

  Model

    public class Model : INotifyPropertyChanged
      {
          public event PropertyChangedEventHandler PropertyChanged;
  
          // This method is called by the Set accessor of each property.  
          // The CallerMemberName attribute that is applied to the optional propertyName  
          // parameter causes the property name of the caller to be substituted as an argument.  
          private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
          {
              PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
          }
  
          private string text;
          public string Text
          {
              get
              {
                  return this.text;
              }
  
              set
              {
                  if (value != this.text)
                  {
                      this.text = value;
                      NotifyPropertyChanged();
                  }
              }
          }
  
          private Color color;
          public Color Color
          {
              get
              {
                  return this.color;
              }
  
              set
              {
                  if (value != this.color)
                  {
                      this.color = value;
                      NotifyPropertyChanged();
                  }
              }
          }
      }
  

  Page Xaml

   <ContentPage.ToolbarItems>
          <ToolbarItem Text="Change" Clicked="ToolbarItem_Clicked"/>
      </ContentPage.ToolbarItems>
      <ContentPage.Content>
          <ListView x:Name="listView">
              <ListView.ItemTemplate>
                  <DataTemplate>
                      <ViewCell >
                          <Label Text="{Binding Text}" TextColor="{Binding Color}"/>
                      </ViewCell>
                  </DataTemplate>
              </ListView.ItemTemplate>
          </ListView>
      </ContentPage.Content>
  

  Page code behind

  [XamlCompilation(XamlCompilationOptions.Compile)]
      public partial class Page1 : ContentPage
      {
  
          public List<Model> list { get; set; }
  
          public Page1()
          {
              InitializeComponent();
  
              list = new List<Model>();
  
  
              for(int i = 0; i< 5; i++)
              {
                  Model model = new Model();
                  model.Text = "Text" + (i+1).ToString();
                  model.Color = Color.Black;
                  list.Add(model);
              }
  
              listView.ItemsSource = list;
          }
  
  
  
  
          bool statement = false;
          private void ToolbarItem_Clicked(object sender, EventArgs e)   
          {
               //here i use button click to trigger the change of statement .
              statement = true;
  
              if (statement)
              {
                  var model = list[3];
                  model.Color = Color.Red;
              }
          }
      }
  

  

  5
• ganesh96 Member ✭✭✭

  May 4

  Hi ColeX,

  Thanks for the answer, it seems to work except my listView displays something strange. My Page is located in the folder Pages and my Model is located in the folder Utils.Models:
  

  This is the result in my list with your exact code:
  

  Do you know what's the problem here?

  Regards, Ganesh

  0
• ColeX Member, Xamarin Team Xamurai

  May 5 edited May 5 Accepted Answer

  The binding works but the path is incorrect , you have to specify the model property name(not dot) on the label in viewcell.

                   <ViewCell >
                      <Label Text="{Binding Text}" TextColor="{Binding Color}"/>    //Text and Color is the property name defined in model class 
                  </ViewCell>
  

  5
• ganesh96 Member ✭✭✭

  May 5

  Thanks a lot!

  0