Bind Font Size in JavaFX?

Question

I\'d like to make my application fluid. However, the fonts look small compared to the UI elements when I make the windows bigger. Ultimately, I want the size of my text to g

Answer 1

Set the .root -fx-font-size

1. Create a custom stylesheet for your application.

2. In sylesheet .root selector, set -fx-font-size to your desired value:

   .root { -fx-font-size: 40px; }

Why this works

This works because:

1. All of the default controls are based on em units (which are based on the default font size).
2. -fx-font-size is an inherited style.
3. Everything inherits from the root.

Once you do this, all controls (and the text inside them) will automatically resize nicely to fit whatever font size you specified.

Related Sample

• javafx automatic resizing and button padding

Related Information

em is a generic unit that is not specific to JavaFX and em units are also used in HTML CSS. If interested, you can read a broader discussion on em units versus other units.

Using em units in FXML via expression binding

Just setting a default font size gets you about 90% of the way to where you need to be, but is not necessarily a universal fix as some layout units might be specified not using em units. Most of the time this isn't really an issue, but if it is in your case, you could also apply a mechanism described in an Oracle developer mailing list post, which appears to work, though is a little clunky.

How about using an expression binding.

For 35em x 25em you could write:

prefWidth="${35*u.em}" prefHeight="${25*u.em}"

It's not 100% concise, but perhaps passable.

These kind of sizing expressions work in scene builder 1.1, which is nice.

---

Here is an example using a Rectangle to store the width and height modifiers for the fxml file.

---

Or instead, you can create your own unit class and use it in your sizing expressions, for example:

package org.jewelsea.measure;

public class Measurement {
  private double em;
  public  void   setEm(double em) { this.em = em; }
  public  double getEm()          { return em; }
}

. . .