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

Implements anti-aliased lines #164734

Open
wants to merge 32 commits into
base: master
Choose a base branch
from
Open

Conversation

gaaclarke
Copy link
Member

@gaaclarke gaaclarke commented Mar 6, 2025

issue: #138682
design doc: https://docs.google.com/document/d/19I6ToHCMlSgSava-niFWzMLGJEAd-rYiBQEGOMu8IJg/edit?tab=t.0

This puts an experimental line drawing approach behind the following flags:

  • iOS: FLTAntialiasLines boolean, default NO
  • Android: io.flutter.embedding.android.ImpellerAntialiasLines boolean, default false

Right now they just support DrawLines and don't support line caps.

A test was added that works as a playground for vulkan, opengles and metal. Only the Metal version was turned into a golden test though here.

Pre-launch Checklist

If you need help, consider asking for advice on the #hackers-new channel on Discord.

@github-actions github-actions bot added engine flutter/engine repository. See also e: labels. e: impeller Impeller rendering backend issues and features requests labels Mar 6, 2025
@github-actions github-actions bot added a: text input Entering text in a text field or keyboard related problems platform-android Android applications specifically platform-ios iOS applications specifically team-ios Owned by iOS platform team labels Mar 20, 2025
@gaaclarke gaaclarke marked this pull request as ready for review March 21, 2025 17:55
@gaaclarke gaaclarke requested a review from jonahwilliams March 21, 2025 17:55
@gaaclarke
Copy link
Member Author

The merge conflicts will be resolved once #165622 lands.

@@ -329,6 +329,7 @@ ContentContext::ContentContext(
solid_fill_pipelines_.CreateDefault(*context_, options);
texture_pipelines_.CreateDefault(*context_, options);
fast_gradient_pipelines_.CreateDefault(*context_, options);
line_pipelines_.CreateDefault(*context_, options);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could put this behind the flag context.GetFlags().antialias_lines.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

its probably ok as is

Comment on lines 19 to 22
auto data_mapping = std::make_shared<fml::DataMapping>(data);
std::shared_ptr<DeviceBuffer> buffer =
context->GetResourceAllocator()->CreateBufferWithCopy(*data_mapping);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suspect this is doing a double copy of the texture data. I didn't change it though since it was already like this.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we always have to copy host visible data into a staging buffer, unless we allocate the buffer first and write it in there. Its OK for now

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had a linter in this so I took the opportunity to switch it to a single copy by using NonOwningMapping. We were copying to the mapping then copying to the device buffer, now we are just copying to the device buffer.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ahh good catch

Copy link
Member

@jonahwilliams jonahwilliams left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall approach LGTM

ignoring caps/joins, do you see a path to refactoring the stroke geometry generator so we can use AA lines there too?

@gaaclarke
Copy link
Member Author

ignoring caps/joins, do you see a path to refactoring the stroke geometry generator so we can use AA lines there too?

I haven't created solid plans yet since it's moot if we can't get something that looks good. For solid colors the order of operations of the path don't matter so my thought it so split out lines from the rest of the path and use the new line shaders for the straight lines.

Path path;
path.DrawBezier()
path.DrawLine()
path.DrawCircle()
path.DrawLine()

Can be transformed to:

Path path;
path.DrawBezier()
path.DrawCircle()
path.DrawLine()
path.DrawLine()

@jonahwilliams
Copy link
Member

Could work! Or we could detect straight line only bezier paths.. or something like that

We should definitely only try to do AA lines for solid colors. No worry about gradients or things like that.

@gaaclarke
Copy link
Member Author

@jonahwilliams this is landing with radius 0.5 which looked good in the playgrounds. On device the radius 1 looks better. The lines are brighter, but they aren't any wider because of MSAA. It also looks like I have blending wrong with the new line.

regular

IMG_7558

antialias w/ 1.0 radius

IMG_7557

@gaaclarke
Copy link
Member Author

Here's radius 2.0. This looks good but in this case sometimes the lines are 3 pixels tall instead of 2 in the old case.

IMG_7559

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a: text input Entering text in a text field or keyboard related problems e: impeller Impeller rendering backend issues and features requests engine flutter/engine repository. See also e: labels. platform-android Android applications specifically platform-ios iOS applications specifically team-ios Owned by iOS platform team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants