[canvaskit] Round physical size to nearest whole number pixels #52467
Conversation
|
It looks like this pull request may not have tests. Please make sure to add tests before merging. If you need an exemption to this rule, contact "@test-exemption-reviewer" in the #hackers channel in Chat (don't just cc them here, they won't see it! Use Discord!). If you are not sure if you need tests, consider this rule of thumb: the purpose of a test is to make sure someone doesn't accidentally revert the fix. Ask yourself, is there anything in your PR that you feel it is important we not accidentally revert back to how it was before your fix? Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing. |
| } | ||
|
|
||
| assert(isCloseToIntegerSize(frameSize), | ||
| 'Physical size is in fractional pixels.'); |
There was a problem hiding this comment.
This seems to be asserting a condition that's not under our control. view.physicalSize seems to be supplied by the browser. What does it mean for the assert not to pass? Would it indicate a bug in the web engine? Or a bug in the app code?
There was a problem hiding this comment.
view.physicalSize is the result of multiplying window.visualViewport.{width,height} by window.devicePixelRatio where window.visualViewport.{width,height} is the width and height of the screen in CSS pixels and window.devicePixelRatio is the ratio of CSS pixels to physical pixels.
I actually can't find anywhere that says the physical pixels must be a whole number. So I changed this to check if the computed physical size is very close to an integer, then just round it.
There was a problem hiding this comment.
Ok, a condition makes sense. I think you explained this to me in person but I forgot, why do we not want to use ceilToDouble()?
Another question, if the size of the frame changes due to rounding but the CSS size of the canvas stays the same, is there risk of reintroducing flutter/flutter#122541?
There was a problem hiding this comment.
The render canvas that we use to display the scene is sized to exactly the size of the window, and the bitmap we transfer into it from the OffscreenCanvas is stretched to fit inside the render canvas. To avoid issues like flutter/flutter#122541, we must ensure the size of the bitmap we put into the render canvas is exactly the same as the size of the canvas in physical pixels. Due to issues outlined in the PR comments, computing the physical size is inexact by a tiny amount, so neither floor() nor ceil() are appropriate to massage the computed physical size values to a whole number of pixels (because the computed physical size can be either slightly below or slightly above the actual physical size), which is why round() is used.
So, for example, if you used ceilToDouble() and the physicalSize you get from the FlutterView is 100.00001 x 100.00001, then you will create a bitmap that is 101 x 101 pixels, and when you transfer that to the render canvas which is sized exactly to be 100px x 100px, then you will get blurriness issues.
| 0, | ||
| _frameSize.width.toDouble(), | ||
| _frameSize.height.toDouble(), | ||
| )); |
There was a problem hiding this comment.
nit: this is some strange indenting. Maybe add a , between the two ))?
There was a problem hiding this comment.
done, but it didn't help much unfortunately :\
| /// the nearest integer. | ||
| BitmapSize.fromSize(ui.Size size) | ||
| : width = size.width.round(), | ||
| height = size.height.round(); |
There was a problem hiding this comment.
I'm still not 100% that round() is the right choice. If it rounds down, we may see a blank line of pixels in some cases. However, it's worth a shot as an initial attempt (and I'm not clear on the exact situations that could trigger the bad case). The good news is that all the rounding logic is in one place now, so we can adjust it later easily, if need be.
…147759) flutter/engine@fc71b65...c380e9f 2024-05-03 [email protected] Roll Dart SDK from 0316fa44b401 to 03b7868a71ae (1 revision) (flutter/engine#52534) 2024-05-02 [email protected] Roll Skia from 716e757c1ffb to df970dcd6cfa (1 revision) (flutter/engine#52533) 2024-05-02 [email protected] [canvaskit] Round physical size to nearest whole number pixels (flutter/engine#52467) 2024-05-02 [email protected] Updated RBE documentation for default credentials. (flutter/engine#52530) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-engine-flutter-autoroll Please CC [email protected],[email protected],[email protected] on the revert to ensure that a human is aware of the problem. To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md
3 participants
The physical size is computed by multiplying the browser's
innerWidthandinnerHeightby thedevicePixelRatio. The physical size should be an integer number of pixels. However, there may be some imprecision and the result of the multiplication is not quite an integer. This change rounds the physical size to integers before using them for drawing the scene.Fixes flutter/flutter#144869
Pre-launch Checklist
///).If you need help, consider asking for advice on the #hackers-new channel on Discord.