fix(crop-rotate): cover image edge with crop overlay when panned (#776)#838
Merged
Conversation
The darkened crop overlay is painted on top of the image and its outer rectangle was mathematically identical to the rendered image bounds. When the image is panned so an edge floats inside the viewport (e.g. pushed to the bottom), anti-aliasing along that shared edge left a ~1px partially-transparent seam that revealed a thin line of the image. Overscan the outer overlay rectangle by a small screen-space margin so its edge lands just outside the image, moving the seam onto the surrounding background where it is invisible. The margin is converted into the painter's local space via rotationScaleFactor so it stays visually constant across zoom levels.
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.
Fixes #776
Problem
In the
CropRotateEditor, when the image is panned so one of its edges floats inside the viewport (e.g. the image pushed to the bottom, bringing its top edge into view), a thin line of the image was visible at that edge even withcropOverlayOpacity: 1.Root cause
The darkened crop overlay is painted on top of the image, and its outer rectangle was computed to be mathematically identical to the rendered image bounds (verified numerically — the edges match to within ~1e-13). Because the overlay's edge coincides exactly with the image's edge, anti-aliasing along that shared boundary leaves a ~1px partially-transparent seam (alpha ≈ 128 instead of 255), revealing the image underneath. At the viewport's own edges the seam is clipped away, which is why it only appeared on the panned-in edge.
Fix
Overscan the outer overlay rectangle by a small screen-space margin (
1logical px) so its edge lands just outside the image, on the surrounding background where the seam is invisible. The margin is divided byrotationScaleFactorto convert it from screen space into the painter's local space, keeping it visually constant across zoom levels — mirroring how the corner-thickness code already scales itself. The subtracted crop hole is untouched, so the crop area is unaffected.Test
Added a regression test that rasterizes the overlay with a fractional pan offset and asserts the image's top-edge row is fully opaque. It fails before the fix (alpha = 128) and passes after (255).