search

slint-ui / slint

Slint is a declarative GUI toolkit to build native user interfaces for Rust, C++, or JavaScript apps.
https://slint.dev
Other
16.94k stars 568 forks source link

Blurry text #4868

Closed mateiandrei94 closed 2 months ago

mateiandrei94 commented 6 months ago

Blurry text

Although not always, if resized "the wrong way" all slint programs have blurry text; this includes all the executables, the demos in the web browser (firefox, chrome, edge, all of them), slint pad and the slint live preview in Visual Studio Code (tested on Windows 11 with 100% scale).

For the purpose of this bug report I will specify a specific scenario (Rust in release mode on windows 11 with 100% scale). The 100% scale is important, since changing it to 125, the issue goes away. But I don't think this should be an excuse or solution since all the other programs do not have blurry text at 100% scale.

I believe this problem is valid regardless of renderer or backend.

I would not be making this bug report if it were simply an issue with window size, see last picture.

Details

Programming Language : Rust cargo 1.75.0 (1d8b05cdd 2023-11-20) rustc 1.75.0 (82e1608df 2023-12-21)

Operating System: Microsoft Windows 11 Version 23H2 (0S Build 22631.3296)

Steps to reproduce:

Use the latest Windows 11, have git cargo and rustc installed In your windows 11 settings, (System > Display), section Scale & layout, make sure you have Scale at at "100% (Recommended)", if your display is not (Recommended) on 100% use a different one that is. My display is 27″ with resolution 2560 x 1440

git clone https://github.com/slint-ui/slint.git cd slint\examples\gallery cargo run --release Click on the left (List View) Resize the window left or right by 1 or multiple pixels until you see blurry text.

Expected behavior :

I don't expect text to become blurry. If you resize the window by 1 or multiple pixels in any other application such as the windows setting application, you will notice that sometimes the contents grow and other times nothing changes. In all slint applications the contents always grow (which I think is an error or bug). I suppose there are some calculations on pixel bounds, rather than rendering text in between pixels, some magic happens where text is kept correctly.

What do you see instead :

Blurry text sometimes and clear and readable text some other times.

To set the Window size, I'm using a program called sizer which adds a context menu at the bottom right of any resizable window.

Here are some screenshots:

image image image

treuks commented 5 months ago

I recognize that font rendering is an incredibly immense task, however, personally, this issue seems to be my number one deal breaker with Slint. I have noticed that you can get semi-tolerable results by using the Skia backend, however I really think it should not be needed.

I would love the possibility of utilising system native font rendering solutions, such as DWriteCore on Windows 10+, CoreText on MacOS, and Freetype on Linux and friends (if possible), alternatively, cosmic-text.

EdnY1 commented 4 months ago

I really tried to use Slint but the font rendering issues is a deal breaker for me. It would be so nice if you guys manage to fix it.