如何在Xamarin Forms的CollectionView中根据日期更改行背景色

直接通过遍历集合修改控件属性的方式（比如你写的foreach循环）不符合MVVM设计模式，还会因为CollectionView的Item复用机制导致显示异常。推荐以下两种更合理的实现方式：

方法一：使用值转换器（IValueConverter） #

值转换器可以直接在XAML绑定中根据ExpiryDate转换出对应的背景色，无需修改ViewModel或模型类：

1. 创建日期转颜色的转换器类：

using System;
using Xamarin.Forms;

public class ExpiryDateToColorConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (value is DateTime expiryDate)
        {
            var now = DateTime.Now;
            if (expiryDate <= now)
            {
                return Color.Coral;
            }
            else if (expiryDate > now.AddMonths(3)) // 注意：原代码的AddMonth是拼写错误，应为AddMonths
            {
                return Color.Orange;
            }
        }
        // 默认返回的颜色（比如白色）
        return Color.White;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

2. 在XAML中引用转换器并绑定：
   首先在页面的ResourceDictionary中声明转换器：

<ContentPage.Resources>
    <local:ExpiryDateToColorConverter x:Key="ExpiryColorConverter" />
</ContentPage.Resources>

然后在CollectionView的ItemTemplate里，给根布局的BackgroundColor绑定ExpiryDate并使用转换器：

<CollectionView ItemsSource="{Binding MyList}">
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Frame BackgroundColor="{Binding ExpiryDate, Converter={StaticResource ExpiryColorConverter}}"
                   Padding="10" Margin="5">
                <!-- 这里放置你的行内容，比如Label显示过期日期等 -->
                <Label Text="{Binding ExpiryDate, StringFormat='过期日期：{0:yyyy-MM-dd}'}" />
            </Frame>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

方法二：在模型类中添加计算属性 #

如果更倾向于把逻辑放在后端，可以给你的数据模型添加一个只读的计算属性，直接返回对应的背景色：

1. 修改数据模型类：

public class YourModel
{
    public DateTime ExpiryDate { get; set; }
    // 其他属性...

    public Color RowBackgroundColor
    {
        get
        {
            var now = DateTime.Now;
            if (ExpiryDate <= now)
            {
                return Color.Coral;
            }
            else if (ExpiryDate > now.AddMonths(3))
            {
                return Color.Orange;
            }
            return Color.White;
        }
    }
}

2. 在XAML中直接绑定这个计算属性：

<CollectionView ItemsSource="{Binding MyList}">
    <CollectionView.ItemTemplate>
        <DataTemplate>
            <Frame BackgroundColor="{Binding RowBackgroundColor}"
                   Padding="10" Margin="5">
                <Label Text="{Binding ExpiryDate, StringFormat='过期日期：{0:yyyy-MM-dd}'}" />
            </Frame>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>

注意事项 #

• 如果你使用方法二，且ExpiryDate是动态更新的，需要让模型类实现INotifyPropertyChanged接口，在ExpiryDate变更时触发RowBackgroundColor的属性通知，确保UI实时更新。
• 原代码中的AddMonth是拼写错误，正确方法是AddMonths（复数形式）。

内容的提问来源于stack exchange，提问作者Marian34