.net CollectionView在未设置height属性的情况下不滚动

tvmytwxo  于 2023-03-31  发布在  .NET
关注(0)|答案(3)|浏览(107)

在我的.Net Maui项目中,我在ControlTemplate中使用CollectionView。实现如下所示:

<ContentView.ControlTemplate>
    <ControlTemplate>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="50" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <SearchBar
                x:Name="ObjectSearchBar"
                Grid.Row="0"
                IsSpellCheckEnabled="False"
                Keyboard="Text"
                Placeholder="{TemplateBinding SearchBarPlaceholderText}"
                TextChanged="ObjectSearchBar_TextChanged" />

            <CollectionView
                x:Name="ObjectResultView"
                Grid.Row="1"
                Margin="10,10,10,10"
                ItemSizingStrategy="MeasureAllItems"
                ItemTemplate="{StaticResource templateSelector}"
                ItemsLayout="VerticalList"
                ItemsSource="{TemplateBinding DataSource}"
                SelectionChanged="ObjectResultView_SelectionChanged"
                SelectionMode="Single">
            </CollectionView>
        </Grid>
    </ControlTemplate>
<ContentView.ControlTemplate>

我在ContentPage中使用这个ContentView。该页面包含2个StackLayouts,它的实现看起来像这样:

<ContentPage.Content>
    <Grid>
        <StackLayout
            HorizontalOptions="FillAndExpand"
            IsVisible="{Binding AddNewSectionIsVisible, Converter {converter:InvertedBoolConverter}}"
            Orientation="Vertical"
            VerticalOptions="FillAndExpand">
            <controls:ObjectSearchControl
                DataSource="{Binding DataSource}"
                FilterChangedCommand="{Binding FilterChangedCommand}"
                HorizontalOptions="FillAndExpand"
                ObjectSelectedCommand="{Binding SelectedCommand}"
                SearchBarPlaceholderText="ABC"
                VerticalOptions="FillAndExpand" />
        </StackLayout>

        <StackLayout
            HorizontalOptions="FillAndExpand"
            IsVisible="{Binding AddNewSectionIsVisible}"
            Orientation="Vertical"
            Style="{StaticResource rootStackLayout}"
            VerticalOptions="Center">
            
            ....

        </StackLayout>

    </Grid>
</ContentPage.Content>

当页面出现时,仅显示其中一个StackLayouts。
因此,如果我将第二行的高度设置为固定值,或者将CollectionView的高度设置为固定值,滚动工作正常。但是如果我使用“*”或“Auto”作为第二行的高度定义,CollectionView不再滚动。
我也试过使用ScrollViews,将Stacklayouts或Grid的VerticalOptions设置为“FillAndExpand”,就像MS文档中描述的那样,但似乎对我没有任何作用。

lmyy7pcs

lmyy7pcs1#

通过重构布局,我找到了解决问题的方法。
我替换了所有的StackLayoutsGrids,并在我的控件中添加了一个ScrollView。似乎我的问题的原因是复杂的布局。

icomxhvb

icomxhvb2#

我认为布局逻辑未能实现collectionview应该滚动。

尝试修复#1

试试这两个变化:

<ContentPage.Content>
    <!-- 1) "*": make sure row 0 takes all vertical space. -->
    <Grid RowDefinitions="*">
    
        <!-- 2) remove the surrounding StackLayout, to simplify layout logic. -->
        <controls:ObjectSearchControl
            IsVisible="{Binding AddNewSectionIsVisible, Converter {converter:InvertedBoolConverter}}"
            DataSource="{Binding DataSource}"
            FilterChangedCommand="{Binding FilterChangedCommand}"
            HorizontalOptions="FillAndExpand"
            ObjectSelectedCommand="{Binding SelectedCommand}"
            SearchBarPlaceholderText="ABC"
            VerticalOptions="FillAndExpand" />

如果#1不工作,则进行测试

如果上面的没有帮助,那么请做这个测试:

<controls:ObjectSearchControl
     IsVisible="True"

... and set the other stacklayout to `IsVisible="False"`.

也就是说,作为测试,在从构造函数调用InitializeComponent之前强制该控件可见。这应该会导致CollectionView被正确地标记为滚动。
需要这个测试的结果,以知道下一步采取什么方法。

尝试修复#2待定

如果#1没有帮助,那么这是因为当页面第一次布局时,CollectionView没有被标记为需要滚动。
这可能是由动态IsVisible属性或在DataSource有任何内容之前发生的布局引起的。
这是CollectionView中的一个微妙的错误,在其他情况下也可以看到。
TBD:研究早期的Q& A,以确定最简单的修复方法。

ymzxtsji

ymzxtsji3#

所有最新的Maui库(8.0.0-preview.2)在2023年3月29日出现了相同的问题。
帮助我修复滚动的是将VerticalOptions设置为FillAndExpand
选项Fill不起作用

<CollectionView ItemsSource="{Binding .}"
            VerticalOptions="FillAndExpand">
</CollectionView>

相关问题