CollectionView is not scrolling without setting the height property

user_4406348 0
Viewed 859

In my .Net Maui project I'm using a CollectionView within a ControlTemplate. The implementation is looking like this:

<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>

I'm using this ContentView within a ContentPage. The Page contains 2 StackLayouts and it's implementation is looking like this:

 <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>

Only one of the StackLayouts is displayed when the Page is Appearing.

So, if I set the height of the second row to a fixed value or set the height of the CollectionView to a fixed value scrolling is working fine. But if I use a "*" or "Auto" for the height definition of the second row the CollectionView isn't scrolling anymore.

Please, can someone help me in this case? I also tried using ScrollViews, setting the VerticalOptions of the Stacklayouts or the Grid to "FillAndExpand" like it's described in MS documentation but nothing seems to work for me.

maui xamarin xaml .net
2 Answers

I think layout logic failed to realize the collectionview should scroll.

ATTEMPTED FIX #1

Try these 2 changes:

<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" />

TEST IF #1 DID NOT WORK

If the above did not help, then please do this test:

<controls:ObjectSearchControl
     IsVisible="True"

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

That is, as a test, force that control to be visible before InitializeComponent is called from the constructor. This should cause CollectionView to be properly marked as scrolling.

The results of this test are needed, to know what approach to take next.

ATTEMPTED FIX #2 TBD

If #1 did not help, then it is because when page is first laid out, the CollectionView was not marked as needing to scroll.

This can be caused either by the dynamic IsVisible property, or by layout occurring before DataSource had any contents.

Its a subtle bug in CollectionView, that has been seen in other circumstances.

TBD: Research earlier Q&As, to decide easiest way to fix.

user_1993640

By refactoring the layout I found a solution for my problem.

I replaced all the StackLayouts through Grids and add a ScrollView in my control. Seems the reason for my problem have been the complex layout.

user_44063480
Related