dotnet / dotnet/maui

Investigate options for full-size Image loading on Android

Open
#8,217 3 comments 1 reaction 0 assignees View on GitHub
area-controls-image Task
Dominant language
C#
Stars
23.3k
Forks
2k
Avg merge
1d 15h
Merged PRs (30d)
290

Description

FlexLayout is not entirely compatible with Glide on Android. The Forms layout engine would, by default, load images at their full size and then scale them. It did this by loading them with no size constraints. Some of the FlexLayout behaviors (notably the sample in the docs at https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/flex-layout#using-flexlayout-for-wrapping-items) relied on this - the (small) images simply loaded at their default size and those dimensions were used to calculate the flex dimensions.

With MAUI.Controls on Windows, this still works. But Android now uses Glide to handle all image loading. And the current Glide loading implementations in `PlatformInterop` use the default behavior, which never loads the image at its intrinsic size. Rather, it treats those requests as a request to load the image at the device screen dimensions:

> [CustomViewTarget] Glide treats LayoutParams.WRAP_CONTENT as a request for an image the size of this device's screen dimensions. If you want to load the original image and are ok with the corresponding memory cost and OOMs (depending on the input size), use .override(Target.SIZE_ORIGINAL). Otherwise, use LayoutParams.MATCH_PARENT, set layout_width and layout_height to fixed dimension, or use .override() with fixed dimensions.

Which breaks the FlexLayout behavior. It does this even if the original image size is smaller than the screen dimensions; small images get scaled up. So instead of the linked example code producing wrapped rows of small images, it produces one screen-wide image per row no matter what size the original images were.

The FlexLayout problems can be mostly worked around by setting explicit widths or heights on the image. But as things stand, the old samples will not work on Android, and Android currently has _no_ way for the user to load a remote image at the full dimensions.

We'll need to evaluate what the best option for loading an image at fill size would be. Making it the default (and adding mappings as in https://github.com/dotnet/maui/issues/8212 to make it easy to improve efficiency) is probably the easiest option from an implementation standpoint. But we may also want to consider adding an "IntrinsicSize" or "FullSize" option to the Aspect property, and simply update the FlexLayout documentation/samples.

Contributor guide

Open the contributing guide

Research direction

Review the Android image-loading implementations in PlatformInterop and the FlexLayout wrapping sample linked in the issue. Compare the proposed full-size loading and Aspect options, including the efficiency mappings discussed in issue 8212. Done means selecting and documenting an approach that restores intrinsic-size image behavior without leaving the Android path undefined.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, csharp
Domain
frontend, mobile-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.