Radio and check buttons text truncated under LUbuntu 24.04LTS (LXQt)

[maccasoft]

Describe the bug Radio and check buttons text is truncated when running under LUbuntu 24.04LTS (LXQt) or generally KDE (users reports).

To Reproduce An example with Eclipse SDK itself, open the Find / Replace dialog, all radio / check button labels are truncated.

Expected behavior Text should not be truncated.

Screenshots

Environment:

1. Select the platform(s) on which the behavior is seen:

• • [ ] All OS
• • [ ] Windows
• • [x] Linux
• • [ ] macOS

2. Additional OS info (e.g. OS version, Linux Desktop, etc) LUbuntu 24.04.1LTS LXQt 1.4.0 Qt 5.15.13

3. JRE/JDK version Temurin 21.0.6+7-LTS

Version since Eclipse 4.34.0 SWT 3.128.0

Workaround (or) Additional context No workaround, as far as I know.

[deepika-u]

Tried on the below version of ubuntu and i am seeing the buttons text properly.

For reference ->

Environment Description: Ubuntu 24.04 LTS XDG_SESSION_TYPE=wayland

Eclipse SDK Version: 2025-03 (4.35) Build id: I20250108-1800 OS: Linux, v.6.8.0-51-generic, x86_64 / gtk 3.24.41 Java vendor: Oracle Corporation Java runtime version: 23+36-2368 Java version: 23

[maccasoft]

Yes, the button text display properly on Ubuntu 24.04 (Gnome), it doesn't display properly on LUbuntu, that's a variant of Ubuntu running LXQt as desktop environment. I guess is an issue with the DE or the theme or both that doesn't report the widget size correctly.

Reference https://lubuntu.me/

[deepika-u]

Thanks for the details. 👍

[ptziegler]

The same behavior can also be seen on KDE (Kubuntu 24.04) ~~whoops, missed how that was also reported in the original post~~

[ptziegler]

A trivial reproducer for this problem is:

public static void main (String [] args) {
	Display display = new Display ();
	Shell shell = new Shell(display);
	shell.setText("Snippet 1");
	shell.setLayout(new GridLayout());
	Button b1 = new Button(shell, SWT.RADIO);
	b1.setText("ABCDEF");
	Button b2 = new Button(shell, SWT.RADIO);

	shell.setSize(200, 200);
	shell.open ();
	while (!shell.isDisposed ()) {
		if (!display.readAndDispatch ()) display.sleep ();
	}
	display.dispose ();
}

It seems like that buttons are slightly shifted to the right when containing text and by such an amount that the right side gets cut off.

Even weirder is that you can watch this movement happen in e.g. the preference pages as well. When a page is loaded for the first time, you can see the buttons jumping around.

https://github.com/user-attachments/assets/7d67f0a6-08d2-4489-927a-f983f5a2d0e1

I can also reproduce this issue in e.g. the 2020-12 release, so I don't think this is caused by a change in SWT, but rather something on the GTK side.

Note: This issue only happens with GTK3 but not GTK4.

[iloveeclipse]

Is this Wayland specific? I can't reproduce on RHEL 9.2/X11/KDE.

[ptziegler]

Is this Wayland specific? I can't reproduce on RHEL 9.2/X11/KDE.

I don't think so. Based on @deepika-u 's screenshot, it looks fine with a Ubuntu/Wayland combination. And on my side it's also broken, while using X11. I also doubt it's caused by anything in GTK, given that I'm using GTK 3.24.41, the same as in the Ubuntu case.

[ptziegler]

It's the theme, just as @maccasoft suspected. The text is truncated when using the "Breeze" application style and fine when going back to the "default" theme.

This is the same system using "Breeze" on the left and the "default" theme on the right.

[iloveeclipse]

It's the theme, just as @maccasoft suspected. The text is truncated when using the "Breeze" application style and fine when going back to the "default" theme.

OK, that could be. We use breeze, but we pimped it to match our UX quality expectations.

@trancexpress : could you please atach our pimped breeze style file? May be we should ask KDE devs to apply some/all fixes we made to breeze.

[iloveeclipse]

See stylesheet we use for Eclipse It can be used by passing this VM argument to in eclipse.ini

-vmargs
-Dorg.eclipse.swt.internal.gtk.cssFile=/path/to/theme_patches.css

Patch for breeze GTK theme.

/*
 * Fix for tab height.
 */
notebook box label {
    padding-bottom: 2px;
    padding-top: 2px;
}

/*
 * Unset the too-large toolbar button padding specified in the theme,
 * since SWT sets the padding on application level only for Adwaita.
 */
