「App:Library:LVGL:docs:Widgets:Container (lv cont)」の版間の差分
18行目: | 18行目: | ||
!自動翻訳 | !自動翻訳 | ||
|- | |- | ||
− | |The containers has only a main style called <code>LV_CONT_PART_MAIN</code> and it can use all the typicaly bacground properties and padding for layout auto sizing. | + | |The containers has only a main style called <code style="color: #bb0000;">LV_CONT_PART_MAIN</code> and it can use all the typicaly bacground properties and padding for layout auto sizing. |
|コンテナには、LV_Cont_Part_Mainと呼ばれるメインスタイルのみがあり、レイアウトオートサイジングにはすべての典型的なバクグラウンドプロパティとパディングを使用できます。 | |コンテナには、LV_Cont_Part_Mainと呼ばれるメインスタイルのみがあり、レイアウトオートサイジングにはすべての典型的なバクグラウンドプロパティとパディングを使用できます。 | ||
|} | |} | ||
35行目: | 35行目: | ||
You can apply a layout on the containers to automatically order their children. | You can apply a layout on the containers to automatically order their children. | ||
− | The layout spacing comes from the style's <code>pad</code> properties. The possible layout options: | + | The layout spacing comes from the style's <code style="color: #bb0000;">pad</code> properties. The possible layout options: |
* LV_LAYOUT_OFF - Do not align the children. | * LV_LAYOUT_OFF - Do not align the children. | ||
− | * LV_LAYOUT_CENTER - Align children to the center in column and keep <code>pad_inner</code> space between them. | + | * LV_LAYOUT_CENTER - Align children to the center in column and keep <code style="color: #bb0000;">pad_inner</code> space between them. |
− | * LV_LAYOUT_COLUMN_LEFT - Align children in a left-justified column. Keep <code>pad_left</code> space on the left, <code>pad_top</code> space on the top and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_COLUMN_LEFT - Align children in a left-justified column. Keep <code style="color: #bb0000;">pad_left</code> space on the left, <code style="color: #bb0000;">pad_top</code> space on the top and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_COLUMN_MID - Align children in centered column. Keep <code>pad_top</code> space on the top and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_COLUMN_MID - Align children in centered column. Keep <code style="color: #bb0000;">pad_top</code> space on the top and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_COLUMN_RIGHT - Align children in a right-justified column. Keep <code>pad_right</code> space on the right, <code>pad_top</code> space on the top and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_COLUMN_RIGHT - Align children in a right-justified column. Keep <code style="color: #bb0000;">pad_right</code> space on the right, <code style="color: #bb0000;">pad_top</code> space on the top and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_ROW_TOP - Align children in a top justified row. Keep <code>pad_left</code> space on the left, <code>pad_top</code> space on the top and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_ROW_TOP - Align children in a top justified row. Keep <code style="color: #bb0000;">pad_left</code> space on the left, <code style="color: #bb0000;">pad_top</code> space on the top and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_ROW_MID - Align children in centered row. Keep <code>pad_left</code> space on the left and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_ROW_MID - Align children in centered row. Keep <code style="color: #bb0000;">pad_left</code> space on the left and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_ROW_BOTTOM - Align children in a bottom justified row. Keep <code>pad_left</code> space on the left, <code>pad_bottom</code> space on the bottom and <code>pad_inner</code> space between the children. | + | * LV_LAYOUT_ROW_BOTTOM - Align children in a bottom justified row. Keep <code style="color: #bb0000;">pad_left</code> space on the left, <code style="color: #bb0000;">pad_bottom</code> space on the bottom and <code style="color: #bb0000;">pad_inner</code> space between the children. |
− | * LV_LAYOUT_PRETTY_TOP - Put as many objects as possible in a row (with at least <code>pad_inner</code> space and <code>pad_left/right</code> space on the sides). Divide the space in each line equally between the children. If here are children with different height in a row align their top edge. | + | * LV_LAYOUT_PRETTY_TOP - Put as many objects as possible in a row (with at least <code style="color: #bb0000;">pad_inner</code> space and <code style="color: #bb0000;">pad_left/right</code> space on the sides). Divide the space in each line equally between the children. If here are children with different height in a row align their top edge. |
− | * LV_LAYOUT_PRETTY_MID - Same as <code>LV_LAYOUT_PRETTY_TOP</code> but if here are children with different height in a row align their middle line. | + | * LV_LAYOUT_PRETTY_MID - Same as <code style="color: #bb0000;">LV_LAYOUT_PRETTY_TOP</code> but if here are children with different height in a row align their middle line. |
− | * LV_LAYOUT_PRETTY_BOTTOM - Same as <code>LV_LAYOUT_PRETTY_TOP</code> but if here are children with different height in a row align their bottom line. | + | * LV_LAYOUT_PRETTY_BOTTOM - Same as <code style="color: #bb0000;">LV_LAYOUT_PRETTY_TOP</code> but if here are children with different height in a row align their bottom line. |
− | * LV_LAYOUT_GRID - Similar to <code>LV_LAYOUT_PRETTY</code> but not divide horizontal space equally just let <code>pad_left/right</code> on the edges and <code>pad_inner</code> space between the elements. | + | * LV_LAYOUT_GRID - Similar to <code style="color: #bb0000;">LV_LAYOUT_PRETTY</code> but not divide horizontal space equally just let <code style="color: #bb0000;">pad_left/right</code> on the edges and <code style="color: #bb0000;">pad_inner</code> space between the elements. |
|コンテナにレイアウトを適用して、子供を自動的に注文できます。 | |コンテナにレイアウトを適用して、子供を自動的に注文できます。 | ||
79行目: | 79行目: | ||
* '''LV_FIT_NONE''' - Do not change the size automatically. | * '''LV_FIT_NONE''' - Do not change the size automatically. | ||
− | * '''LV_FIT_TIGHT''' - Shrink-wrap the container around all of its children, while keeping <code>pad_top/bottom/left/right</code> space on the edges. | + | * '''LV_FIT_TIGHT''' - Shrink-wrap the container around all of its children, while keeping <code style="color: #bb0000;">pad_top/bottom/left/right</code> space on the edges. |
− | * '''LV_FIT_PARENT''' - Set the size to the parent's size minus <code>pad_top/bottom/left/right</code> (from the parent's style) space. | + | * '''LV_FIT_PARENT''' - Set the size to the parent's size minus <code style="color: #bb0000;">pad_top/bottom/left/right</code> (from the parent's style) space. |
− | * '''LV_FIT_MAX''' - Use <code>LV_FIT_PARENT</code> while smaller than the parent and <code>LV_FIT_TIGHT</code> when larger. It will ensure that the container is, at minimum, the size of its parent. | + | * '''LV_FIT_MAX''' - Use <code style="color: #bb0000;">LV_FIT_PARENT</code> while smaller than the parent and <code style="color: #bb0000;">LV_FIT_TIGHT</code> when larger. It will ensure that the container is, at minimum, the size of its parent. |
− | To set the auto fit mode for all directions, use <code>lv_cont_set_fit(cont, LV_FIT_...)</code>. | + | To set the auto fit mode for all directions, use <code style="color: #bb0000;">lv_cont_set_fit(cont, LV_FIT_...)</code>. |
− | To use different auto fit horizontally and vertically, use <code>lv_cont_set_fit2(cont, hor_fit_type, ver_fit_type)</code>. To use different auto fit in all 4 directions, use <code>lv_cont_set_fit4(cont, left_fit_type, right_fit_type, top_fit_type, bottom_fit_type)</code>. | + | To use different auto fit horizontally and vertically, use <code style="color: #bb0000;">lv_cont_set_fit2(cont, hor_fit_type, ver_fit_type)</code>. To use different auto fit in all 4 directions, use <code style="color: #bb0000;">lv_cont_set_fit4(cont, left_fit_type, right_fit_type, top_fit_type, bottom_fit_type)</code>. |
|コンテナには、子や親に応じてコンテナのサイズを自動的に変更できるオートフィット機能があります。 | |コンテナには、子や親に応じてコンテナのサイズを自動的に変更できるオートフィット機能があります。 | ||
2022年8月31日 (水) 16:01時点における版
https://docs.lvgl.io/latest/en/html/widgets/cont.html
Container (lv_cont)
Overview
英文 | 自動翻訳 |
---|---|
The containers are essentially a basic object with layout and automatic sizing features. | コンテナは、基本的にレイアウトと自動サイジング機能を備えた基本オブジェクトです。 |
Parts and Styles
英文 | 自動翻訳 |
---|---|
The containers has only a main style called LV_CONT_PART_MAIN and it can use all the typicaly bacground properties and padding for layout auto sizing.
|
コンテナには、LV_Cont_Part_Mainと呼ばれるメインスタイルのみがあり、レイアウトオートサイジングにはすべての典型的なバクグラウンドプロパティとパディングを使用できます。 |
Usage
Layout
英文 | 自動翻訳 |
---|---|
The layout spacing comes from the style's
|
コンテナにレイアウトを適用して、子供を自動的に注文できます。
レイアウト間隔は、スタイルのパッドプロパティに由来します。可能なレイアウトオプション:
|
Autofit
英文 | 自動翻訳 |
---|---|
Container have an autofit feature which can automatically change the size of the container according to its children and/or its parent.
The following options exist:
To use different auto fit horizontally and vertically, use |
コンテナには、子や親に応じてコンテナのサイズを自動的に変更できるオートフィット機能があります。
次のオプションが存在します:
さまざまな自動適合を水平および垂直に使用するには、lv_cont_set_fit2(cont、hor_fit_type、ver_fit_type)を使用します。 4つの方向すべてで異なるオートフィットを使用するには、lv_cont_set_fit4(cont、left_fit_type、right_fit_type、top_fit_type、botond_fit_type)を使用します。 |
Events
英文 | 自動翻訳 |
---|---|
Only the Generic events are sent by the object type.
|
オブジェクトタイプでは、Generic eventsのみが送信されます。
|
Keys
英文 | 自動翻訳 |
---|---|
No Keys are processed by the object type.
|
オブジェクトタイプで処理されるキーはありません。
|