.NET Maui应用渐进式滚动失效问题求助

问题现象 #

• 处理大数字时，即便用异步计算质数，列表可视化仍出现卡顿
• 尝试通过CollectionView的RemainingItemsThreshold实现渐进式滚动，但RemainingItemsThresholdReached事件完全不触发

问题根源分析 #

1. CollectionView无滚动空间：原布局中CollectionView放在VerticalStackLayout内，未设置高度约束或填充剩余空间，导致控件不会出现滚动条，自然无法触发剩余项阈值事件。
2. 索引越界风险：LoadNextPage方法中使用GetRange时未判断是否超出列表长度，会抛出异常中断逻辑。
3. 内存占用过高：一次性获取所有质数存入列表，大数字场景下内存压力大，间接导致UI卡顿。
4. 控件兼容性问题：CollectionView中使用TextCell（该控件更适配ListView），可能引发渲染异常。
5. 重复事件绑定：XAML和代码中重复绑定RemainingItemsThresholdReached事件，可能导致逻辑冲突。

修复步骤 #

1. 调整布局，确保CollectionView可滚动

将原VerticalStackLayout替换为Grid，给CollectionView分配剩余空间，保证控件能滚动：

<?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:PrimeNumApp"
             x:Class="PrimeNumApp.MainPage">
    
    <Grid Padding="30,0" RowDefinitions="Auto,Auto,Auto,Auto,*">
        <Label
            Text="质数列表"
            Style="{StaticResource Headline}"
            SemanticProperties.HeadingLevel="Level1"
            Grid.Row="0"/>
        <Image 
            Source="kitten.gif"
            HeightRequest="200" 
            HorizontalOptions="Center"  
            IsAnimationPlaying="True"
            Grid.Row="1"/>
        <Entry
            x:Name="NumberEntry"
            Placeholder="输入数字"
            Grid.Row="2"/>
        <StackLayout
            Orientation="Horizontal"
            Spacing="5"
            Grid.Row="3">
            <Button
                x:Name="LoadBtn"
                Text="加载程序集" 
                Clicked="OnLoadClicked"
                HorizontalOptions="FillAndExpand"
                BackgroundColor="Gray" />
            <Button
                x:Name="StartBtn"
                Text="计算"
                Clicked="OnStartClicked"
                IsEnabled="False"
                HorizontalOptions="FillAndExpand"
                BackgroundColor="DarkRed" />
        </StackLayout>
        <CollectionView x:Name="PrimeNumCollection"
                        RemainingItemsThreshold="5"
                        RemainingItemsThresholdReached="OnCollectionViewRemainingItemsThresholdReached"
                        VerticalOptions="FillAndExpand"
                        Grid.Row="4">
            <CollectionView.ItemsLayout>
                <LinearItemsLayout Orientation="Vertical" />
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Label Text="{Binding}" TextColor="White" Padding="5"/>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
    </Grid>
</ContentPage>

2. 修复渐进式滚动逻辑，避免索引越界

修改LoadNextPage方法，添加边界判断：

private void LoadNextPage()
{
    if (_currentPage >= _allPrimeNumbers.Count)
        return;

    int itemsToLoad = Math.Min(PageSize, _allPrimeNumbers.Count - _currentPage);
    foreach (int number in _allPrimeNumbers.GetRange(_currentPage, itemsToLoad))
    {
        DisplayablePrimeNums.Add(number);
    }

    _currentPage += itemsToLoad;
}

3. 优化大数字场景下的UI卡顿

改为分批生成并更新UI，减少内存占用（需确保IPrimeGenerator提供单个质数判断方法，或修改GetPrimeNumbers支持分批输出）：

public async void OnStartClicked(object sender, EventArgs e)
{
    if (!int.TryParse(NumberEntry.Text, out int number) || number < 2)
    {
        await DisplayAlert("错误", "请输入有效的自然数（≥2）", "确定");
        return;
    }

    try
    {
        StartBtn.IsEnabled = false;
        DisplayablePrimeNums.Clear();
        _allPrimeNumbers.Clear();
        _currentPage = 0;

        await Task.Run(() =>
        {
            for (int i = 2; i <= number; i++)
            {
                if (_primeNumberGenerator.IsPrime(i))
                {
                    _allPrimeNumbers.Add(i);
                    // 在主线程更新UI集合
                    MainThread.BeginInvokeOnMainThread(() =>
                    {
                        DisplayablePrimeNums.Add(i);
                    });
                }
            }
        });
    }
    catch (Exception ex)
    {
        await DisplayAlert("错误", ex.Message, "确定");
    }
    finally
    {
        StartBtn.IsEnabled = true;
    }
}

4. 移除重复事件绑定

删除构造函数中重复的事件绑定代码：

public MainPage()
{
    InitializeComponent();
    DisplayablePrimeNums = new ObservableCollection<int>();
    PrimeNumCollection.ItemsSource = DisplayablePrimeNums;
    // 移除该行：PrimeNumCollection.RemainingItemsThresholdReached += OnCollectionViewRemainingItemsThresholdReached;
}

内容的提问来源于stack exchange，提问作者Марат