toolbar.inline-toolbar button,
toolbar.primary-toolbar button,
toolbar.primary-toolbar button:active,
toolbar.horizontal button,
toolbar.horizontal button:active,
toolbar toolbutton button,
.titlebar .linked.raised button,
.titlebar .linked.raised button:active {
	padding: 1px;
}

toolbar button,
toolbar.primary-toolbar button,
toolbar.horizontal button:hover,
toolbar.horizontal button:active {
	padding: 1px;
}

.path-bar button,
.linked.path-bar > button,
.path-bar button image,
.path-bar button label {
	padding: 0px;
}

/*
 * Decrease minimum entry height, to have smaller text inputs, combos, etc..
 */
entry {
    min-height: 22px;
}

/*
 * Ensure toolbars, and also by extension part stack tabs, have some minimal height.
 */
toolbar {
    min-height: 23px;
}

/*
 * Give some padding to toolbars and toolbar buttons,
 * so that toolbar buttons don't appear cramped by their borders.
 */
toolbar {
	padding-top: 1px;
	padding-bottom: 1px;
}

toolbar toolbutton button {
	padding: 1px;
}


/*
 * Fix radio button and checkbox label text being cut off from the right.
 */
check,
radio {
	border-color: #8f8f8f;
	margin: 0 2px;
	min-height: 12px;
	min-width: 12px;
}

check:selected,
check:checked,
check:indeterminate,
radio:selected,
radio:checked,
radio:indeterminate {
	background-color: white;
	color: black;
}

check:hover,
radio:hover {
	background-color: white;
	border: 1px solid @theme_button_decoration_hover_breeze;
}

/*
 * Add scrollbar buttons, since breeze-gtk doesn't have them.
 */
scrollbar {
	-GtkScrollbar-has-backward-stepper: true;
	-GtkScrollbar-has-forward-stepper: true;
}

scrollbar button,
scrollbar .button {
	border-image: none;
	background-image: none;
	background-color: transparent;
	color: @insensitive_fg_color_breeze;
}

scrollbar.vertical button.up,
scrollbar.vertical .button.up {
	border-radius: 3px 3px 0px 0px;
	-gtk-icon-source: -gtk-icontheme("go-up-symbolic");
}

scrollbar.vertical button.down,
scrollbar.vertical .button.down {
	border-radius: 0px 0px 3px 3px;
	-gtk-icon-source: -gtk-icontheme("go-down-symbolic");
}

scrollbar.horizontal button.up,
scrollbar.horizontal .button.up {
	border-radius: 3px 0px 0px 3px;
	-gtk-icon-source: -gtk-icontheme("go-previous-symbolic");
}

scrollbar.horizontal button.down,
scrollbar.horizontal .button.down {
	border-radius: 0px 3px 3px 0px;
	-gtk-icon-source: -gtk-icontheme("go-next-symbolic");
}

/*
 * ZipEditor shows rows with too little height, resulting in not fully displayed row text.
 */
treeview.view { outline-offset: -1px; }

[ptziegler]

Thanks! I'll give it a try later but I think there's already a very high chance the reason you don't see it on your side is because of this section:

/*
 * Fix radio button and checkbox label text being cut off from the right.
 */
check,
radio {
	border-color: #8f8f8f;
	margin: 0 2px;
	min-height: 12px;
	min-width: 12px;
}

[maccasoft]

