#Fonts

Selection of fonts available to any Swing application is dependent on the platform it is running on. A different set of fonts is available on a Windows system and different on a Linux system. To ensure the user experience is consistent, Webswing provides an option to configure which fonts will be available for each Swing application.

Font are configured in webswing.config file as described above. This is how the configuration looks:

  "fontConfig" : {
      "dialog" : "${user.dir}/fonts/Roboto-Regular.ttf",
      "dialoginput" : "${user.dir}/fonts/RobotoMono-Regular.ttf",
      "serif" : "${user.dir}/fonts/RobotoSlab-Regular.ttf"
    },

If you omit this setting or no fonts are defined, Webswing will use the default platform specific settings.

If this setting is present, only fonts defined in this property file will be available to your Swing application.

Font settings are important when DirectDraw rendering is enabled. DirectDraw will transfer configured fonts to browser (when used for the first time) and use them as native fonts.

Using too many or too large fonts may result in rendering delays.

If fonts are not configured, Webswing will use default browser fonts for rendering logical font families ( dialog, dialoginput, sansserif, serif, monospaced) and less efficient Glyph rendering for other fonts.

#Provide fonts in CSS

To optimize loading fonts from server you can preload fonts using CSS. This option is available only when using DirectDraw rendering. To enable font preloading add startup parameter -Ddirectdraw.fontsProvided=true to vmArgs property in your application configuration. Next you have to add a custom.css file to your custom index.html (see Customization) which will contain the CSS styles for the fonts:

@font-face {
  font-family: "arial-unicode-ms.ttf";
  src: url("fonts/arial-unicode-ms.ttf");
}

@font-face {
  font-family: "arial.ttf";
  src: url("fonts/arial.ttf");
}

Make sure the font files are in your application webFolder and accessible. Finally add this div to your custom index.html to force browser to download the font files:

<div id="webswing-font-preload" style="position: fixed; color: transparent;">
    <span style="font-family: 'arial-unicode-ms.ttf';">a</span>
    <span style="font-family: 'arial.ttf';">a</span>
</div>

#Embed fonts in PDF

When printing with Webswing print service the resulting PDF draws custom fonts as shapes. This results in PDF being larger in size and also not being able to select rendered text. To fix this, you can enable "fontEmbeddingEnabled": true in app config. This will make sure that the font files defined in font config are included in the PDF and that PDF renders selectable text. Embedding fonts also reduces the PDF size.