Refresh tabs have gaps at HiDPI |
||
Issue descriptionAt 150% scaling there are some 1 pixel gaps between tabs, screenshot attached. Obviously if the background color is the same as the inactive tab color you can't tell, so you need to enable "Show color on title bar" in Settings>Personalization>Colors too.
,
May 17 2018
Reproducing this, not every pair of tabs have a gap. If the vertical edge of the tab lands between pixel boundaries, antialiasing could leak the background color slightly. For non integral scales, this can happen very easily.
,
May 17 2018
Here I see the gap between the tab in the middle and the one on the right, but not between the one on the left and the middle one. This is at a forced scale factor of 1.5x. Just looking at the arcs between the tabs along the top, you can see how one is blending better in the valley between the two. Other than forcing the left or right tab edge to land on a pixel boundary, I'm not sure how to fix this.
,
May 17 2018
Here's my proposed fix to how the Tab path computation functions need to change to get drawing here correct.
Assuming tabstrip starts on an integral pixel (if not, need to guarantee this some other way):
* Get Tab bounds() (e.g. pass in the bounds() instead of the current size)
* Convert to layout bounds
* Scale both true and layout bounds up by scale factor to convert DIPs to px
* Snap horizontal edges of layout bounds to integral pixels
* Compute scaled outer curve radii
* Clamp (snapped layout bounds + scaled outer curves) to (scaled true bounds)
* Offset everything by -origin of scaled true bounds to convert back to local coordinates (can be done before or after drawing path, just depends how you want to write the code)
One way that might make this easier to implement is to ensure all the path segment additions use relative positioning instead of absolute; then there's no need to stick "left" and "top" variables in everywhere. ("right" and "bottom" in this case would need to be "width" and "height".)
,
May 18 2018
Here's what it looks like with the tab verticals aligned on a pixel boundary. The gap is clearly gone. However it now clips the separator in some instances. That will also need to be pixel aligned in the same way. Because Dips. Ugh.
,
May 22 2018
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1 commit 421ddf960bc3ffedbe02c0d8bffe03825aa66fd1 Author: Allen Bauer <kylixrd@chromium.org> Date: Tue May 22 17:47:22 2018 Material Refresh - Align tab edges on pixel boundaries. Refactor path generation functions. Bug: 841532 Change-Id: I313a4efc4aaaa04cf75556db5b705284f3cc66ef Reviewed-on: https://chromium-review.googlesource.com/1067439 Commit-Queue: Allen Bauer <kylixrd@chromium.org> Reviewed-by: Peter Kasting <pkasting@chromium.org> Cr-Commit-Position: refs/heads/master@{#560691} [modify] https://crrev.com/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1/chrome/browser/ui/views/tabs/tab.cc [modify] https://crrev.com/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1/chrome/browser/ui/views/tabs/tab_controller.h [modify] https://crrev.com/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1/chrome/browser/ui/views/tabs/tab_strip.cc [modify] https://crrev.com/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1/chrome/browser/ui/views/tabs/tab_strip.h [modify] https://crrev.com/421ddf960bc3ffedbe02c0d8bffe03825aa66fd1/chrome/browser/ui/views/tabs/tab_unittest.cc
,
May 22 2018
|
||
►
Sign in to add a comment |
||
Comment 1 by kylixrd@chromium.org
, May 10 2018