MAUI开发问题：如何从当前视图中移除ViewCell

问题核心是你当前使用的List<Notification>不支持集合变更通知，无法自动触发UI刷新。MAUI中需要使用ObservableCollection<T>作为ListView的数据源，它会在集合项发生增删时自动通知UI更新。以下是具体修改步骤：

1. 替换数据源类型 #

将页面中的List<Notification>字段改为ObservableCollection<Notification>：

// 原代码
// private List<Notification> _notifications;
// 修改后
private ObservableCollection<Notification> _notifications;

2. 初始化ObservableCollection #

在OnAppearing方法中，将从API获取的列表转换为ObservableCollection并绑定到ListView：

protected async override void OnAppearing()
{
    base.OnAppearing();
    ActivityIndicator.IsVisible = true;
    ActivityIndicator.IsRunning = true;
    
    string token = Preferences.Get("accesstoken", string.Empty);
    string tokenValue = token.Split(' ')[0];
    var jwtToken = new JwtSecurityToken(tokenValue);
    var personalIdClaim = jwtToken.Claims.FirstOrDefault(claim => claim.Type == "PersonalId")?.Value;
    
    if (personalIdClaim is not null)
    {
        List<Notification> userNotifications = await ApiService.LatestNotifications(Convert.ToInt32(personalIdClaim));
        // 直接转换为ObservableCollection
        _notifications = new ObservableCollection<Notification>(userNotifications);
        // 绑定数据源
        ListOfNotifications.ItemsSource = _notifications;
    }
    
    ActivityIndicator.IsVisible = false;
    ActivityIndicator.IsRunning = false;
}

3. 优化删除逻辑 #

修改Frame_Tapped方法，先调用API删除数据，确认成功后再从ObservableCollection中移除项（UI会自动刷新），同时避免阻塞UI线程：

private async void Frame_Tapped(object sender, EventArgs e)
{
    ActivityIndicator.IsVisible = true;
    ActivityIndicator.IsRunning = true;
    
    var frame = (Frame)sender;
    var viewCell = (ViewCell)((Grid)frame.Parent).Parent;
    // 直接从BindingContext获取对应的Notification对象
    var itemToRemove = (Notification)viewCell.BindingContext;
    
    try
    {
        // 先调用API删除数据库中的数据
        await ApiService.DeleteNotification(itemToRemove.Id.ToString());
        // 等待1秒（可选，根据需求调整）
        await Task.Delay(1000);
        // 从集合移除项，UI会自动更新
        _notifications.Remove(itemToRemove);
    }
    catch (Exception ex)
    {
        // 处理删除失败的情况，比如提示用户
        await DisplayAlert("错误", "删除通知失败", "确定");
    }
    
    ActivityIndicator.IsVisible = false;
    ActivityIndicator.IsRunning = false;
}

关键说明 #

• ObservableCollection<T>实现了INotifyCollectionChanged接口，当集合内容变化时会自动通知绑定的ListView更新UI，无需手动重新设置ItemsSource。
• 先调用API再移除集合项，避免API删除失败导致本地数据与数据库不一致。
• 使用await Task.Delay(1000)替代Thread.Sleep(1000)，前者不会阻塞UI线程，保证界面响应。
• XAML部分无需修改，数据源绑定逻辑保持不变即可。

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