Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix UI border artifacts caused by incorrect blending #12725

Merged
merged 2 commits into from May 15, 2024

Conversation

floppyhammer
Copy link
Contributor

Fixes #12702.

@chompaa
Copy link
Contributor

chompaa commented Mar 26, 2024

I'm not sure if this fix works, take the button example with a black background:

Before (main)
After (this PR)

I don't think these artifacts are desired.

@ItsDoot ItsDoot added C-Bug An unexpected or incorrect behavior A-Rendering Drawing game state to the screen A-UI Graphical user interfaces, styles, layouts, and widgets labels Mar 26, 2024
@asafigan
Copy link
Contributor

This solves my artifacts.

before Screenshot 2024-03-25 at 15 17 53
after Screenshot 2024-03-27 at 9 11 09

@floppyhammer
Copy link
Contributor Author

floppyhammer commented Mar 27, 2024

I'm not sure if this fix works, take the button example with a black background:

Before (main)
After (this PR)
I don't think these artifacts are desired.

These artifacts are actually from the underlaying button image:

Before before
After after

This PR only makes them more obvious. I believe this is another issue we need to deal with (which may need a separate PR). I'll take a look.

@floppyhammer
Copy link
Contributor Author

The artifacts brought up by @chompaa are due to how we draw borders. Given a rect, we extend the rect edge inwards to make the border, which has the exact same external edge as the rect (which we use to draw UiImage). We will have blending issue between the border and the UiImage background near these anti-aliased edges.

A possible solution to this is not to draw the UiImage in the full rect but in a smaller rect (which depends on the border width). This may require some changes to the prepare_uinodes function.

Anyways, this is a separate issue. And, with some further tests, this PR is good to go.

@JMS55 JMS55 added this to the 0.14 milestone Mar 30, 2024
@asafigan
Copy link
Contributor

Is there anything I can do to move this along? Like working on tests?

@floppyhammer
Copy link
Contributor Author

@asafigan I'm not sure. We may need to run all the UI related examples to make sure this isn't causing other issues.

@JMS55 JMS55 requested a review from alice-i-cecile May 15, 2024 18:44
@alice-i-cecile alice-i-cecile added this pull request to the merge queue May 15, 2024
@alice-i-cecile alice-i-cecile added the S-Ready-For-Final-Review This PR has been approved by the community. It's ready for a maintainer to consider merging it label May 15, 2024
Merged via the queue into bevyengine:main with commit 8da4fcb May 15, 2024
28 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
A-Rendering Drawing game state to the screen A-UI Graphical user interfaces, styles, layouts, and widgets C-Bug An unexpected or incorrect behavior S-Ready-For-Final-Review This PR has been approved by the community. It's ready for a maintainer to consider merging it
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

UI Borders leave artifacts
7 participants