Blinking when toggle panels

[VaMaliken]

Hi i have an issue when toggling panels.

Is there way to avoid it?

Screen.Recording.2021-08-09.at.20.50.10.mov

[Daniil]

Same

[Brandon Powell]

After digging through the source, this appears to be the result of vscode resetting the window background color and Vibrancy trying to fix that with a timer.

You can play with the timer here to get the blink down to acceptable levels. Until a better workaround can be found.

vscode-vibrancy/runtime/index.js

Lines 86 to 90 in d2f3c95

 clearInterval(backgroundColorTimer); 
 // https://github.com/microsoft/vscode/blob/9f8431f7fccf7a048531043eb6b6d24819482781/src/vs/platform/theme/electron-main/themeMainService.ts#L80 
 backgroundColorTimer = setInterval(() => { 
 	window.setBackgroundColor('#00000000'); 
 }, 1000); 

The blink is just a factor of the time between the color being set and the timer firing off afterwards to reset it, so its a tradeoff between how many times you want to unnecessarily reset the background color of the window vs how much it bugs you. I've found that it starts getting tolerable around 10ms and is virtually eliminated around 1-2 ms.

Note, it may be easiest to edit that file manually in it's install location (which was /Applications/Visual Studio Code.app/Contents/Resources/app/out/vscode-vibrancy-runtime-v6 for me), as Vibrancy has a directory exists check that keeps it from overwriting those files if you don't uninstall first.

[Brandon Powell]

More performant fix:
Disable the timer mentioned in my previous comment, and find the following file (path shown for default installation on macOS):
/Applications/Visual\ Studio\ Code.app/Contents/Resources/app/out/vs/code/electron-main/main.js
In that file, there is a section that contains:

updateBackgroundColor(d,g){for(const b of p.BrowserWindow.getAllWindows())if(b.id===d){b.setBackgroundColor(g.colorInfo.background);break}}

Replace that with:

updateBackgroundColor(d,g){for(const b of p.BrowserWindow.getAllWindows())if(b.id===d){b.setBackgroundColor("#00000000");break}}

Now the background color should persist without the timer and without a blink (at least until this file is overwritten by a VSCode update, at which point you'll have to reapply the patch).

[Evan Simpson]

Thanks for the insight @brandon-powell.

Just for reference, in the current build the lines appear in /Applications/Visual\ Studio\ Code.app/Contents/Resources/app/out/vs/code/electron-main/main.js as:

updateBackgroundColor(t,m){for(const v of p.BrowserWindow.getAllWindows())if(v.id===t){v.setBackgroundColor(m.colorInfo.background);break}}

and should be replaced with:

updateBackgroundColor(t,m){for(const v of p.BrowserWindow.getAllWindows())if(v.id===t){v.setBackgroundColor("#00000000");break}}

[Chris]

More performant fix: Disable the timer mentioned in my previous comment, and find the following file (path shown for default installation on macOS): /Applications/Visual\ Studio\ Code.app/Contents/Resources/app/out/vs/code/electron-main/main.js In that file, there is a section that contains:

updateBackgroundColor(d,g){for(const b of p.BrowserWindow.getAllWindows())if(b.id===d){b.setBackgroundColor(g.colorInfo.background);break}}

Replace that with:

updateBackgroundColor(d,g){for(const b of p.BrowserWindow.getAllWindows())if(b.id===d){b.setBackgroundColor("#00000000");break}}

Now the background color should persist without the timer and without a blink (at least until this file is overwritten by a VSCode update, at which point you'll have to reapply the patch).

Thank you very much!