ScrollView Does Not Resize for New Elements

[TonyLugg]

Description

I'm having an issue with Android. I have data templates loaded with a template selector for carouselview. If I have a ScrollView containing a VerticalStackLayout full of elements with some having bound IsVisible, making the elements visible after the fact does not display them. It seems the ScrollView does not acknowledge the change in size of the stack layout. If I remove the ScrollView everything works fine. Also, if I scroll the carousel a few pages, then back they will show up (assume it reloads the template). This is a port from Xamarin Forms which worked as expected.

<DataTemplate x:Key="VehicleTemplate">
            <ScrollView>
                <VerticalStackLayout Padding="10,10,10,300">
                    <Label Text="{x:Static translate:AppResources.MyVehicleButton}" Style="{StaticResource Title}" />
                    <Button x:Name="btnAddVehicle" Text="{x:Static translate:AppResources.AddVehicleButton}" Style="{StaticResource ActionButton}" Margin="0,10" 
                            IsVisible="{Binding AddButtonIsVisible}" Clicked="btnAddVehicle_Clicked" />
                    <Button x:Name="btnSelectSavedVehicle" Text="{x:Static translate:AppResources.SelectPreviouslyUsedVehicleButton}" Style="{StaticResource ActionButton}" Margin="0,0,0,10" 
                            IsVisible="{Binding SelectButtonIsVisible}" Clicked="btnSelectSavedVehicle_Clicked" />
                    <Grid Margin="0,10">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <Label Text="{x:Static translate:AppResources.VehicleAlwaysSameForJourneysLabel}" VerticalOptions="Center" LineBreakMode="WordWrap" />
                        <Switch IsToggled="{Binding WillAlwaysHaveSameVehicle, Mode=TwoWay}" OnColor="Blue" ThumbColor="LightBlue" Margin="5" Grid.Column="1"/>
                    </Grid>
                    <Label Text="{x:Static translate:AppResources.VehicleOwnerLabel}" Margin="0,10,0,0" />
                    <Picker x:Name="ddnVehicleOwner" SelectedIndexChanged="ddnVehicleOwner_SelectedIndexChanged"
                            ItemsSource="{Binding VehicleOwners}" SelectedItem="{Binding Vehicle.VehicleOwner, Mode=TwoWay}">
                    </Picker>
                    <Label x:Name="lblVehicleUnitID" Text="{x:Static translate:AppResources.VehicleUnitIdLabel}" IsVisible="{Binding UnitIdIsVisible}" />
                    <Entry x:Name="txtVehicleUnitID" Text="{Binding Vehicle.vehicle_unit_id, Mode=TwoWay}" IsVisible="{Binding UnitIdIsVisible}" 
                           IsSpellCheckEnabled="False" IsTextPredictionEnabled="False" Margin="0" 
                           TextChanged="txtVehicleUnitID_TextChanged"
                           Unfocused="txtVehicleUnitID_Unfocused" />
                    <Button x:Name="btnDownloadVehicle" Text="{x:Static translate:AppResources.DownloadDetailsFromServerButton}" 
                            BackgroundColor="LightGreen" TextColor="DarkGreen" Margin="0,0,0,20"
                            Clicked="btnDownloadVehicle_Clicked" IsVisible="{Binding DownloadButtonIsVisible}" />
                    <Label x:Name="lblAvlSystem" Text="{x:Static translate:AppResources.VehicleAvlSystemLabel}" IsVisible="{Binding AvlSystemIsVisible}"/>
                    <Entry x:Name="txtAvlSystem" Text="{Binding Vehicle.avl_system, Mode=TwoWay}" IsVisible="{Binding AvlSystemIsVisible}" Keyboard="Text" IsEnabled="False" />
                    <Label Text="{x:Static translate:AppResources.VehicleColorLabel}"/>
                    <Entry x:Name="txtVehicleColor" Text="{Binding Vehicle.vehicle_color, Mode=TwoWay}" Keyboard="Text" />
                    <Label Text="{x:Static translate:AppResources.VehicleYearLabel}"/>
                    <Entry x:Name="txtVehicleYear" Text="{Binding Vehicle.vehicle_year, Converter={StaticResource NullableIntConverter}, Mode=TwoWay}" Keyboard="Numeric" />
                    <Label Text="{x:Static translate:AppResources.VehicleMakeLabel}"/>
                    <Entry x:Name="txtVehicleMake" Text="{Binding Vehicle.vehicle_make, Mode=TwoWay}" Keyboard="Text" />
                    <Label Text="{x:Static translate:AppResources.VehicleModelLabel}"/>
                    <Entry x:Name="txtVehicleModel" Text="{Binding Vehicle.vehicle_model, Mode=TwoWay}" Keyboard="Text" />
                    <Label Text="{x:Static translate:AppResources.VehicleLicensePlateLabel}"/>
                    <Entry x:Name="txtVehicleLicensePlate" Text="{Binding Vehicle.vehicle_license_plate, Mode=TwoWay}" IsSpellCheckEnabled="False" IsTextPredictionEnabled="False" />
                    <Button x:Name="btnDeleteVehicle" Text="{x:Static translate:AppResources.DeleteVehicleButton}" Margin="0,30,0,20" BackgroundColor="Red" TextColor="White" 
                            IsVisible="{Binding DeleteButtonIsVisible}" Clicked="btnDeleteVehicle_Clicked" />
                </VerticalStackLayout>
            </ScrollView>
        </DataTemplate>

