.net MAUI CollectionView 位于 ScrollView 中

Question

我在 ScrollView 中有一个 CollectionView，CollectionView 是页面上的最后一个控件。

我希望 CollectionView 只占用它需要的空间，并且没有自己的滚动条。 我是这样实现的：

 <ScrollView>
    <Grid x:Name="ContentContainer" Padding="0,10,0,20" RowDefinition="*,Auto">
    <!--  overview Frame  -->
            <Border HeightRequest="-1" Style="{StaticResource BorderContainerStyle}">
        Container with general information
    </Border>
    <Grid>
               <CollectionView ItemsSource="{Binding SubActivities}" MinimumHeightRequest="300">
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout
                            Orientation="Vertical"
                            Span="1"
                            VerticalItemSpacing="5" />
                    </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                        <DataTemplate x:DataType="activityDetail:SubActivityViewModel">
                            <StackLayout Spacing="5">
                                <Border IsVisible="{Binding ShowSubActivity}" Style="{StaticResource BorderContainerStyle}">
                                    <Border.GestureRecognizers>
                                        <TapGestureRecognizer
                                            Command="{Binding Path=ShowAttachments, Source={RelativeSource AncestorType={x:Type activityDetail:ActivityDetailViewModel}}}"
                                            CommandParameter="{Binding .}"
                                            NumberOfTapsRequired="2" />
                                    </Border.GestureRecognizers>
                                    <templates:DefectAttachmentTemplate BindingContext="{Binding}" />
                                </Border>
                                <CollectionView ItemsSource="{Binding VisibleAttachments}">
                                    <CollectionView.ItemsLayout>
                                        <GridItemsLayout
                                            Orientation="Vertical"
                                            Span="{Binding GridColumns}"
                                            VerticalItemSpacing="5" />
                                    </CollectionView.ItemsLayout>
                                    <CollectionView.ItemTemplate>
                                        <DataTemplate x:DataType="activityDetail:AttachmentViewModel">
                                            <Border Padding="0" Style="{StaticResource BorderContainerStyle}">
                                                <StackLayout>
                                                    <templates:ImageControlAttachmentTemplate BindingContext="{Binding}" />
                                                </StackLayout>
                                            </Border>
                                        </DataTemplate>
                                    </CollectionView.ItemTemplate>
                                </CollectionView>
                            </StackLayout>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
      </Grid>
    </Grid>

问题是，当我向 CollectionView 添加项目时，我可以在其中滚动，但无法使用外部滚动滚动到屏幕顶部。为此，我必须滚动到 CollectionView 之外，这不是一个好的用户体验。

我希望设备的滚动能够无缝工作，因此如果我位于 CollectionView 中的第一项，则外部滚动应该接管。

Answer 1

我明白为什么你试图将

CollectionView

放入

ScrollView

中。然而，通常应避免嵌入卷轴。

在您的情况下，您不需要 ScrollView。您可以专门使用集合视图。 然后，只需将集合视图顶部的所有内容作为标题即可。

<CollectionView ItemsSource="{Binding SubActivities}" MinimumHeightRequest="300">
    <CollectionView.Header>
        <Border HeightRequest="-1" Style="{StaticResource BorderContainerStyle}">
            Container with general information
        </Border>
    </CollectionView.Header>
    <CollectionView.ItemsLayout>
        <GridItemsLayout
            Orientation="Vertical"
            Span="1"
            VerticalItemSpacing="5" />
    </CollectionView.ItemsLayout>
    <CollectionView.ItemTemplate>
        <DataTemplate x:DataType="activityDetail:SubActivityViewModel">
            <StackLayout Spacing="5">
                <Border IsVisible="{Binding ShowSubActivity}" Style="{StaticResource BorderContainerStyle}">
                    <Border.GestureRecognizers>
                        <TapGestureRecognizer
                            Command="{Binding Path=ShowAttachments, Source={RelativeSource AncestorType={x:Type activityDetail:ActivityDetailViewModel}}}"
                            CommandParameter="{Binding .}"
                            NumberOfTapsRequired="2" />
                    </Border.GestureRecognizers>
                    <templates:DefectAttachmentTemplate BindingContext="{Binding}" />
                </Border>
                <CollectionView ItemsSource="{Binding VisibleAttachments}">
                    <CollectionView.ItemsLayout>
                        <GridItemsLayout
                            Orientation="Vertical"
                            Span="{Binding GridColumns}"
                            VerticalItemSpacing="5" />
                    </CollectionView.ItemsLayout>
                    <CollectionView.ItemTemplate>
                        <DataTemplate x:DataType="activityDetail:AttachmentViewModel">
                            <Border Padding="0" Style="{StaticResource BorderContainerStyle}">
                                <StackLayout>
                                    <templates:ImageControlAttachmentTemplate BindingContext="{Binding}" />
                                </StackLayout>
                            </Border>
                        </DataTemplate>
                    </CollectionView.ItemTemplate>
                </CollectionView>
            </StackLayout>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>