Thank you all, I found the GTK3 theme settings in LXQt (I'm not very familiar with LXQt or KDE) and indeed seems an issue only with Breeze, all other themes works correctly.

Any chance to fix that in code, with layout settings or something ?

I'm more concerned about my application rather than Eclipse, my problem is that I can't ask my users to patch the theme or do something "unusual". I don't mind adding a check to apply it only when the theme is Breeze.

[ptziegler]

Thank you all, I found the GTK3 theme settings in LXQt (I'm not very familiar with LXQt or KDE) and indeed seems an issue only with Breeze, all other themes works correctly.

Any chance to fix that in code, with layout settings or something ?

I'm more concerned about my application rather than Eclipse, my problem is that I can't ask my users to patch the theme or do something "unusual". I don't mind adding a check to apply it only when the theme is Breeze.

Can't you use the approach described in https://github.com/eclipse-platform/eclipse.platform.swt/issues/1758#issuecomment-2623630692 with your own, patched version of the Breeze theme?

[maccasoft]

Can't you use the approach described in #1758 (comment) with your own, patched version of the Breeze theme?

I would rather not have an external file, but if there are no other chances.

Looks working, however doesn't seems possible to apply it only for Breeze, the org.eclipse.swt.internal.gtk.cssFile property must be set before instantiating Display, but the org.eclipse.swt.internal.gtk.theme seems to be set after Display instantiation, and I don't see an environment variable with the theme name. Is that correct ?

Not sure what happens with other themes, maybe is a non-problem.

[trancexpress]

I don't see an environment variable with the theme name. Is that correct ?

Do you use/have GTK_THEME?

[maccasoft]

I don't see an environment variable with the theme name. Is that correct ?

Do you use/have GTK_THEME?

Is not set in both my Ubuntu/LUbuntu machines.

I did a set | grep Breeze and nothing came out.

[maccasoft]

Well, seems that tweaking the GridData settings a bit will fix the text display.

public static void main (String [] args) {
	Display display = new Display ();
	Shell shell = new Shell(display);
	shell.setText("Snippet 1");
	shell.setLayout(new GridLayout());
	Button b1 = new Button(shell, SWT.RADIO);
	b1.setText("ABCDEF");
	Button b2 = new Button(shell, SWT.RADIO);

	Button b3 = new Button(shell, SWT.RADIO);
	b3.setText("ABCDEF");
	GridData gridData = new GridData(b3.computeSize(SWT.DEFAULT, SWT.DEFAULT).x + 10, SWT.DEFAULT);
	gridData.horizontalIndent = -4;
	b3.setLayoutData(gridData);

	shell.setSize(200, 200);
	shell.open ();
	while (!shell.isDisposed ()) {
		if (!display.readAndDispatch ()) display.sleep ();
	}
	display.dispose ();
}

Not sure about the size increase, in my application it works with +8, with that snippet it needs +10, maybe it depends on the actual buttons layout.

I guess that when (if) the theme is fixed upstream the display will be a bit ugly due to the negative horizontalIndent, this can be omitted since the increase of the widthHint seems enough. At least this works for me and can be apply to Breeze only.

[iloveeclipse]

@trancexpress : I believe SWT already had extra css styles for Adwaita. Seeing more people complaining about breeze, would it make sense to add our breeze css patch file to SWT, guarded by some system flag so it could be switched off if breeze will deliver css fixes by themselves? Also we should report to KDE if not yet done.

[trancexpress]

I believe SWT already had extra css styles for Adwaita. Seeing more people complaining about breeze, would it make sense to add our breeze css patch file to SWT

The theme patches SWT has are not theme dependent, if we would be adding something that would be the first thing we need to change (if we can). The code is in: org.eclipse.swt.graphics.Device.overrideThemeValues()

Should I open a ticket for adding our Breeze patches to SWT? I doubt we want to do this as part of the tickets like this one.

guarded by some system flag so it could be switched off if breeze will deliver css fixes by themselves?

There already is the flag org.eclipse.swt.internal.gtk.noThemingFixes that we use to disable the Adwaita fixes... I guess we can continue to use that flag.

Also we should report to KDE if not yet done.

I don't know about this, what do you want to use for the report? Eclipse? Eclipse has a lot of customization on top of GTK+, in particular the custom widget SwtFixed - something a GTK+ application doesn't have. This customization probably causes problems, like the one reported here.

I assume we must spend time for each of the problems we have, to reproduce with a pure GTK3 snippet, to then report a Breeze problem at KDE. For some things we patched this will be quick, for other things probably not.

Do you want me to open a ticket in our internal tracker for this? It will take a while and we'll have to track the results in KDE (if any). In some cases (e.g. checkboxes) I'm also not sure we'll get any changes in KDE. Overall I've been avoiding spending effort in trying to get changes done to Breeze, to the benefit of Eclipse, for various reasons (mostly it will be a lot of effort to make the reports based on GTK+ snippets).

[ptziegler]

I've created https://github.com/eclipse-platform/eclipse.platform.swt/pull/2258 to illustrate how those changes look like.

Given that the Breeze theme looks fine with GTK4, the culprit might be on either side. It's just as likely that something with the SwtFixed is causing this behavior, just like @trancexpress mentioned.

[tmssngr]

@ptziegler Your #2256 fixes the problem also for me. I was surprised that just setting a larger size did not help.

Is it possible to let any SWT based application run with GTK4 without changing the SWT.jar?

[ptziegler]

Your https://github.com/eclipse-platform/eclipse.platform.swt/issues/2256 fixes the problem also for me.

Thanks for the feedback! Unless there are any objections, I'll then try to merge it towards the end of the week.

Is it possible to let any SWT based application run with GTK4 without changing the SWT.jar?

GTK4 is enabled for SWT by setting the SWT_GTK4 environment variable. Just keep in mind that there is still a lot of functionality that either works poorly or not at all with GTK4.

https://github.com/eclipse-platform/eclipse.platform.swt/blob/de1f3ef1e33bd8f24befb93b40f0e39a9b3fa8bf/bundles/org.eclipse.swt/Eclipse%20SWT%20PI/gtk/org/eclipse/swt/internal/gtk/OS.java#L83-L97