9078 was similar

Steps to Reproduce

Per the description above.

Link to public reproduction project repository

None

Version with bug

7.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

Android SDK 33

Did you find any workaround?

Removing the ScrollView fixes it. Going back to Xamarin Forms fixes it. Content is too long to remove the scrolling.

Relevant log output

None

[ghost]

Hi @TonyLugg. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

[TonyLugg]

Sorry, I don't have time currently. I will redesign without the CarouselView.

[ghost]

Hi @TonyLugg. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

[rachelkang]

Hi, @TonyLugg - We would really appreciate a repro when you get a chance, so that we can investigate this issue properly as it peratins to your scenario and all your custom code. Thanks for understanding! https://github.com/dotnet/maui/blob/main/.github/repro.md#but-i-dont-have-time-for-this

[TonyLugg]

I understand the importance of repros and I've submitted them in the past. This one would require a significant amount of time to create, and we've decided to re-engineer without the dynamic data templates and carousel view. I'm sorry but I'm not wanting to pursue this further at this time. Thank you for your understanding.

[codeaphex]

@jsuarezruiz @rachelkang @TonyLugg I have the same problem and managed to create a repro
https://github.com/codeaphex/ScrollViewRepro-14326

I first tried to get a repro by copying the layout with the scrollview into a page, but didnt get it to fail. Then I did the reverse and stripped down my whole project until I think I found the root problem. In my opinion it seems to be related to the scrollview being in nested views, havent checked all edge cases yet though.

The gif has some flickering at the start, dont know why. But if you follow closely you wont see "Peek-a-boo" while switching the IsVisible property right at the start. Then I change the RowDefintion height inside Visual Studio and let it HotReload, you see the height of the buttons changing. This probably causes the view to re-render the view, from this point on the "Peek-a-boo"'s Visibility is changed correctly. I also have some other bugs which seem to be related to that, like custom controls which recalcualte sizes based on items count, and only getting rendered correctly after getting the view to re-render.

Edit: Just noticed that it's working without issues on Windows.

[codeaphex]

@rachelkang Does this help or should I create a new issue for this bug/repro?

[jinxinjuan]

Verified this issue with Visual Studio Enterprise 17.7.0 Preview 4.0(net8). Can repro on Android platform with sample project. ScrollViewRepro-14326