「App:Library:LVGL:docs:Overview:Fonts」の版間の差分

提供: robot-jp wiki
ナビゲーションに移動検索に移動
(ページの作成:「https://docs.lvgl.io/8.2/overview/style.html __NOTOC__ {| class="wikitable" !英文 !自動翻訳 |- | | |} :戻る : Previous」)
 
9行目: 9行目:
 
|}
 
|}
  
 +
 +
 +
= Fonts =
 +
In LVGL fonts are collections of bitmaps and other information required to render images of individual letters (glyph). A font is stored in a <code>lv_font_t</code> variable and can be set in a style's ''text_font'' field. For example:
 +
lv_style_set_text_font(&my_style, &lv_font_montserrat_28);  /*Set a larger font*/
 +
Fonts have a bpp (bits per pixel) property. It shows how many bits are used to describe a pixel in a font. The value stored for a pixel determines the pixel's opacity. This way, with higher ''bpp'', the edges of the letter can be smoother. The possible ''bpp'' values are 1, 2, 4 and 8 (higher values mean better quality).
 +
 +
The ''bpp'' property also affects the amount of memory needed to store a font. For example, ''bpp = 4'' makes a font nearly four times larger compared to ''bpp = 1''.
 +
 +
== Unicode support ==
 +
LVGL supports UTF-8 encoded Unicode characters. Your editor needs to be configured to save your code/text as UTF-8 (usually this the default) and be sure that, <code>LV_TXT_ENC</code> is set to <code>LV_TXT_ENC_UTF8</code> in ''lv_conf.h''. (This is the default value)
 +
 +
To test it try
 +
lv_obj_t * label1 = lv_label_create(lv_scr_act(), NULL);
 +
lv_label_set_text(label1, LV_SYMBOL_OK);
 +
If all works well, a ✓ character should be displayed.
 +
 +
== Built-in fonts ==
 +
There are several built-in fonts in different sizes, which can be enabled in <code>lv_conf.h</code> with ''LV_FONT_...'' defines.
 +
 +
=== Normal fonts ===
 +
Containing all the ASCII characters, the degree symbol (U+00B0), the bullet symbol (U+2022) and the built-in symbols (see below).
 +
 +
* <code>LV_FONT_MONTSERRAT_12</code> 12 px font
 +
* <code>LV_FONT_MONTSERRAT_14</code> 14 px font
 +
* <code>LV_FONT_MONTSERRAT_16</code> 16 px font
 +
* <code>LV_FONT_MONTSERRAT_18</code> 18 px font
 +
* <code>LV_FONT_MONTSERRAT_20</code> 20 px font
 +
* <code>LV_FONT_MONTSERRAT_22</code> 22 px font
 +
* <code>LV_FONT_MONTSERRAT_24</code> 24 px font
 +
* <code>LV_FONT_MONTSERRAT_26</code> 26 px font
 +
* <code>LV_FONT_MONTSERRAT_28</code> 28 px font
 +
* <code>LV_FONT_MONTSERRAT_30</code> 30 px font
 +
* <code>LV_FONT_MONTSERRAT_32</code> 32 px font
 +
* <code>LV_FONT_MONTSERRAT_34</code> 34 px font
 +
* <code>LV_FONT_MONTSERRAT_36</code> 36 px font
 +
* <code>LV_FONT_MONTSERRAT_38</code> 38 px font
 +
* <code>LV_FONT_MONTSERRAT_40</code> 40 px font
 +
* <code>LV_FONT_MONTSERRAT_42</code> 42 px font
 +
* <code>LV_FONT_MONTSERRAT_44</code> 44 px font
 +
* <code>LV_FONT_MONTSERRAT_46</code> 46 px font
 +
* <code>LV_FONT_MONTSERRAT_48</code> 48 px font
 +
 +
=== Special fonts ===
 +
 +
* <code>LV_FONT_MONTSERRAT_12_SUBPX</code> Same as normal 12 px font but with subpixel rendering
 +
* <code>LV_FONT_MONTSERRAT_28_COMPRESSED</code> Same as normal 28 px font but stored as a compressed font with 3 bpp
 +
* <code>LV_FONT_DEJAVU_16_PERSIAN_HEBREW</code> 16 px font with normal range + Hebrew, Arabic, Persian letters and all their forms
 +
