Bug 492340

Summary: Days with 0% chance of precipitation have differently-aligned icons and day labels
Product: [Unmaintained] kdeplasma-addons Reporter: Nate Graham <nate>
Component: WeatherAssignee: Plasma Bugs List <plasma-bugs-null>
Status: RESOLVED FIXED    
Severity: minor CC: isma.af
Priority: NOR    
Version First Reported In: master   
Target Milestone: ---   
Platform: Other   
OS: Linux   
Latest Commit: Version Fixed/Implemented In: 6.2
Sentry Crash Report:
Attachments: Alignment issues
works in my PC
With lots of background rectangles for illustration purposes

Description Nate Graham 2024-08-28 21:44:18 UTC
Created attachment 173059 [details]
Alignment issues

I hate to be That Guy™ who draws lines on screenshots, but there are clearly some code-related alignment issues with the Weather widget due to the presence of absence of precipitation percentage labels. On days when they're missing, the icons and day labels above them are too far down.

See attached screenshot.
Comment 1 Ismael Asensio 2024-08-28 21:58:21 UTC
Created attachment 173060 [details]
works in my PC

The issue is... I've been trying with different fonts and settings, and I'm not able ever to reproduce it so I don't know what can be happening in your case. 

For me the spacing is always perfectly preserved. The precipitation labels don't get hidden when not in use, but the text is a visual placeholder "·" It might be different vertical metrics calculation for this dot, but afaik the height of the text box should be the same for any characters

If you can, a screenshot with gammaray to pinpoint the actual size of the items with and without precipitation might be helpful
Comment 2 Nate Graham 2024-08-28 22:10:26 UTC
Created attachment 173061 [details]
With lots of background rectangles for illustration purposes

Here you go, with lots of rectangles behind the items.

I figured it out: it's the umbrella emoji! You see a colorful emoji which has the same height as the text, so the height of the "chance of precipitation" labels matches up with the height of the "no precipitation" labels.

But for me, I see a monochrome emoji which, for some reason, is taller than the rest of the characters. This increases the height of the "chance of precipitation" labels. relative to the "no precipitation" labels.

Setting "Layout.preferredHeight: 50" on the precipitation label fixes it, though of course that's a crude fix that's the wrong way to go about it.
Comment 3 Ismael Asensio 2024-08-28 22:16:37 UTC
(In reply to Nate Graham from comment #2)
> Created attachment 173061 [details]
> With lots of background rectangles for illustration purposes
> 
> Here you go, with lots of rectangles behind the items.
> 
> I figured it out: it's the umbrella emoji! You see a colorful emoji which
> has the same height as the text, so the height of the "chance of
> precipitation" labels matches up with the height of the "no precipitation"
> labels.
> 
> But for me, I see a monochrome emoji which, for some reason, is taller than
> the rest of the characters. This increases the height of the "chance of
> precipitation" labels. relative to the "no precipitation" labels.
> 
> Setting "Layout.preferredHeight: 50" on the precipitation label fixes it,
> though of course that's a crude fix that's the wrong way to go about it.

Nice! The colored/uncolored emoji is a translation issue. I tried to set it always to b&w, but the special unicode character to set "text mode" doesn't get extracted into the translation files. When using en_US I think you'll be getting the untranslated text.

At this point I think the colored one looks better and hopefully also behaves better. Worst case scenario, it has to do with different emoji fonts and I'll have to add a TextMetrics to fix it
Comment 4 Nate Graham 2024-08-28 22:20:09 UTC
I also think the colored one looks better, but unfortunately it's no-deterministic as to which one the user will get due to the vagaries of their fontconfig, system language, etc. Probably we do need a TextMetrics thing in there.
Comment 5 Bug Janitor Service 2024-08-28 22:50:41 UTC
A possibly relevant merge request was started @ https://invent.kde.org/plasma/kdeplasma-addons/-/merge_requests/616
Comment 6 Ismael Asensio 2024-08-29 15:02:47 UTC
Git commit 07c5965d4ae9807eacb8031c5db35abcd9640017 by Ismael Asensio.
Committed on 29/08/2024 at 14:58.
Pushed by iasensio into branch 'master'.

applets/weather: Fix apperance and size for the umbrella emoji

If the regular font and the emoji font don't match, the height of
the bounding boxes will be different for labels with or without the
umbrella, disrupting the layout.

Let's set a fixed height using the metrics of the regular font, and
also remove the unicode marker for text-mode emojis, because it's
non-deterministic, not getting translated, and also looks worse.
FIXED-IN: 6.2

M  +15   -2    applets/weather/package/contents/ui/ForecastView.qml

https://invent.kde.org/plasma/kdeplasma-addons/-/commit/07c5965d4ae9807eacb8031c5db35abcd9640017