[Bug] Image in ScrollView causes content to truncate at end on Android

[IMLizKing]

Description

I find that if I put an Image into a stacklayout contained in a scrollview (within a ContentPage) that the bottom of the scrollview content will be truncated and only show the background color of the scrollview in the space that should display the content. Not co-incidentally, the amount of blank space equals the height of the rendered image. And if you request a height for the image (ala HeightRequest) the problem goes away.

Steps to Reproduce

1. Start with a new Mobile App (Xamarin.Forms) project, using the Blank template, targeting Android
2. Make sure it builds (this isn't always the case)
3. Wrap the MainPage in a ScrollView and add enough content to make it scroll vertically
4. Add some sort of image to the content as well (e.g.
5. Run on Android (things seem fine on iOS and UWP) and notice the bottom of the scrollview content being blank

Expected Behavior

Seeing all the content contained within the ScrollView.

Actual Behavior

On Android, the content is truncated but the appropriate amount of space is still there.

Basic Information

• Version with issue: 5.0.0
• Last known good version: Unknown
• Platform Target Frameworks:
  • Android: 5.1

Environment

Using latest VS 2019 with stable Xamarin 5.0

Build Logs

Not a build problem..

Screenshots

Top without image:

Scrolled down (no image:

Top with image:

Scrolled down with image:

Reproduction Link

Here's a github repository with the base VS 2019 project with the the main XAML modified to demonstrate the bug.

Workaround

Specify a height (via HeightRequest) and things work properly, but the Image size doesn't expand to the fill the space unless you get the height exactly right (and the native image height varies per platform).

[PureWeen]

@IMLizKing can you attach a reproduction please? I'm not seeing what you're seeing by following your steps here

[IMLizKing]

Thanks for taking a look. I just made a github repository to demonstrate the bug and verified that it still fails for me on both my Pixel 4 (Android 11) and a Pixel 2 simulator running Android 10. Make sure you scroll down to see that the content is chopped off.

I will also note that if the image can load before the layout (or re-layout) is complete, so I've seen it fix itself when something else causes a re-layout. For example if I change the phone from dark to light mode (or vice versa) it reveals the truncated content (although this app doesn't handle the dark/light theme change properly). To me, this indicates that it's the time between initial layout and the actually loading of the image asynchronously that causes this issue.

[diegoserpa]

Same issue here. This happens when the ScrollView is the root element of the page. A workaround for this is wrap the ScrollView in a StackLayout, as seen #13307 and #12978.
The problem does not occur before v5.0.

[FirasAbdennadher]

Try to add stacklayout before scrollview