CollectionView 中的 RefreshView Xamarin.Forms

RefreshView in CollectionView Xamarin.Forms

我正在尝试在我的 CollectionView 中使用 RefreshView,但我遇到了问题。 当我手动更改视图模型中的数据时,我尝试通过下拉屏幕进行刷新,出现刷新圈但我的数据未更新

我是不是漏掉了什么?

这是我的代码

查看

<ContentPage.Content>
    <RefreshView IsRefreshing="{Binding IsRefreshing}"
                 Command="{Binding RefreshCommand}">
        <CollectionView ItemsSource="{Binding ListOfColor}"
                    Margin="10"
                    SelectionMode="Single">
            <CollectionView.ItemsLayout>
                <GridItemsLayout Orientation="Vertical"/>
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Grid ColumnSpacing="7" RowSpacing="5">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="150"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>

                        <BoxView BackgroundColor="{Binding Color}"
                            Grid.Column="0" Grid.Row="0" Grid.RowSpan="2"
                            HeightRequest="60"
                            WidthRequest="60" />
                        <Label Text="{Binding ColorName}"
                        Grid.Column="1" Grid.Row="0"
                        TextColor="{Binding Color}"
                        FontAttributes="Bold"/>
                        <Label Text="{Binding ColorDesc}"
                        Grid.Column="1" Grid.Row="1"
                        TextColor="{Binding Color}"/>
                    </Grid>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </RefreshView>
</ContentPage.Content>

ViewModel

class ColorCollectionViewModel : INotifyPropertyChanged
{
    const int RefreshDuration = 2;
    bool isRefreshing;

    public bool IsRefreshing
    {
        get
        {
            return isRefreshing;
        }
        set
        {
            isRefreshing = value;
            OnPropertyChanged();
        }
    }

    public ObservableCollection<ListColorModel> ListOfColor { get; private set; }

    public ICommand RefreshCommand => new Command(async () => await RefreshDataAsync());

    public ColorCollectionViewModel()
    {
        ListOfColor = new ObservableCollection<ListColorModel>();
        NewData();
    }

    void NewData()
    {
        ListOfColor.Add(new ListColorModel { ColorName = "Hitam", Color = "Black", ColorDesc = "Ini Warna Hitam" });
        ListOfColor.Add(new ListColorModel { ColorName = "Coklat", Color = "Brown", ColorDesc = "Ini Warna Coklat" });
        ListOfColor.Add(new ListColorModel { ColorName = "Merah", Color = "Red", ColorDesc = "Ini Warna Merah" });
        ListOfColor.Add(new ListColorModel { ColorName = "Orange", Color = "Orange", ColorDesc = "Ini Warna Orange" });
        ListOfColor.Add(new ListColorModel { ColorName = "Kuning", Color = "Yellow", ColorDesc = "Ini Warna Kuning" });
        ListOfColor.Add(new ListColorModel { ColorName = "Hijau", Color = "Green", ColorDesc = "Ini Warna Hijau" });
        ListOfColor.Add(new ListColorModel { ColorName = "Biru", Color = "Blue", ColorDesc = "Ini Warna Blue" });
        ListOfColor.Add(new ListColorModel { ColorName = "Ungu", Color = "Purple", ColorDesc = "Ini Warna Ungu" });
        ListOfColor.Add(new ListColorModel { ColorName = "Abu-Abu", Color = "Gray", ColorDesc = "Ini Warna Abu-Abu" });
        ListOfColor.Add(new ListColorModel { ColorName = "Pink", Color = "Pink", ColorDesc = "Ini Warna Pink" });

        OnPropertyChanged(nameof(ListOfColor));
    }

    async Task RefreshDataAsync()
    {
        IsRefreshing = true;
        await Task.Delay(TimeSpan.FromSeconds(RefreshDuration));
        IsRefreshing = false;
    }

    #region INotifyPropertyChanged

    public event PropertyChangedEventHandler PropertyChanged;

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

当您拉下绑定到 RefreshDataAsync 的 RefreshView 命令时,将执行但您不会更改其中的任何数据,请尝试使用类似以下内容的方法:

仅供参考,会清除所有数据,只加载一个

    async Task RefreshDataAsync()
    {
        IsRefreshing = true;
        ListOfColor.clear();
        ListOfColor.Add(new ListColorModel { ColorName = "Pink", Color = "Pink", ColorDesc = "Ini Warna Pink" });
        await Task.Delay(TimeSpan.FromSeconds(RefreshDuration));
        OnPropertyChanged(nameof(ListOfColor));
        IsRefreshing = false;
    }

观看此视频 https://www.youtube.com/watch?v=JY900hOQCKQ and try to make the example using the source code of Monkey Finder that you can find here: https://github.com/jamesmontemagno/app-pretty-monkeyfinder。尝试在您的应用程序中复制该练习。 这帮助我理解了 Refreshview 的工作原理。