在毛伊岛使用 ReactiveUI 实现分页

Question

我是一名业余程序员，面临着一个问题。尽管尝试了各种方法来使用 ReactiveUI 在毛伊岛项目中实现分页，但我遇到了障碍。我已经用尽了我目前的所有知识，发现自己已经尝试了一切，但根本无法取得进一步的进展。虽然现有代码包含搜索功能，但我特别寻求有关为 CollView (CollectionView) 引入分页的建议。目标是加载初始的 20 个项目，并随着用户滚动动态加载更多项目。

ReadOnlyObservableCollection<FirebaseEvent<Kunde>> myDerivedList;

    private Func<FirebaseEvent<Kunde>, bool> _searchFilter = _ => true;
    public Func<FirebaseEvent<Kunde>, bool> SearchFilter
    {
        get { return _searchFilter; }
        set
        {
            if (_searchFilter != value)
            {
                _searchFilter = value;
                OnPropertyChanged(nameof(SearchFilter));
            }
        }
    }

    public Kunden()
    {
        InitializeComponent();
        BindingContext = this;

        // Subscribe SourceCache
        var dis = FirebaseService.SourceListKunden.Connect()
            .Filter(this.WhenAnyValue(x => x.SearchFilter))
            .Sort(SortExpressionComparer<FirebaseEvent<Kunde>>.Descending(x => x.Key))
            .SubscribeOn(NewThreadScheduler.Default)
            .ObserveOn(SynchronizationContext.Current)
            .Bind(out myDerivedList)
            .Subscribe();

        // Suchfunktion
        this.WhenAnyValue(x => x.searchBar.Text)
            .DistinctUntilChanged()
            .Throttle(TimeSpan.FromMilliseconds(500))
            .SubscribeOn(NewThreadScheduler.Default)
            .ObserveOn(SynchronizationContext.Current)
            .Subscribe(suchText =>
            {
                Debug.WriteLine("Eingabe Suchleiste :" + suchText);
                SearchFilter = w => string.IsNullOrWhiteSpace(suchText) || String.Join(" ", new List<string>() { w.Object.Kundennummer.ToString(), w.Object.Firma, w.Object.Vorname, w.Object.Nachname }).Contains(suchText, StringComparison.CurrentCultureIgnoreCase);
            });

        //ToDo: Pagination
        CollView.ItemsSource = myDerivedList;


    }
}

如果有人有与在这种情况下实现分页相关的见解、示例或建议，我们将非常感谢您的指导。我尝试了多种方法，但似乎都不起作用，而且我已经没有想法了。感谢您提供的任何帮助！

Answer 1

Virtualise() 解决了我的问题。

    ReadOnlyObservableCollection<FirebaseEvent<Kunde>> myDerivedList;

private Func<FirebaseEvent<Kunde>, bool> _searchFilter = _ => true;
public Func<FirebaseEvent<Kunde>, bool> SearchFilter
{
    get { return _searchFilter; }
    set
    {
        if (_searchFilter != value)
        {
            _searchFilter = value;
            OnPropertyChanged(nameof(SearchFilter));
        }
    }
}

int Pagesize = 20;
public BehaviorSubject<IVirtualRequest> pageSizeRequest = new BehaviorSubject<IVirtualRequest>(new VirtualRequest(0, 20));

public Kunden()
{
    InitializeComponent();
    BindingContext = this;

    // Subscribe SourceCache
    var dis = FirebaseService.SourceListKunden.Connect()

        .Filter(this.WhenAnyValue(x => x.SearchFilter))
        .Sort(SortExpressionComparer<FirebaseEvent<Kunde>>.Descending(x => x.Key))
        .Virtualise(pageSizeRequest)
        .SubscribeOn(NewThreadScheduler.Default)
        .ObserveOn(SynchronizationContext.Current)
        .Bind(out myDerivedList)
        .Subscribe();

    // Suchfunktion
    this.WhenAnyValue(x => x.searchBar.Text)
        .DistinctUntilChanged()
        .Throttle(TimeSpan.FromMilliseconds(500))
        .SubscribeOn(NewThreadScheduler.Default)
        .ObserveOn(SynchronizationContext.Current)
        .Subscribe(suchText =>
        {
            Debug.WriteLine("Eingabe Suchleiste :" + suchText);
            Pagesize = 20;
            SearchFilter = w => string.IsNullOrWhiteSpace(suchText) || String.Join(" ", new List<string>() { w.Object.Kundennummer.ToString(), w.Object.Firma, w.Object.Vorname, w.Object.Nachname }).Contains(suchText, StringComparison.CurrentCultureIgnoreCase);
        });

    CollView.ItemsSource = myDerivedList;

}