SOLVED

DPI scaling bug

%3CLINGO-SUB%20id%3D%22lingo-sub-1087165%22%20slang%3D%22en-US%22%3EDPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087165%22%20slang%3D%22en-US%22%3E%3CP%3EI%20have%20been%20using%20Microsoft%20Edge%20Canary%20since%20the%20first%20build%20on%20my%20PC%20with%20FullHD%20screen%20and%20125%25%20system%20scale%20factor%2C%20and%20during%20this%20time%20there%20is%20present%20annoying%20DPI%20scaling%20bug%2C%20which%20then%20moved%20to%20Chromium-based%20browsers%20too.%20I%20could%20%22fix%22%20it%20by%20enabling%20%22Enable%20pixel%20canvas%20recording%22%20flag%2C%20but%20it%20was%20disappeared%20in%20Edge%20(and%20Chrome)%2079.%3C%2FP%3E%3CP%3EThe%20problem%20is%20the%20twitching%20user%20interface.%20When%20you%20hover%20buttons%2C%20e.g.%20home%20button%2C%20it%20moves%20a%20few%20pixels%20up%2C%20and%20when%20I%20remove%20cursor%20from%20it%2C%20it%20returning%20on%20the%20previous%20position%2C%20moving%20a%20few%20pixels%20down.%20It%20also%20spreads%20on%20connection%20and%20profile%20menus%2C%20sometimes%20on%20downloads%20panel.%3C%2FP%3E%3CP%3EI%20have%20attached%20a%20video%20demonstrating%20the%20bug.%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087722%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087722%22%20slang%3D%22en-US%22%3EI%20think%20they%20decided%20to%20give%20up%20Pixel%20Canvas%20Recording%20(there%20was%20some%20issues%20with%20it)%2C%20but%20they%20said%20Pixel%20Canvas%20Recording%20was%20always%20only%20intended%20to%20be%20a%20mid%20term%20solution%20until%20pixel%20coordinate%20conversions%20was%20ready.%20From%20the%20Doc%3A%3CBR%20%2F%3E%3CBR%20%2F%3E%22There%20are%20more%20devices%20that%20requires%20fractional%20scale%20factors.%20ChromeOS%20tablet%20will%20need%20a%20touchable%20friendly%20UI.%20Allowing%20more%20flexible%20scale%20factors%2C%20then%20optimize%20UI%20for%20touch%20where%20necessary%20would%20allow%20us%20to%20continue%20improve%20UI%20for%20both%20clamshell%20and%20touch%20form%20factors.%20However%2C%20current%20implementation%20has%20a%20lot%20of%20issue%20with%20these%20scale%20factors.%20(see%20pkasting%40%E2%80%99s%20doc%20for%20the%20issue).%3CBR%20%2F%3E%3CBR%20%2F%3EThis%20can%20be%20solved%20by%20using%20pixel%20coordinates%2C%20but%20it%20may%3CBR%20%2F%3Etake%20time%3A%20Both%20application%20code%20as%20well%20as%20underlying%20framework%20has%20to%20be%20changed%20to%20use%20pixel%20coordinates%20and%2For%20DIP%20library.%3CBR%20%2F%3Erequire%20more%20maintenance%20code%20as%20application%20code%20is%20required%20to%20do%20the%20right%20thing%20about%20scaling.%3CBR%20%2F%3E%3CBR%20%2F%3EThe%20reason%20why%20views%20are%20not%20aligned%20with%20fractional%20scale%20factor%20is%20that%20views%20does%20not%20have%20pixel%20information%2C%20and%20the%20way%20DIP%20is%20converted%20to%20pixel%20can%20also%20lead%20to%20a%20gap.%20This%20document%20describes%20an%20alternative%20approach%20to%20address%20these%20issues%20by%20providing%20pixel%20size%20so%20that%20views%20can%20layout%20views%20components%20at%20pixel%20boundaries%20using%20point%20based%20conversion.%20This%20is%20also%20a%20good%20mid%20term%20solution%20until%20pixel%20coordinate%20conversions%20is%20ready.%22%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087727%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087727%22%20slang%3D%22en-US%22%3EAlso%2C%20Vivaldi%20doesn't%20have%20any%20of%20these%20issues%20(as%20far%20as%20I%20can%20tell).%20My%20laptop%20is%20at%20175%25%20display%20scaling%20too%2C%20and%20still%20no%20issues.%20Maybe%20use%20Vivaldi%20until%20Google%2FMicrosoft%20get%20this%20all%20sorted%20out%20(Firefox%20does%20have%20some%20issues%20with%20fractional%20scale%20factors%20but%20not%20as%20many%20as%20Chrome%20and%20Edge)%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087795%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087795%22%20slang%3D%22en-US%22%3EWatching%20that%20video%2C%20to%20me%20it%20looks%20like%20the%20elements%20hovered%20over%20go%20in%20and%20then%20come%20out%20when%20mouse%20cursor%20is%20not%20on%20them%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087827%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087827%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F318719%22%20target%3D%22_blank%22%3E%40Bdsrev%3C%2FA%3E%3CBR%20%2F%3EWhere%20is%20this%20doc%20from%3F%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087832%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087832%22%20slang%3D%22en-US%22%3EYup%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087870%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087870%22%20slang%3D%22en-US%22%3E%3CA%20href%3D%22https%3A%2F%2Fdocs.google.com%2Fdocument%2Fd%2F1eJArJkOhm-FTKKX6j7-zFV9aXVN0ZwA3RXlWifJFpiE%2Fedit%23%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fdocs.google.com%2Fdocument%2Fd%2F1eJArJkOhm-FTKKX6j7-zFV9aXVN0ZwA3RXlWifJFpiE%2Fedit%23%3C%2FA%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087889%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087889%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F318719%22%20target%3D%22_blank%22%3E%40Bdsrev%3C%2FA%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThank%20you%20very%20much%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1087826%22%20slang%3D%22en-US%22%3ERe%3A%20DPI%20scaling%20bug%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1087826%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F310193%22%20target%3D%22_blank%22%3E%40HotCakeX%3C%2FA%3E%3C%2FP%3E%3CP%3EIt's%20exactly%20that%20I%20said%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Contributor

