4. Fonts
4.1. MicroUI Fonts
MicroUI manages pixelated fonts (bitmap). These fonts have to be pre-generated at application compile time. The input font format is an internal MicroUI implementation format called EJF. The EJF fonts can be located in application ROM section or in an external flash memory (SDcard etc.). MicroUI implementation does not provide low level API to render a string with an EJF font.
![digraph {
rankdir=LR;
{
ttf [label="ttf", shape=note]
ejf [label="ejf", shape=note]
raw [label="raw", shape=note]
fd [label="Font Designer", shape=rect]
fg [label="Font Generator", shape=rect]
app [label="Application", shape=rect]
ge [label="Graphical Engine", shape=rect]
i [label="", image="images/applist_50.png", shape=plaintext]
}
subgraph flow {
ttf -> fd -> ejf -> fg -> raw -> app -> ge -> i
}
}](../_images/graphviz-7a1735ddd64bcb3afd509d28be07a7ed21df28e5.png)
To use a font as a MicroUI Font, the source font (ttf, jpg etc.) must be first converted in EJF format. Then the output file must be available in the MicroEJ application classpath. Then its path must be added in a file whose extension is .fonts.list. This file allows the MicroEJ platform to know which fonts have to be embedded.
Refers to the MicroEJ official documentation https://docs.microej.com/en/latest/ApplicationDeveloperGuide/classpath.html and https://docs.microej.com/en/latest/PlatformDeveloperGuide/fontGenerator.html to have more information about the MicroUI Font engine.
4.2. TrueType Fonts
TrueType is a vector font format that can be used in MicroEJ applications thanks to the VectorFont library.
The advantages of vector fonts are:
- there is no need to preprocess the font file;
- the font can take any size and opacity specified at runtime;
- transformations are easier to apply;
- gradient colors can be applied on them.
TrueType font can optionaly contain kerning information. Kerning is character spacing adjustment defined for couples
of character. For instance space between V
and A
in VA
is reduced.
Warning
TrueType Collection (TTC) files are not handled since VectorFont library only loads the first font face (for instance ArialRegular and ArialBold are two faces of font) from the file. There must be only one file per face.
TrueType font files (TTF) can be directely included as resources in the project to make them available in the application classpath.
Warning
The paths must be added in file whose extension is .resources.list
in order to be included in application
resources.
![digraph {
rankdir=LR;
{
ttf [label="ttf", shape=note]
app [label="Application", shape=rect]
ge [label="Graphical Engine", shape=rect]
i [label="", image="images/applist_50.png", shape=plaintext]
}
subgraph flow {
ttf -> app -> ge -> i
}
}](../_images/graphviz-ea119a76f0ad5ee988065837287747ffb740f739.png)
Text is rendered by the FreeType library which uses the VG Lite engine to render glyph shapes.