如何在 MAUI 应用程序中刷新视图 model 中的数据

Question

我在 XAML 文件中有一个轮播视图：

     <CarouselView x:Name="AttView" ItemsSource="{Binding Attendances}" IndicatorView="indicatorView">
        <CarouselView.ItemTemplate>
            <DataTemplate x:DataType="model:AttendanceItem">
                <Grid Margin="0, 20, 0, 0" 
                          ColumnDefinitions="*, *" 
                          RowDefinitions="Auto, Auto, Auto, Auto, Auto">
                    <Label Margin="0, 5, 0, 5" Grid.Row="0" Grid.Column="0" Text="Turno actual" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="0" Grid.Column="1" Text="{Binding TurnoActual}" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="1" Grid.Column="0" Text="Hora de llegada" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="1" Grid.Column="1" Text="{Binding HoraLlegada, StringFormat='{0:HH:mm}'}" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="2" Grid.Column="0" Text="Hora de salida" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="2" Grid.Column="1" Text="{Binding HoraSalida, StringFormat='{0:HH:mm}'}" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="3" Grid.Column="0" Text="Horas trabajadas" />
                    <Label Margin="0, 5, 0, 5" Grid.Row="3" Grid.Column="1" Text="{Binding HorasTrabajadas, StringFormat='{0:hh} h {0:mm} m'}" />
                </Grid>
            </DataTemplate>
        </CarouselView.ItemTemplate>
    </CarouselView>
    <IndicatorView x:Name="indicatorView"
               IndicatorColor="Gray"
               SelectedIndicatorColor="Black"
               HorizontalOptions="Center" />

另一方面，视图模型是这样定义的：

public ObservableCollection<AttendanceItem> Attendances { get; set; }

public MainViewModel()
{
    Attendances = new ObservableCollection<AttendanceItem>
    {
        new AttendanceItem
        {
            TurnoActual = new TurnoItem
            {
                Inicio = DateTime.Today.AddHours(8),
                Fin = DateTime.Today.AddHours(18),
                Tipo = Enums.TipoTurnoEnum.Fijo
            },
            HoraLlegada = DateTime.Today.AddHours(7).AddMinutes(50)
        }
    };
}

最后，这是该系列的项目：

public class AttendanceItem
{
    public TurnoItem TurnoActual { get; set; }
    public DateTime? HoraLlegada { get; set; }
    public DateTime? HoraSalida { get; set; }
    public TimeSpan HorasTrabajadas { 
        get { 
            if (HoraLlegada is null && HoraSalida is null)
                return TimeSpan.Zero;

            DateTime llegada = HoraLlegada ?? DateTime.Today.Add(TurnoActual.Inicio.TimeOfDay);
            DateTime salida = HoraSalida ?? DateTime.Now;

            return salida - llegada;
        } 
    }
}

注意HorasTrabajadas属性。 如果HoraSalida是 null，则应显示当前时间。

所以问题是，如何刷新视图，以便我可以看到HorasTrabajadas属性如何每 1 分钟递增一次值？

我尝试在后面的视图代码中使用计时器，代码如下：

    private void Timer_Elapsed(object sender, System.Timers.ElapsedEventArgs e)
    {
        OnPropertyChanged(nameof(MainViewModel.Attendances));
    } 

但它没有用。

Answer 1

正如 Jason 所指出的，Mode AttendanceItem 必须实现INotifyPropertyChanged接口，.NET 中的数据绑定机制 MAUI 将一个处理程序附加到此PropertyChanged事件，以便在属性更改时通知它并使用新值更新目标。

您可以参考下面的示例代码：

public class AttendanceItem: INotifyPropertyChanged 
{
    private DateTime horaLlegada;
    public DateTime HoraLlegada
    {
         get => horaLlegada;
         set
         {
             if (horaLlegada != value)
             {
                    horaLlegada = value;
                    OnPropertyChanged("HoraLlegada");
              }
         }

    }

        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName] string propName = null)
        {
            PropertyChanged?.Invoke(this,
                 new PropertyChangedEventArgs(propName));
        }
}

更多信息可以参考数据绑定和MVVM 。