I have been using Microsoft Edge Canary since the first build on my PC with FullHD screen and 125% system scale factor, and during this time there is present annoying DPI scaling bug, which then moved to Chromium-based browsers too. I could "fix" it by enabling "Enable pixel canvas recording" flag, but it was disappeared in Edge (and Chrome) 79.

The problem is the twitching user interface. When you hover buttons, e.g. home button, it moves a few pixels up, and when I remove cursor from it, it returning on the previous position, moving a few pixels down. It also spreads on connection and profile menus, sometimes on downloads panel.

I have attached a video demonstrating the bug.

8 Replies
Highlighted
Best Response confirmed by msekmfb1 (Contributor)
Solution
I think they decided to give up Pixel Canvas Recording (there was some issues with it), but they said Pixel Canvas Recording was always only intended to be a mid term solution until pixel coordinate conversions was ready. From the Doc:

"There are more devices that requires fractional scale factors. ChromeOS tablet will need a touchable friendly UI. Allowing more flexible scale factors, then optimize UI for touch where necessary would allow us to continue improve UI for both clamshell and touch form factors. However, current implementation has a lot of issue with these scale factors. (see pkasting@’s doc for the issue).

This can be solved by using pixel coordinates, but it may
take time: Both application code as well as underlying framework has to be changed to use pixel coordinates and/or DIP library.
require more maintenance code as application code is required to do the right thing about scaling.

The reason why views are not aligned with fractional scale factor is that views does not have pixel information, and the way DIP is converted to pixel can also lead to a gap. This document describes an alternative approach to address these issues by providing pixel size so that views can layout views components at pixel boundaries using point based conversion. This is also a good mid term solution until pixel coordinate conversions is ready."
Highlighted
Also, Vivaldi doesn't have any of these issues (as far as I can tell). My laptop is at 175% display scaling too, and still no issues. Maybe use Vivaldi until Google/Microsoft get this all sorted out (Firefox does have some issues with fractional scale factors but not as many as Chrome and Edge)
Highlighted
Watching that video, to me it looks like the elements hovered over go in and then come out when mouse cursor is not on them
Highlighted

@HotCakeX

It's exactly that I said

Highlighted

@Bdsrev
Where is this doc from?

Highlighted
Yup
Highlighted

@Bdsrev 

Thank you very much