.NET MAUI中ScrollView下绑定元素无法更新的问题求助

问题 #

在.NET MAUI应用中使用ScrollView嵌套元素后，出现绑定更新异常：

• HorizontalStackLayout的IsVisible绑定SelectedItems.Count（通过IntToBoolConverter转换）失效，即使SelectedItems.Count>0也无法显示；改用布尔属性绑定同样无效。
• 绑定ObservableRangeCollection<SelectionItem>类型的SelectedItems作为ItemsSource的CollectionView，添加元素后需手动滚动才会显示新项。
  移除ScrollView后绑定恢复正常，需要保留页面滚动功能同时解决上述问题。

原因分析 #

1. 滚动控件嵌套冲突：你使用的sho:CollectionView是自带滚动功能的自定义控件，嵌套在ScrollView中会引发滚动逻辑冲突，导致控件内部的ItemsSource更新通知被拦截，必须手动触发滚动才能刷新UI。
2. 布局约束不合理：包含CollectionView的Grid设置了固定HeightRequest="500"，同时ScrollView的子Grid使用RowDefinitions="Auto"，这种组合会让布局系统无法正确感知内容变化，导致绑定更新的UI通知无法传递。
3. 冗余的绑定通知：ObservableRangeCollection在Clear()和AddRange()时会自动触发集合变更通知，额外调用OnPropertyChanged(nameof(SelectedItems))反而会干扰正常的通知逻辑，甚至导致UI更新异常。

解决办法 #

1. 移除滚动控件嵌套冲突 #

直接使用自定义CollectionView的原生滚动功能，删除外层ScrollView，同时调整布局容器的约束，让内容自适应：

<Grid RowDefinitions="*">
    <views:BackgroundImageView x:Name="BackgroundImage" VerticalOptions="Start"/>
    <Border Grid.Row="0" Style="{StaticResource BorderStyleView}" Opacity="0.85" VerticalOptions="Fill" Margin="15, 0, 15, 10" MinimumHeightRequest="300" >
        <StackLayout Background="Red">
            <!-- Heading -->
            <Label Text="{loc:Translate MealHeaderText, StringFormat='{0}:'}" Style="{StaticResource BorderHeadline}"  Padding="15, 15, 15, 5" />
            <!-- Min, Amount-->
            <HorizontalStackLayout Margin="0, 10, 0, -5" IsVisible="{Binding SelectedItems.Count, Converter={StaticResource IntToBoolConverter}}">
                <VerticalStackLayout Margin="150, 0, 10, 0" >
                    <Label Text="Min"/>
                    <Label Text="{loc:Translate AmountColumnString}"/>
                </VerticalStackLayout>
            </HorizontalStackLayout>
            <!-- CollectionView to display the Selected Items -->
            <sho:CollectionView CollectionPadding="10, 10, 10, 10"
                                EnableDragAndDrop="True"
                                DragAndDropDirection="VerticalOnly"
                                DragAndDropTrigger="LongTap"
                                ItemHeight="80"
                                ItemsSource="{Binding SelectedItems, Mode=OneWay}"
                                ItemTemplate="{StaticResource VerticalItemTemplate}"
                                MinimumHeightRequest="250"
                                AnimateScroll="True"
                                DisableScroll="False"
                                CollectionLayout="Vertical"
                                VerticalOptions="FillAndExpand"/>
        </StackLayout>
    </Border>
</Grid>

2. 优化ViewModel集合更新逻辑 #

删除冗余的OnPropertyChanged调用，依赖ObservableRangeCollection的原生通知：

private async Task FilterSelectedItems()
{
    var selectedItems = GroupedSelectionItems.SelectMany(groupedSelectionItem => groupedSelectionItem)
                                            .Where(selectionItem => selectionItem.IsSelected)
                                            .ToList();

    SelectedItems.Clear();
    SelectedItems.AddRange(selectedItems);

    // 移除这行冗余代码
    // OnPropertyChanged(nameof(SelectedItems));

    await Task.CompletedTask;
}

3. 修复HorizontalStackLayout绑定（备选） #

如果Count绑定仍无效，改用布尔属性绑定并确保触发PropertyChanged：

private bool _hasSelectedItems;
public bool HasSelectedItems
{
    get => _hasSelectedItems;
    set => SetProperty(ref _hasSelectedItems, value);
}

private async Task FilterSelectedItems()
{
    var selectedItems = GroupedSelectionItems.SelectMany(groupedSelectionItem => groupedSelectionItem)
                                            .Where(selectionItem => selectionItem.IsSelected)
                                            .ToList();

    SelectedItems.Clear();
    SelectedItems.AddRange(selectedItems);

    HasSelectedItems = SelectedItems.Count > 0;

    await Task.CompletedTask;
}

修改XAML绑定：

<HorizontalStackLayout Margin="0, 10, 0, -5" IsVisible="{Binding HasSelectedItems}">

4. 强制布局刷新（兜底方案） #

若以上方法无效，在集合更新后手动触发UI布局刷新：
在ViewModel中添加事件：

public event Action RequestLayoutRefresh;

private async Task FilterSelectedItems()
{
    var selectedItems = GroupedSelectionItems.SelectMany(groupedSelectionItem => groupedSelectionItem)
                                            .Where(selectionItem => selectionItem.IsSelected)
                                            .ToList();

    SelectedItems.Clear();
    SelectedItems.AddRange(selectedItems);
    HasSelectedItems = SelectedItems.Count > 0;

    RequestLayoutRefresh?.Invoke();

    await Task.CompletedTask;
}

在页面代码后台订阅：

protected override void OnAppearing()
{
    base.OnAppearing();
    if (BindingContext is CalculateViewModel vm)
    {
        vm.RequestLayoutRefresh += () => MainThread.BeginInvokeOnMainThread(() => ForceLayout());
    }
}

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