Highlight for of collection view based on condition

Question

I have a collection view and I need to change background color of the row if the Level is "Debug"

This gives me every line colored. What am I doing wrong as I need only few lines to be highlighted not all

    <CollectionView HorizontalOptions="CenterAndExpand"  
                                BackgroundColor="{Binding TextColor, Converter={StaticResource StringToColorConverter}}"
                                SelectionChangedCommandParameter="{Binding .}"
                                SelectionMode="Multiple"   
                                SelectionChanged="OnCollectionViewSelectionChanged" 
                                VerticalOptions="FillAndExpand" 
                                ItemsSource="{Binding Logs, Mode=TwoWay}">
                    <CollectionView.ItemTemplate>
                        <DataTemplate>
                            <templates:DiagnosticEventPageTemplate />
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
        </CollectionView>

DiagnosticInfoViewModel.cs

public string TextColor
{
    get => (string) GetValue(TextColorProperty);
    set => SetValue(TextColorProperty, value);
}
            
public readonly BindableProperty TextColorProperty = BindableProperty.Create(
    propertyName: nameof(TextColor),
    returnType: typeof(string),
    defaultValue: "#FFFFFF",
    declaringType: typeof(DiagnosticMenuViewModel));
             
public DiagnosticInfoViewModel(LogFile data)
{   
    foreach (var file in files)
    {
        var log = new JsonLogEvent
        {
            Level = file.Level,
            MessageTemplate = file.MessageTemplate,
        };

        files.Where(a => a.Level == "Debug");
        {
            TextColor = "#00FF00";
        }

        if (log.Level == "Debug")
        {
            TextColor = "#00FF00";
        }
        Logs.Add(log);
   }
}

Answer 1

You didn't share everything needed to reproduce the problem, but from what you have shared I can tell that adding BackgroundColor="{Binding TextColor in CollectionViewis wrong, since you want text lines to be coloured, and not the whole CollectionView. Also, TextColor should be a property of JsonLogEvent, so that you are able to control it for each log.

I don't know how your DiagnosticEventPageTemplate looks like, but I guess it has a label. I created a sample app in order to show you how you can achieve what you want:

So, in XAML, move BackgroundColor from CollectionView to Label (I created my DataTemplate, you should do something similar in yours):

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:TestColor2="clr-namespace:TestColor2"
             x:Class="TestColor2.MainPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <TestColor2:StringToColorConverter x:Key="StringToColorConverter"/>
        </ResourceDictionary>
    </ContentPage.Resources>
    <StackLayout>
        <CollectionView HorizontalOptions="CenterAndExpand"                                 
                                SelectionChangedCommandParameter="{Binding .}"
                                SelectionMode="Multiple"   
                                SelectionChanged="OnCollectionViewSelectionChanged" 
                                VerticalOptions="FillAndExpand" 
                                ItemsSource="{Binding Logs, Mode=TwoWay}">
            <CollectionView.ItemTemplate>
                <DataTemplate >
                    <Label FontSize="Subtitle" BackgroundColor="{Binding TextColor, Converter={StaticResource StringToColorConverter}}">
                        <Label.FormattedText>
                            <FormattedString>
                                <Span Text="{Binding Level}" FontAttributes="Bold"/>
                                <Span Text=" " FontAttributes="Bold"/>
                                <Span Text="{Binding MessageTemplate}"/>
                            </FormattedString>
                        </Label.FormattedText>
                    </Label>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </StackLayout>

</ContentPage>

In .cs add TextColor to JsonLogEvent

    public class JsonLogEvent
    {
        public string Level { get; set; }
        public string MessageTemplate { get; set; }
        public string TextColor { get; set; } = "#FFFFFF";
    }

and change the foreach loop:

            foreach (var file in files)
            {
                var log = new JsonLogEvent
                {
                    Level = file.Level,
                    MessageTemplate = file.MessageTemplate,
                    
                };

                if (log.Level == "Debug")
                {
                    log.TextColor = "#00FF00";
                }
               
                Logs.Add(log);
            }

If this doesn't answer your question, you will need to share more info.