* <code>LV_FONT_SIMSUN_16_CJK</code>16 px font with normal range plus 1000 of the most common CJK radicals
 +
* <code>LV_FONT_UNSCII_8</code> 8 px pixel perfect font with only ASCII characters
 +
* <code>LV_FONT_UNSCII_16</code> 16 px pixel perfect font with only ASCII characters
 +
 +
The built-in fonts are global variables with names like <code>lv_font_montserrat_16</code> for a 16 px height font. To use them in a style, just add a pointer to a font variable like shown above.
 +
 +
The built-in fonts with ''bpp = 4'' contain the ASCII characters and use the Montserrat font.
 +
 +
In addition to the ASCII range, the following symbols are also added to the built-in fonts from the FontAwesome font.
 +
 +
The symbols can be used singly as:
 +
lv_label_set_text(my_label, LV_SYMBOL_OK);
 +
Or with together with strings (compile time string concatenation):
 +
lv_label_set_text(my_label, LV_SYMBOL_OK "Apply");
 +
Or more symbols together:
 +
lv_label_set_text(my_label, LV_SYMBOL_OK LV_SYMBOL_WIFI LV_SYMBOL_PLAY);
 +
 +
== Special features ==
 +
 +
=== Bidirectional support ===
 +
Most languages use a Left-to-Right (LTR for short) writing direction, however some languages (such as Hebrew, Persian or Arabic) use Right-to-Left (RTL for short) direction.
 +
 +
LVGL not only supports RTL texts but supports mixed (a.k.a. bidirectional, BiDi) text rendering too. Some examples:
 +
 +
BiDi support is enabled by <code>LV_USE_BIDI</code> in ''lv_conf.h''
 +
 +
All texts have a base direction (LTR or RTL) which determines some rendering rules and the default alignment of the text (Left or Right). However, in LVGL, the base direction is not only applied to labels. It's a general property which can be set for every object. If not set then it will be inherited from the parent. This means it's enough to set the base direction of a screen and every object will inherit it.
 +
 +
The default base direction for screens can be set by <code>LV_BIDI_BASE_DIR_DEF</code> in ''lv_conf.h'' and other objects inherit the base direction from their parent.
 +
 +
To set an object's base direction use <code>lv_obj_set_base_dir(obj, base_dir)</code>. The possible base directions are:
 +
 +
* <code>LV_BIDI_DIR_LTR</code>: Left to Right base direction
 +
* <code>LV_BIDI_DIR_RTL</code>: Right to Left base direction
 +
* <code>LV_BIDI_DIR_AUTO</code>: Auto detect base direction
 +
* <code>LV_BIDI_DIR_INHERIT</code>: Inherit base direction from the parent (or a default value for non-screen objects)
 +
 +
This list summarizes the effect of RTL base direction on objects:
  
  

2022年6月27日 (月) 10:33時点における版

https://docs.lvgl.io/8.2/overview/style.html

英文 自動翻訳


Fonts

In LVGL fonts are collections of bitmaps and other information required to render images of individual letters (glyph). A font is stored in a lv_font_t variable and can be set in a style's text_font field. For example:

lv_style_set_text_font(&my_style, &lv_font_montserrat_28);  /*Set a larger font*/

Fonts have a bpp (bits per pixel) property. It shows how many bits are used to describe a pixel in a font. The value stored for a pixel determines the pixel's opacity. This way, with higher bpp, the edges of the letter can be smoother. The possible bpp values are 1, 2, 4 and 8 (higher values mean better quality).

The bpp property also affects the amount of memory needed to store a font. For example, bpp = 4 makes a font nearly four times larger compared to bpp = 1.

Unicode support

LVGL supports UTF-8 encoded Unicode characters. Your editor needs to be configured to save your code/text as UTF-8 (usually this the default) and be sure that, LV_TXT_ENC is set to LV_TXT_ENC_UTF8 in lv_conf.h. (This is the default value)

To test it try

lv_obj_t * label1 = lv_label_create(lv_scr_act(), NULL);
lv_label_set_text(label1, LV_SYMBOL_OK);

If all works well, a ✓ character should be displayed.

Built-in fonts

