Henry00IS / ShapeEditor

2D Shape Editor for Unity Editor to create complex 3D meshes out of 2D shapes with RealtimeCSG support.
MIT License
98 stars 9 forks source link

Text blurry at HIDPI (4K, >1.25x UI scale) #1

Open nukeandbeans opened 2 years ago

nukeandbeans commented 2 years ago

All text appears blurry when on HIDPI screens (4K) with editor UI scaling ( > 1.25x ) applied. image image

Henry00IS commented 2 years ago

Hey Fluffles, thanks for opening an issue, could you try this branch please? https://github.com/Henry00IS/ShapeEditor/tree/DPI

On your large monitor, the text will probably be very small, but at least it shouldn't be blurry. If the results are an improvement, I will merge it. In the future, scaling in powers of 2 may be possible.

nukeandbeans commented 2 years ago

Text is definitely very small (I'm scaling at 175%). Would it be possible to have it respect the editor scale preference (EditorGUIUtility.pixelsPerPoint)? Works, though! image

nukeandbeans commented 2 years ago

Text is definitely very small (I'm scaling at 175%). Would it be possible to have it respect the editor scale preference (EditorGUIUtility.pixelsPerPoint)? Works, though! image

Hmm, seems its already using pixelsPerPoint. not sure why it isn't scaling properly.

nukeandbeans commented 2 years ago

I changed https://github.com/Henry00IS/ShapeEditor/blob/3159a0e03c07929bc7dbc0875476b072493d6676/Scripts/Editor/ShapeEditorWindow.Editor.cs#L201

to:

/// <summary>The width of the window in screen space multiplied by UI scaling.</summary>
internal float width => math.floor(position.width * ( EditorGUIUtility.pixelsPerPoint / 1.5f ));

/// <summary>The height of the window in screen space multiplied by UI scaling.</summary>
internal float height => math.floor(position.height * ( EditorGUIUtility.pixelsPerPoint / 1.5f ));

and https://github.com/Henry00IS/ShapeEditor/blob/3159a0e03c07929bc7dbc0875476b072493d6676/Scripts/Editor/ShapeEditorWindow.Editor.cs#L67

to:

float2 eMousePosition = math.floor(e.mousePosition *  ( EditorGUIUtility.pixelsPerPoint / 1.5f ));

and now get an acceptable screen scaling, but now the mouse position is messed up even without the changes to L96 above. I assume there are other places that this value needs to be changed/adjusted, but it's a lot of code to dig through that I'm not familiar with.

For now, until this is correctly fixed, I can just use it on another screen that isn't 4K.

Henry00IS commented 2 years ago

Yes, it's using pixelsPerPoint to undo the scaling that Unity Editor applies. It will try to scale the render texture by 1.75%, causing rounding errors and blurry text. Even with point interpolation the rounding errors cause a lot of errors. Attempting to scale the individual elements yields similar results as it's an odd number.

However, I am considering rounding to the nearest full integer or power of 2. So 1.25 or 1.75 scaling will render 2x scale. And 2.x will render at 3x or 4x scale. Depending on what doesn't cause these issues that is. But now I have a clean slate to work in, unaffected by your scaling settings and that was the goal of the PR.

Henry00IS commented 2 years ago

Hey Fluffles, I now round the pixelsPerPoint to the nearest integer and scale by that. So you should see 2x scale at 175% which should look pretty great on your monitor. Let me know! And thanks for helping me test this issue.

nukeandbeans commented 2 years ago

Scaling seems correct now, but the text is still blurry. Do you rasterize your text at one resolution only?

Henry00IS commented 2 years ago

Yes there is only one resolution, I used BMFont to generate a bitmap font from the TrueType font. The result you should see on your screen is the final render texture scaled x2 (with internal mouse and window positions adjusted accordingly). I want to keep these DPI workarounds simple and manageable so that I can quickly add more features without having to think about it.

What about the icons and window borders, are they at least not blurry anymore? I might swap the font texture for a higher resolution one, as I should be able to use the same UVs as long as the font layout on the texture is the same. But if everything is still blurry then that won't matter much.

nukeandbeans commented 2 years ago

The icons are fine, as long as they keep point filtering. Lines and borders never really seemed to have any issues, and I assume those are calculated in shaders.

Using a separate higher resolution font texture should solve the problem, and is the solution I had in mind as well. I'm not sure how it'd look at extremes, but I'll assume that nobody is going to use much higher than 200% scaling, as 150 - 175 is already pretty big.

nukeandbeans commented 2 years ago

Any news on this?

Henry00IS commented 2 years ago

Unfortunately, using a separate, higher-resolution font texture won't solve the problem, because the way I managed to solve everything else was to essentially zoom in on the render texture. So there's no pixel density left for higher detail.