Why JavaFX application and scene builder is showing garbled text?

Question

Here's how my scene builder looks like:

and here's the GUI:

The standalone scene builder:

I just run the following source code from Java SDK demos:

package sample;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.control.Button;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception{
        Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));
        Button btn = new Button();
        btn.setText("Say 'Hello World'!");
        StackPane root_ctn = new StackPane();
        root_ctn.getChildren().add(btn);
        btn.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent actionEvent) {
                System.out.println("Hello World!");
            }
        });
        primaryStage.setTitle("Hello World");
        primaryStage.setScene(new Scene(root_ctn, 300, 275));
        primaryStage.show();
    }


    public static void main(String[] args) {
        launch(args);
    }
}

The only place the text looks good is in the console.

View idea.log

See if https://stackoverflow.com/questions/14091011/how-to-add-utf-8-for-non-english-support-in-javafx helps. — SedJ601, Mar 22 '21 at 14:45
@Sedrick the editor is already set to UTF8. Anyways, thank you! — Stephane, Mar 22 '21 at 15:06
You `Parent root`, loaded from fxml, is never used. Was this intended? Also if relevant: please show the FXML. — Puce, Mar 22 '21 at 15:28
What is the default locale on that system? Try to run it with `-Duser.language=en -Duser.country=US` — Puce, Mar 22 '21 at 15:29
@Puce yes I was trying some code, so I added my own "root" just for testing. Thanks, I'll add the locale and see if it works. — Stephane, Mar 22 '21 at 17:48
Do you use default font in "Settings | Preferences | Appearance & Behavior | Appearance" ("use custom font" option is disabled)? — y.bedrov, Mar 22 '21 at 20:29
Could you please attach idea.log ("Help | Show Log in...") after restarting IDE? — y.bedrov, Mar 23 '21 at 07:23
Can you give more information about the system: OS version, Locale, IntelliJ version, Java version, JavaFX version... — Puce, Mar 23 '21 at 07:49
How do you run your application? What is the exact output on the console? — Puce, Mar 23 '21 at 07:51
@Puce I'm using Windows, fr_FR, IntelliJ Idea 2020.3, Java 1.8.0_281, JavaFX 11.0.2 — Stephane, Mar 23 '21 at 13:27
@y.bedrov here are the logs: https://www.dropbox.com/s/yvjuibiej54y2r6/idea.log?dl=0 — Stephane, Mar 23 '21 at 13:54
Do you face the same issue if you run scenebuilder outside IDE? — y.bedrov, Mar 23 '21 at 15:07
@y.bedrov yes I just added the screenshot of the standalone scene builder — Stephane, Mar 23 '21 at 15:54
probably unrelated, but why the version mix (jdk8 and fx11)? — kleopatra, Mar 23 '21 at 16:36
Thank you guys for helping out. I'm not sure what could be the reason. It looks relating to JavaFX — Stephane, Mar 23 '21 at 17:00
I don't think you can mix Java 8 (Oracle JDK comes with a bundled JavaFX version) with the modular JavaFX 11, but I might be wrong. — Puce, Mar 23 '21 at 21:45
It could be this bug in Java 8: https://bugs.java.com/bugdatabase/view_bug.do?bug_id=JDK-8088205 Perhaps you could try Java 11? — Bas Leijdekkers, Mar 26 '21 at 10:47
@BasLeijdekkers, I have installed Java 16 with JavaFX 16 and it looks the same — Stephane, Mar 26 '21 at 17:58
@Puce I guess the issue is related to JavaFX because it only shows these garbled texts in the window. — Stephane, Mar 26 '21 at 20:27
The following my help -> https://github.com/gluonhq/scenebuilder/issues/195 — SedJ601, Mar 27 '21 at 04:09
@Sedrick Only JavaFX components are showing garbled text (button, label, etc...). Also, it's not showing a language. So, I guess the issue comes from my Java/JavaFX install not the scene builder. — Stephane, Mar 27 '21 at 10:33
Could be a encoding problem between cp1252 and utf-8. It seams, Idea use a 3 step approach to chose the encoding type of a given file, whareas the console use the system encoding type. Could you try -Dfile.encoding=UTF8. — Marco Nanni, Mar 28 '21 at 21:20
@MarcoNanni I already added Dfile.encoding=UTF8 in the cmd line args — Stephane, Mar 29 '21 at 13:33

user7291698 · Accepted Answer · 2021-03-30T09:29:15.857

7

I did not yet find out the solution, but I found an interesting pattern: On your Gluon Scene Builder screenshot, there is written Pgy Rtqlgev, where it should be New Project, and Qrgp Rtqlgev where it should be Open Project. Note that every letter is substituted by the after next letter in the alphabet!

The same applies to Say 'Hello World'!, which is "translated" to Lc{ 'Jgrrq Yqtrf'!. Note that the letter y is replaced by a {, which comes two positions after y in the ASCII table. Interestingly, the characters ' and ! stay the same..

The space each letter takes is still the space of the correct letter, as you can see in the following graphic with the correct text on the green background:

Update: Is it possible that the font "Segoe UI" is missing or flawed on your system? Can you use that font for example in Word?

Update: I found two other questions of users facing the same problem. In both cases the problem seems to be related to the Segoe UI font:

Scene Builder Editor displaying weird characters

JavaFX Scene builder shows wired characters

edited Mar 30 '21 at 09:29

answered Mar 28 '21 at 19:01

user7291698

1,972
2
15
30

You're right! What could be an explanation? – Stephane Mar 29 '21 at 13:35
I'm still looking for an explanation. But I am pretty sure that it is NOT an encoding problem between cp1252 and utf-8, because these encodings have the affected letters at the same position. I updated my answer with another observation. – user7291698 Mar 29 '21 at 13:54
The Segoe UI font is working fine on my computer as I just tested it. – Stephane Mar 29 '21 at 19:27
That's strange, in other cases Segoe UI was the problem, see my updated answer. – user7291698 Mar 30 '21 at 09:29
1

thank you so much! it was related to the Segoe UI font! I removed the font family and installed a new one and it works now – Stephane Mar 30 '21 at 11:43

score 2 · Answer 2 · answered Jan 11 '22 at 22:16

2

Installing Segoe UI was a huge red herring for me. Instead, I changed the version of javafx defined in build.gradle to 17.0.1 and upgraded JavaFX to 16

answered Jan 11 '22 at 22:16

akasi311

43
5

This does not provide an answer to the question. Once you have sufficient [reputation](https://stackoverflow.com/help/whats-reputation) you will be able to [comment on any post](https://stackoverflow.com/help/privileges/comment); instead, [provide answers that don't require clarification from the asker](https://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can-i-do-instead). - [From Review](/review/late-answers/30795362) – Andres Gardiol Jan 14 '22 at 15:15
Upgrading from JavaFX 13 to 17 fixed the issue for me as well. I'm using JDK 17. – Ryan Michela Mar 02 '23 at 20:53

score 0 · Answer 3 · edited Nov 23 '21 at 07:03

I have also encountered this problem and after reading many forums I think I have a possible explanation and solution. The problem seems to be related to Mac users and Segoe UI;

I am guessing that because the font is used in Microsoft products, Macs are unable to render the font, even downloaded versions have not worked.

The simplest fix, which has worked for me so far, is to include style="-fx-font-family: serif" in the root node or add it in the controller or add

.root{
  -fx-font-family: serif
}

to your CSS. This works for any font in your system.

Why JavaFX application and scene builder is showing garbled text?

3 Answers3

Linked

Related