Keep grid item badges and labels attached to the cell - #17540
Open
sandbranch wants to merge 1 commit into
Open
Conversation
In grid view the file feature badges (shared, favorite, video, live
photo, synced) were positioned against the whole grid cell rather than
against the thumbnail image.
The thumbnail is a 1:1 SquareImageView whose resolved size is bounded by
the cell height, so when a cell is wider than it is tall the drawn image
is narrower than the cell. Because the badge cluster used
layout_constraintStart_toStartOf="parent"
layout_constraintEnd_toEndOf="parent"
layout_constraintHorizontal_bias="0.85"
the 0.85 bias was applied across the full cell width instead of across
the image, which pushed the badges into the empty space to the right of
the thumbnail. Anchor them to the thumbnail so they stay on the image at
any cell width.
The file name had the matching problem from the other direction: it was
given 75% of the cell and centred, with the overflow button placed in
the leftover gap, so on a wide cell the button drifted away from the
label it belongs to. Let the name take the width the overflow button
does not need, which both keeps the two together and leaves more room
for the name itself.
This is only noticeable when cells are wide, which is why it shows up on
tablets and in landscape on phones while looking correct in portrait on
a phone, where the cell width is close to the image width.
Signed-off-by: David Sandquist <sandquist@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
In grid view the file feature badges (shared, favorite, video, live photo, synced) drift away from the thumbnail as the cell gets wider, and the overflow button drifts away from the file name it belongs to.
The thumbnail is a 1:1
SquareImageViewwhose resolved size is bounded by the cell height, so when a cell is wider than it is tall the drawn image is narrower than the cell. The badge cluster was positioned against the cell:so the 0.85 bias applied across the full cell width rather than across the image, pushing the badges into the empty space to the right of the thumbnail.
The file name had the matching problem from the other side: it was given 75% of the cell and centred, with the overflow button placed in the leftover gap, so on a wide cell the button drifted away from the label.
This is only visible when cells are wide, which is why it shows on tablets and in landscape on phones while looking correct in portrait on a phone, where the cell width is close to the image width.
Fix
Anchor the badge cluster to the thumbnail so it stays on the image at any cell width, and let the file name take the width the overflow button does not need, which keeps the two together and leaves more room for the name.
Only
grid_item.xmlchanges; no behaviour or code changes.Testing
Checked on a Samsung S23 and a Lenovo Tab P11 Pro (2nd gen), portrait and landscape, light and dark.