search

leodevbro / vscode-blockman

VSCode extension to highlight nested code blocks
https://github.com/leodevbro/vscode-blockman
MIT License
465 stars 17 forks source link

Remove horizontal lines that are distracting at normal zoom levels #52

Closed mikef80 closed 2 years ago

mikef80 commented 2 years ago

Hi. Firstly, let me say that this is a great extension! I heard about it when you posted it on Codecademy and have shared with so many people!

When at normal zoom levels, I have an awful lot of horizontal lines generated by Blockman, as shown in the first screen shot:

image

However, when I zoom out a bit, these disappear, leaving behind just the borders of the blocks. I can't find an option to make this the default choice for me - is it possible?

image

Thank you!

Ollie-Boyd commented 2 years ago

I just came to ask about the same issue

leodevbro commented 2 years ago

I think it is a VSCode limitation, not a bug of Blockman. the editor font zoom is not exposed in any way to the API, so, it means Blockman cannot detect font zoom level, because VSCode API simply does not give us access to it.

https://github.com/microsoft/vscode/issues/125341#issuecomment-854962933

leodevbro commented 2 years ago

Also, I want to ask you, which type of zoom are you mentioning? mouse wheel zoom? or Window: Zoom Level ?

Ollie-Boyd commented 2 years ago

@leodevbro mine shows these horizontal lines on a fresh install of VS Code at default zoom level. If I ctrl+'-' to zoom out the lines reduce but they are still there. When I scroll the lines jump about

Ollie-Boyd commented 2 years ago

Default zoom image Zoomed out image

mikef80 commented 2 years ago

Mine also shows on default zoom levels. What I have noticed though is that it's only happening on my home PC (4K monitors set to 150% scale). Mine behave much as @Ollie-Boyd describes above. However, my work monitors (Full HD at 100% scale) don't show these horizontal lines, no matter how much I zoom in or out. Both systems are using fresh installs and I have tried it with all other add-ons disabled to check for any adverse interaction.

abhi-k9 commented 2 years ago

Can confirm this issue on default zoom.

Lines appear and disappear on scrolling. There doesn't seem to a specific patter as far as I can tell.

leodevbro commented 2 years ago

Has anyone here experienced this issue on a monitor with less than 4K resolution?

abhi-k9 commented 2 years ago

That would be me.

mikef80 commented 2 years ago

That would be me.

What resolution are you using and are you scaling at all?

leodevbro commented 2 years ago

image

Well, now I tested on my 1920x1080 monitor with playing around the Windows scaling settings. Turns out the block rendering of Blockman extension goes crazy (like in your screenshots) on every percentage setting other than 100%. So, I think the problem is in Windows 10 scaling algorithm or in VSCode scaling algorithm or both. So, I guess Blockman itself is not responsible for this issue at all.

So, maybe we should make a bug report in VSCode repo in Github.

abhi-k9 commented 2 years ago

System display settings:

VSCode settings:

System:

As @leodevbro pointed out, issue seems to disappear on 100% scaling.

Does this happen on other systems too? (Mac, Linux?)

Ollie-Boyd commented 2 years ago

Grrr, everything is so tiny on my 1080p 13" at 100%. Shoukd I make a bug report to vs code? Not sure how to describe the problem

From: Abhi @.> Sent: 20 November 2021 17:20 To: leodevbro/vscode-blockman @.> Cc: Ollie Boyd @.>; Mention @.> Subject: Re: [leodevbro/vscode-blockman] Remove horizontal lines that are distracting at normal zoom levels (Issue #52)

System display settings:

VSCode settings:

As @leodevbrohttps://github.com/leodevbro pointed out, issue seems to disappear on 100% scaling.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/leodevbro/vscode-blockman/issues/52#issuecomment-974681997, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AMBF4V4J76BS4QAQ5YZVODTUM7KHTANCNFSM5IBJKDJQ. Triage notifications on the go with GitHub Mobile for iOShttps://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Androidhttps://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

mikef80 commented 2 years ago

I think that’d be good, but I’m not sure how to describe the problem. I’m still pretty new to this and wouldn’t have the first clue how this was built!

Sent from my iPhone

On 20 Nov 2021, at 17:59, Ollie Boyd @.***> wrote:

 Grrr, everything is so tiny on my 1080p 13" at 100%. Shoukd I make a bug report to vs code? Not sure how to describe the problem

From: Abhi @.> Sent: 20 November 2021 17:20 To: leodevbro/vscode-blockman @.> Cc: Ollie Boyd @.>; Mention @.> Subject: Re: [leodevbro/vscode-blockman] Remove horizontal lines that are distracting at normal zoom levels (Issue #52)

System display settings:

  • Scale: 125% (Recommended)
  • Resolution: 1920 x 1200 (Recommended)

VSCode settings:

  • Editor Font Size: 18

As @leodevbrohttps://github.com/leodevbro pointed out, issue seems to disappear on 100% scaling.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/leodevbro/vscode-blockman/issues/52#issuecomment-974681997, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AMBF4V4J76BS4QAQ5YZVODTUM7KHTANCNFSM5IBJKDJQ. Triage notifications on the go with GitHub Mobile for iOShttps://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Androidhttps://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

leodevbro commented 2 years ago

I made a bug report just now in the vscode repo: https://github.com/microsoft/vscode/issues/137609

Please like it, so it gets better chance to be fixed.

leodevbro commented 2 years ago

Very good news: I fixed the mouse wheel zoom behavior of Blockman. The latest version of Blockman is 1.4.5 (2022-01-03).

I know your issue is not about mouse wheel zoom, it's about Window: Zoom Level (Ctrl and + / -), but I think the fix of mouse wheel zooming will greatly help the Window: Zoom Level zooming to have much less artifacts (horizontal lines). Please check it out.

mathric commented 2 years ago

Just got into the same problem. Have solved it temporarily using try and error way by adjust the Mouse Wheel Scroll Sensitivity and zoom level in vscode setting. Hope this can help someone before the bug report being addressed.

leodevbro commented 2 years ago

@mikef80, @abhi-k9, @rgehrsitz, @Ollie-Boyd, @mathric, Hi everyone, I want to ask you to update VSCode to the latest version (1.66) and check the issue again. For me, I discovered that somehow this issue (strange horizontal lines) is no longer reproducible in my machine. It seems pretty much fixed. Well, I tried many different ugly zooming settings and the worst scenario I got is one or two rare horizontal lines, so in most cases it seems fixed. So, please check it again and tell me if the situation is changed or not.

mikef80 commented 2 years ago

Hi @leodevbro,

You're right! I've just updated to 1.66 on my Mac and it looks like the issue is gone. Perfect! Haven't checked on my own PC yet, but my work PC appears to also be fixed! Great work!

rgehrsitz commented 2 years ago

It's working on my 4K Windows display using using VSCode 1.66. Now I can appreciate what this extension is really supposed to look like. Excellent!

mikef80 commented 2 years ago

Yeah, mine's a 4K too - looks bloody great!

mathric commented 2 years ago

Yes, it also works on my laptop which is not support 4K