Skip to content

gpui: Fix rounded corners on images with object-fit cover - #59300

Closed
J0R6IT0 wants to merge 3 commits into
zed-industries:mainfrom
J0R6IT0:fix/object-fit-cover
Closed

gpui: Fix rounded corners on images with object-fit cover#59300
J0R6IT0 wants to merge 3 commits into
zed-industries:mainfrom
J0R6IT0:fix/object-fit-cover

Conversation

@J0R6IT0

@J0R6IT0 J0R6IT0 commented Jun 14, 2026

Copy link
Copy Markdown

Objective

rounded did not work properly on images using ObjectFit::Cover. The image is scaled to be larger than the element so it can cover the bounds, and the overflow was clipped to a plain rectangle, so the rounded corners were applied to the oversized image quad, outside the visible element box. FIxes #44339.

Solution

PolychromeSprite now carries a clip_bounds field in addition to bounds, that shaders use to round and clip.
Done in all three renderers.

Testing

  • Tested in both Windows and MacOS. I have not been able to test in LInux but it should work too since the changes are minimal.
  • Added the object_fit example to showcase the different ObjectFit options and aspect ratios.

Self-Review Checklist:

  • I've reviewed my own diff for quality, security, and reliability
  • Performance impact has been considered and is acceptable

Showcase

BEFORE:
Screenshot 2026-06-14 at 16 37 43

AFTER:
Screenshot 2026-06-14 at 16 36 30


Release Notes:

  • N/A

@cla-bot cla-bot Bot added the cla-signed The user has signed the Contributor License Agreement label Jun 14, 2026
@zed-community-bot zed-community-bot Bot added the first contribution the author's first pull request to Zed. NOTE: the label application is automated via github actions label Jun 14, 2026
@MrSubidubi MrSubidubi changed the title gpui: Fix rounded corners on images with object-fit cover. gpui: Fix rounded corners on images with object-fit cover Jun 14, 2026
@MrSubidubi MrSubidubi added the area:gpui GPUI rendering framework support label Jun 15, 2026
@pingpong74

Copy link
Copy Markdown
Contributor

Hi, I have been looking into this issue and from what I can understand, a much simpler way of doing this is to just crop the image CPU side before passing it to the renderer. This seems to be a simpler fix it only affects one function ( paint_image in window.rs). Here are my tests using this method:

image

@J0R6IT0

J0R6IT0 commented Jul 21, 2026

Copy link
Copy Markdown
Author

Hi, looks good to me too. Each implementation has its advantages, so the Zed team will have to choose the one they prefer.

@J0R6IT0

J0R6IT0 commented Jul 25, 2026

Copy link
Copy Markdown
Author

#61383

@J0R6IT0 J0R6IT0 closed this Jul 25, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:gpui GPUI rendering framework support cla-signed The user has signed the Contributor License Agreement first contribution the author's first pull request to Zed. NOTE: the label application is automated via github actions

Projects

None yet

Development

Successfully merging this pull request may close these issues.

gpui: rounded corners with images that are set ObjectFit::Cover not working

3 participants