使用 DataTrigger 的 .NET Maui 样式

概述：我有两个属性：

1. IsPast
2. IsCurrentMonth

如果已经过去或者not当月我想用红色显示标签。

以下代码是默认 Maui 应用程序的缩小版本。如果你运行它，你会得到红色标签（预期）。单击一次后，它会保持红色（预期），但单击后会打开和关闭红色。这是一个错误还是我不明白 DataTrigger/Style/whatever 的工作方式：

查看型号：

public class ViewModel : INotifyPropertyChanged
    {
        private bool _isPast;
        public bool IsPast
        {
            get => _isPast;
            set
            {
                _isPast = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(IsPast)));
            }
        }

        private bool _isCurrentMonth;
        public bool IsCurrentMonth
        {
            get => _isCurrentMonth;
            set
            {
                _isCurrentMonth = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(IsCurrentMonth)));
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
    }

然后是 XAML：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:BugMaui"
             x:Class="BugMaui.MainPage"
             x:DataType="local:ViewModel">

    <VerticalStackLayout>

        <HorizontalStackLayout>
            <Label Text="IsPast: " />
            <Label Text="{Binding IsPast}" />
        </HorizontalStackLayout>

        <HorizontalStackLayout>
            <Label Text="IsCurrentMonth: " />
            <Label Text="{Binding IsCurrentMonth}" />
        </HorizontalStackLayout>

        <Label
            Text="Hello, World!"
            FontSize="32"
            HorizontalOptions="Center">
            <Label.Style>
                <Style TargetType="Label">
                    <Style.Triggers>
                        <DataTrigger TargetType="Label" Binding="{Binding IsPast}" Value="True">
                            <Setter Property="Background" Value="Red" />
                        </DataTrigger>
                        <DataTrigger TargetType="Label" Binding="{Binding IsCurrentMonth}" Value="False">
                            <Setter Property="Background" Value="Red" />
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Label.Style>
        </Label>

        <Button
            Text="Click me"
            Clicked="OnCounterClicked"/>

    </VerticalStackLayout>

</ContentPage>

以及背后的代码：

public partial class MainPage : ContentPage
{
    ViewModel viewModel;

    public MainPage()
    {
        InitializeComponent();
        viewModel = new ViewModel { IsCurrentMonth = true, IsPast = true };
        BindingContext = viewModel;
    }

    private void OnCounterClicked(object sender, EventArgs e)
    {
        viewModel.IsPast = !viewModel.IsPast;
        viewModel.IsCurrentMonth = !viewModel.IsCurrentMonth;
    }
}

我对这个问题的回答是是的，这是一个错误如果 .NET MAUI 开发人员没有决定更改 DataTrigger/Style 在 XAMARIN（以及 WPF）中的工作方式。

根据.NET MAUI 触发器文档 https://learn.microsoft.com/en-us/dotnet/maui/fundamentals/triggers?view=net-maui-7.0#data-triggers, 数据触发应该“当绑定数据满足指定条件时，应用属性值或执行操作”。如果不满足条件，则不应执行任何操作。

因此，如果 viewModel.IsCurrentMonth 为 False 或 viewModel.IsPast 为 True，您代码部分中的 DataTrigger 是正确的，可以满足您设置红色背景的要求：

<DataTrigger TargetType="Label" Binding="{Binding IsCurrentMonth}" Value="False">
    <Setter Property="Background" Value="Red" />
</DataTrigger>
<DataTrigger TargetType="Label" Binding="{Binding IsPast}" Value="True">
    <Setter Property="Background" Value="Red" />
</DataTrigger>

这个用例DataTrigger 在 XAMARIN 和 WPF 中都运行良好。正如预期的那样，通过重复点击，背景仍保持红色。

没有解释为什么在 .NET MAUI DataTrigger 中工作方式不同。红色背景仅根据绑定到 DataTrigger 的“lastly set”属性的值进行设置。因此，如果不满足条件，则先前满足的条件将被忘记，并设置默认（透明）背景。

在您的示例中，这意味着背景是根据 viewModel.IsCurrentMonth 属性设置的：

private void OnCounterClicked(object sender, EventArgs e)
{
    viewModel.IsPast = !viewModel.IsPast;
    viewModel.IsCurrentMonth = !viewModel.IsCurrentMonth;
}

如果更改 OnCounterClicked 事件处理程序中设置 viewModel 属性的顺序，则背景将根据 viewModel.IsPast 属性的值设置。

private void OnCounterClicked(object sender, EventArgs e)
{ 
    viewModel.IsCurrentMonth = !viewModel.IsCurrentMonth;
    viewModel.IsPast = !viewModel.IsPast;        
} 

多触发提出于这个答案 https://stackoverflow.com/a/73755816/14606023不能满足您的要求，正如张丽云评论中提到的那样。

Liyung 张提出的针对此错误的以下解决方法正在发挥作用，但如果所描述的 DataTrigger 行为是否是错误，它仍然无法回答原始问题：

<Label.Style>
    <Style TargetType="Label">
        <Setter Property="Background" Value="Red" />
        <Style.Triggers>
            <MultiTrigger TargetType="Label">
                <MultiTrigger.Conditions>
                    <BindingCondition Binding="{Binding IsPast}" Value="False" />
                    <BindingCondition Binding="{Binding IsCurrentMonth}" Value="True" />
                </MultiTrigger.Conditions>
                <Setter Property="Background" Value="Transparent" />
            </MultiTrigger>
        </Style.Triggers>
    </Style>
</Label.Style>

结论：根据我的经验，上述新的 .NET MAUI DataTrigger 行为可以归类为错误，不幸的是，它是开发中其他问题的根源，不仅在 DataTrigger 样式中，而且在 MultiTrigger 使用中，我不得不与类似的不可预测的意外情况作斗争，并且真的很奇怪的行为。