There are several built-in fonts in different sizes, which can be enabled in lv_conf.h with LV_FONT_... defines.

Normal fonts

Containing all the ASCII characters, the degree symbol (U+00B0), the bullet symbol (U+2022) and the built-in symbols (see below).

  • LV_FONT_MONTSERRAT_12 12 px font
  • LV_FONT_MONTSERRAT_14 14 px font
  • LV_FONT_MONTSERRAT_16 16 px font
  • LV_FONT_MONTSERRAT_18 18 px font
  • LV_FONT_MONTSERRAT_20 20 px font
  • LV_FONT_MONTSERRAT_22 22 px font
  • LV_FONT_MONTSERRAT_24 24 px font
  • LV_FONT_MONTSERRAT_26 26 px font
  • LV_FONT_MONTSERRAT_28 28 px font
  • LV_FONT_MONTSERRAT_30 30 px font
  • LV_FONT_MONTSERRAT_32 32 px font
  • LV_FONT_MONTSERRAT_34 34 px font
  • LV_FONT_MONTSERRAT_36 36 px font
  • LV_FONT_MONTSERRAT_38 38 px font
  • LV_FONT_MONTSERRAT_40 40 px font
  • LV_FONT_MONTSERRAT_42 42 px font
  • LV_FONT_MONTSERRAT_44 44 px font
  • LV_FONT_MONTSERRAT_46 46 px font
  • LV_FONT_MONTSERRAT_48 48 px font

Special fonts

  • LV_FONT_MONTSERRAT_12_SUBPX Same as normal 12 px font but with subpixel rendering
  • LV_FONT_MONTSERRAT_28_COMPRESSED Same as normal 28 px font but stored as a compressed font with 3 bpp
  • LV_FONT_DEJAVU_16_PERSIAN_HEBREW 16 px font with normal range + Hebrew, Arabic, Persian letters and all their forms
  • LV_FONT_SIMSUN_16_CJK16 px font with normal range plus 1000 of the most common CJK radicals
  • LV_FONT_UNSCII_8 8 px pixel perfect font with only ASCII characters
  • LV_FONT_UNSCII_16 16 px pixel perfect font with only ASCII characters

The built-in fonts are global variables with names like lv_font_montserrat_16 for a 16 px height font. To use them in a style, just add a pointer to a font variable like shown above.

The built-in fonts with bpp = 4 contain the ASCII characters and use the Montserrat font.

In addition to the ASCII range, the following symbols are also added to the built-in fonts from the FontAwesome font.

The symbols can be used singly as:

lv_label_set_text(my_label, LV_SYMBOL_OK);

Or with together with strings (compile time string concatenation):

lv_label_set_text(my_label, LV_SYMBOL_OK "Apply");

Or more symbols together:

lv_label_set_text(my_label, LV_SYMBOL_OK LV_SYMBOL_WIFI LV_SYMBOL_PLAY);

Special features

Bidirectional support

Most languages use a Left-to-Right (LTR for short) writing direction, however some languages (such as Hebrew, Persian or Arabic) use Right-to-Left (RTL for short) direction.

LVGL not only supports RTL texts but supports mixed (a.k.a. bidirectional, BiDi) text rendering too. Some examples:

BiDi support is enabled by LV_USE_BIDI in lv_conf.h

All texts have a base direction (LTR or RTL) which determines some rendering rules and the default alignment of the text (Left or Right). However, in LVGL, the base direction is not only applied to labels. It's a general property which can be set for every object. If not set then it will be inherited from the parent. This means it's enough to set the base direction of a screen and every object will inherit it.

The default base direction for screens can be set by LV_BIDI_BASE_DIR_DEF in lv_conf.h and other objects inherit the base direction from their parent.

To set an object's base direction use lv_obj_set_base_dir(obj, base_dir). The possible base directions are:

  • LV_BIDI_DIR_LTR: Left to Right base direction
  • LV_BIDI_DIR_RTL: Right to Left base direction
  • LV_BIDI_DIR_AUTO: Auto detect base direction
  • LV_BIDI_DIR_INHERIT: Inherit base direction from the parent (or a default value for non-screen objects)

This list summarizes the effect of RTL base direction on objects:






戻る : Previous