「App:Library:LVGL:docs:Layouts:Grid」の版間の差分
(→API) |
|||
(同じ利用者による、間の12版が非表示) | |||
1行目: | 1行目: | ||
https://docs.lvgl.io/8.2/widgets/index.html | https://docs.lvgl.io/8.2/widgets/index.html | ||
__NOTOC__ | __NOTOC__ | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
= Grid = | = Grid = | ||
− | |||
== Overview == | == Overview == | ||
{| class="wikitable" | {| class="wikitable" | ||
24行目: | 15行目: | ||
Note that the grid layout feature of LVGL needs to be globally enabled with <code style="color: #bb0000;">LV_USE_GRID</code> in <code style="color: #bb0000;">lv_conf.h</code>. | Note that the grid layout feature of LVGL needs to be globally enabled with <code style="color: #bb0000;">LV_USE_GRID</code> in <code style="color: #bb0000;">lv_conf.h</code>. | ||
− | | | + | |グリッドレイアウトは'''CSSFlexbox'''のサブセットです。 |
+ | |||
+ | 行または列(トラック)を持つ2D「テーブル」にアイテムを配置できます。アイテムは、複数の列または行にまたがることができます。トラックのサイズは、ピクセル単位、最大項目(<code style="color: #bb0000;">LV_GRID_CONTENT</code>)、または「空き単位」(FR)で設定して、空き領域を比例配分することができます。 | ||
+ | |||
+ | オブジェクトをグリッドコンテナにするには、<code style="color: #bb0000;">lv_obj_set_layout(obj, LV_LAYOUT_GRID)</code>を呼び出します。 | ||
+ | |||
+ | LVGLのグリッドレイアウト機能は、<code style="color: #bb0000;">lv_conf.h</code>の中の<code style="color: #bb0000;">LV_USE_GRID</code>でグローバルに有効にする必要があることに注意してください。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
38行目: | 36行目: | ||
* gap: the space between the rows and columns or the items on a track | * gap: the space between the rows and columns or the items on a track | ||
| | | | ||
+ | * トラック:行または列 | ||
+ | * フリーユニット(FR):トラックのサイズが<code style="color: #bb0000;">FR</code>で設定されている場合、親の残りのスペースを埋めるためにトラックが大きくなります。 | ||
+ | * ギャップ:行と列の間のスペース、またはトラック上のアイテム | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
48行目: | 50行目: | ||
| | | | ||
With the following functions you can easily set a Grid layout on any parent. | With the following functions you can easily set a Grid layout on any parent. | ||
− | | | + | |次の関数を使用すると、任意の親にグリッドレイアウトを簡単に設定できます。 |
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
58行目: | 61行目: | ||
|- | |- | ||
| | | | ||
− | First you need to describe the size of rows and columns. It can be done by declaring 2 arrays and the track sizes in them. The last element must be <code style="color: #bb0000;">LV_GRID_TEMPLATE_LAST</code>. | + | First you need to describe the size of rows and columns. It can be done by declaring 2 arrays and the track sizes in them. |
+ | |||
+ | The last element must be <code style="color: #bb0000;">LV_GRID_TEMPLATE_LAST</code>. | ||
For example: | For example: | ||
+ | <syntaxhighlight lang="C++" style="border: 1px dashed gray;"> | ||
static lv_coord_t column_dsc[] = {100, 400, LV_GRID_TEMPLATE_LAST}; /*2 columns with 100 and 400 ps width*/ | static lv_coord_t column_dsc[] = {100, 400, LV_GRID_TEMPLATE_LAST}; /*2 columns with 100 and 400 ps width*/ | ||
static lv_coord_t row_dsc[] = {100, 100, 100, LV_GRID_TEMPLATE_LAST}; /*3 100 px tall rows*/ | static lv_coord_t row_dsc[] = {100, 100, 100, LV_GRID_TEMPLATE_LAST}; /*3 100 px tall rows*/ | ||
+ | </syntaxhighlight> | ||
To set the descriptors on a parent use <code style="color: #bb0000;">lv_obj_set_grid_dsc_array(obj, col_dsc, row_dsc)</code>. | To set the descriptors on a parent use <code style="color: #bb0000;">lv_obj_set_grid_dsc_array(obj, col_dsc, row_dsc)</code>. | ||
70行目: | 77行目: | ||
* <code style="color: #bb0000;">LV_GRID_FR(X)</code> tell what portion of the remaining space should be used by this track. Larger value means larger space. | * <code style="color: #bb0000;">LV_GRID_FR(X)</code> tell what portion of the remaining space should be used by this track. Larger value means larger space. | ||
| | | | ||
+ | |||
+ | |||
+ | |||
+ | まず、行と列のサイズを説明する必要があります。これは、2つの配列とその中のトラックサイズを宣言することで実行できます。 | ||
+ | |||
+ | 最後の要素は<code style="color: #bb0000;">LV_GRID_TEMPLATE_LAST</code>である必要があります。 | ||
+ | |||
+ | 例えば: | ||
+ | <syntaxhighlight lang="C++" style="border: 1px dashed gray;"> | ||
+ | static lv_coord_t column_dsc [] = {100、400、LV_GRID_TEMPLATE_LAST}; /*100および400ps幅の2列*/ | ||
+ | static lv_coord_t row_dsc [] = {100、100、100、LV_GRID_TEMPLATE_LAST}; / *3100ピクセルの高さの行*/ | ||
+ | </syntaxhighlight> | ||
+ | 親に記述子を設定するには、<code style="color: #bb0000;">lv_obj_set_grid_dsc_array(obj, col_dsc, row_dsc)</code>を使用します。 | ||
+ | |||
+ | ピクセル単位のサイズの簡単な設定に加えて、2つの特別な値を使用できます。 | ||
+ | |||
+ | * <code style="color: #bb0000;">LV_GRID_CONTENT</code>このトラックで最大の子に幅を設定します | ||
+ | * <code style="color: #bb0000;">LV_GRID_FR(X)</code>残りのスペースのどの部分をこのトラックで使用するかを指定します。値が大きいほど、スペースが大きくなります。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
88行目: | 114行目: | ||
* <code style="color: #bb0000;">LV_GRID_ALIGN_END</code> means right on a horizontally and bottom vertically | * <code style="color: #bb0000;">LV_GRID_ALIGN_END</code> means right on a horizontally and bottom vertically | ||
* <code style="color: #bb0000;">LV_GRID_ALIGN_CENTER</code> simply center | * <code style="color: #bb0000;">LV_GRID_ALIGN_CENTER</code> simply center | ||
+ | |||
<code style="color: #bb0000;">colum_pos</code> and <code style="color: #bb0000;">row_pos</code> means the zero based index of the cell into the item should be placed. | <code style="color: #bb0000;">colum_pos</code> and <code style="color: #bb0000;">row_pos</code> means the zero based index of the cell into the item should be placed. | ||
<code style="color: #bb0000;">colum_span</code> and <code style="color: #bb0000;">row_span</code> means how many tracks should the item involve from the start cell. Must be > 1. | <code style="color: #bb0000;">colum_span</code> and <code style="color: #bb0000;">row_span</code> means how many tracks should the item involve from the start cell. Must be > 1. | ||
− | | | + | |デフォルトでは、子はグリッドに追加されません。それらは手動でセルに追加する必要があります。 |
+ | |||
+ | |||
+ | これを行うには<code style="color: #bb0000;">lv_obj_set_grid_cell(child, column_align, column_pos, column_span, row_align, row_pos, row_span)</code>を呼び出します。 | ||
+ | |||
+ | |||
+ | <code style="color: #bb0000;">column_align</code>と<code style="color: #bb0000;">row_align</code>は、セル内の子を整列させる方法を決定します。可能な値は次のとおりです。 | ||
+ | |||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_START</code>水平に左に、垂直に上に置くことを意味します。(デフォルト) | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_END</code>水平方向に右、垂直方向に下を意味します | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_CENTER</code>単に中央に配置する | ||
+ | |||
+ | |||
+ | <code style="color: #bb0000;">colum_pos</code>と<code style="color: #bb0000;">row_pos</code>はアイテムへのセルのゼロベースのインデックスを配置する必要があることを意味します 。 | ||
+ | |||
+ | |||
+ | <code style="color: #bb0000;">colum_span</code>と<code style="color: #bb0000;">row_span</code>はアイテムが開始セルからいくつのトラックを含むべきかを意味します。>1である必要があります。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
110行目: | 154行目: | ||
* <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_AROUND</code> items are evenly distributed in the track with equal space around them. Note that visually the spaces aren’t equal, since all the items have equal space on both sides. The first item will have one unit of space against the container edge, but two units of space between the next item because that next item has its own spacing that applies. Not applies to <code style="color: #bb0000;">track_cross_place</code>. | * <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_AROUND</code> items are evenly distributed in the track with equal space around them. Note that visually the spaces aren’t equal, since all the items have equal space on both sides. The first item will have one unit of space against the container edge, but two units of space between the next item because that next item has its own spacing that applies. Not applies to <code style="color: #bb0000;">track_cross_place</code>. | ||
* <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_BETWEEN</code> items are evenly distributed in the track: first item is on the start line, last item on the end line. Not applies to <code style="color: #bb0000;">track_cross_place</code>. | * <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_BETWEEN</code> items are evenly distributed in the track: first item is on the start line, last item on the end line. Not applies to <code style="color: #bb0000;">track_cross_place</code>. | ||
+ | |||
To set the track's alignment use <code style="color: #bb0000;">lv_obj_set_grid_align(obj, column_align, row_align)</code>. | To set the track's alignment use <code style="color: #bb0000;">lv_obj_set_grid_align(obj, column_align, row_align)</code>. | ||
− | | | + | |空きスペースがある場合は、トラックをいくつかの方法で整列させることができます。 |
+ | |||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_START</code>水平に左に、垂直に上に置くことを意味します。(デフォルト) | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_END</code>水平方向に右、垂直方向に下を意味します | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_CENTER</code>単に中央に配置する | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_EVENLY</code>アイテムは、任意の2つのアイテム間の間隔(およびエッジまでのスペース)が等しくなるように分散されます。には適用されません<code style="color: #bb0000;">track_cross_place</code>。 | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_AROUND</code>アイテムは、トラック内に均等に配置され、周囲に等間隔で配置されます。すべてのアイテムの両側に等しいスペースがあるため、視覚的にはスペースが等しくないことに注意してください。最初のアイテムには、コンテナの端に対して1単位のスペースがありますが、次のアイテムには独自の間隔が適用されるため、次のアイテムの間に2単位のスペースがあります。には適用されません<code style="color: #bb0000;">track_cross_place</code>。 | ||
+ | * <code style="color: #bb0000;">LV_GRID_ALIGN_SPACE_BETWEEN</code>アイテムはトラックに均等に分散されます。最初のアイテムはスタートラインにあり、最後のアイテムはエンドラインにあります。には適用されません<code style="color: #bb0000;">track_cross_place</code>。 | ||
+ | |||
+ | |||
+ | トラックの配置を設定するには、<code style="color: #bb0000;">lv_obj_set_grid_align(obj, column_align, row_align)</code>を使用します。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
135行目: | 191行目: | ||
* <code style="color: #bb0000;">GRID_CELL_ROW_SPAN</code> | * <code style="color: #bb0000;">GRID_CELL_ROW_SPAN</code> | ||
| | | | ||
+ | グリッドに関連するすべての値は、内部のスタイルプロパティであり、他のスタイルプロパティと同様に使用できます。次のグリッド関連のスタイルプロパティが存在します。 | ||
+ | |||
+ | * <code style="color: #bb0000;">GRID_COLUMN_DSC_ARRAY</code> | ||
+ | * <code style="color: #bb0000;">GRID_ROW_DSC_ARRAY</code> | ||
+ | * <code style="color: #bb0000;">GRID_COLUMN_ALIGN</code> | ||
+ | * <code style="color: #bb0000;">GRID_ROW_ALIGN</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_X_ALIGN</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_COLUMN_POS</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_COLUMN_SPAN</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_Y_ALIGN</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_ROW_POS</code> | ||
+ | * <code style="color: #bb0000;">GRID_CELL_ROW_SPAN</code> | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
148行目: | 217行目: | ||
* <code style="color: #bb0000;">pad_row</code> Sets the padding between the rows. | * <code style="color: #bb0000;">pad_row</code> Sets the padding between the rows. | ||
* <code style="color: #bb0000;">pad_column</code> Sets the padding between the columns. | * <code style="color: #bb0000;">pad_column</code> Sets the padding between the columns. | ||
+ | | | ||
+ | オブジェクト間にグリッドが挿入する最小スペースを変更するには、グリッドコンテナスタイルに次のプロパティを設定できます。 | ||
+ | |||
+ | * <code style="color: #bb0000;">pad_row</code>行間のパディングを設定します。 | ||
+ | * <code style="color: #bb0000;">pad_column</code>列間のパディングを設定します。 | ||
+ | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
+ | |||
== Other features == | == Other features == | ||
159行目: | 236行目: | ||
The columns will be placed from right to left. | The columns will be placed from right to left. | ||
− | | | + | |コンテナのベース方向が<code style="color: #bb0000;">LV_BASE_DIR_RTL</code>に設定されている場合、<code style="color: #bb0000;">LV_GRID_ALIGN_STAR</code>と<code style="color: #bb0000;">TLV_GRID_ALIGN_END</code>の意味が入れ替わります。つまり、<code style="color: #bb0000;">START</code>は右端を意味します。 |
+ | |||
+ | 列は右から左に配置されます。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
173行目: | 253行目: | ||
| | | | ||
|- | |- | ||
+ | | | ||
=== Demonstrate cell placement and span === | === Demonstrate cell placement and span === | ||
[[file:LVGL docs example 031.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-cell-placement-and-span]] | [[file:LVGL docs example 031.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-cell-placement-and-span]] | ||
| | | | ||
|- | |- | ||
+ | | | ||
=== Demonstrate grid's "free unit" === | === Demonstrate grid's "free unit" === | ||
[[file:LVGL docs example 032.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-grid-s-free-unit]] | [[file:LVGL docs example 032.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-grid-s-free-unit]] | ||
| | | | ||
|- | |- | ||
+ | | | ||
=== Demonstrate track placement === | === Demonstrate track placement === | ||
[[file:LVGL docs example 033.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-track-placement]] | [[file:LVGL docs example 033.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-track-placement]] | ||
| | | | ||
|- | |- | ||
+ | | | ||
=== Demonstrate column and row gap === | === Demonstrate column and row gap === | ||
[[file:LVGL docs example 034.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-column-and-row-gap]] | [[file:LVGL docs example 034.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-column-and-row-gap]] | ||
| | | | ||
|- | |- | ||
+ | | | ||
=== Demonstrate RTL direction on grid === | === Demonstrate RTL direction on grid === | ||
[[file:LVGL docs example 035.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-rtl-direction-on-grid]] | [[file:LVGL docs example 035.png|link=https://docs.lvgl.io/8.2/layouts/grid.html#demonstrate-rtl-direction-on-grid]] | ||
| | | | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
201行目: | 287行目: | ||
|- | |- | ||
| | | | ||
− | Enums | + | '''Enums''' |
− | ; | + | <span style="background-color: #e7f2fa; color: #2980b9;">enum '''lv_grid_align_t''' </span> |
: ''Values:'' | : ''Values:'' | ||
− | :; enumerator LV_GRID_ALIGN_START | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_START </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_CENTER | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_CENTER </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_END | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_END </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_STRETCH | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_STRETCH </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_SPACE_EVENLY | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_SPACE_EVENLY </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_SPACE_AROUND | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_SPACE_AROUND </span> |
:: | :: | ||
− | :; enumerator LV_GRID_ALIGN_SPACE_BETWEEN | + | :<span style="background-color: #eeeeee;">enumerator LV_GRID_ALIGN_SPACE_BETWEEN </span> |
:: | :: | ||
− | Functions | + | '''Functions''' |
− | ; LV_EXPORT_CONST_INT(LV_GRID_CONTENT) | + | <span style="background-color: #e7f2fa; color: #2980b9;">LV_EXPORT_CONST_INT(LV_GRID_CONTENT) </span> |
: | : | ||
− | ; LV_EXPORT_CONST_INT(LV_GRID_TEMPLATE_LAST) | + | <span style="background-color: #e7f2fa; color: #2980b9;">LV_EXPORT_CONST_INT(LV_GRID_TEMPLATE_LAST) </span> |
: | : | ||
− | ; void lv_grid_init(void) | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_grid_init(void) </span> |
: | : | ||
− | ; void lv_obj_set_grid_dsc_array( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_grid_dsc_array( *obj, const lv_coord_t col_dsc[], const lv_coord_t row_dsc[]) </span> |
: | : | ||
− | ; void lv_obj_set_grid_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_grid_align( *obj, column_align, row_align)</span> |
: | : | ||
− | ; void lv_obj_set_grid_cell( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_grid_cell( *obj, column_align, uint8_t col_pos, uint8_t col_span, row_align, uint8_t row_pos, uint8_t row_span) </span> |
: Set the cell of an object. The object's parent needs to have grid layout, else nothing will happen | : Set the cell of an object. The object's parent needs to have grid layout, else nothing will happen | ||
− | : | + | :Parameters |
::* obj -- pointer to an object | ::* obj -- pointer to an object | ||
::* column_align -- the vertical alignment in the cell. <code style="color: #bb0000;">LV_GRID_START/END/CENTER/STRETCH</code> | ::* column_align -- the vertical alignment in the cell. <code style="color: #bb0000;">LV_GRID_START/END/CENTER/STRETCH</code> | ||
248行目: | 334行目: | ||
::* row_span -- number of rows to take (>= 1) | ::* row_span -- number of rows to take (>= 1) | ||
− | ; static inline lv_coord_t lv_grid_fr(uint8_t x) | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_grid_fr(uint8_t x) </span> |
: Just a wrapper to <code style="color: #bb0000;">LV_GRID_FR</code> for bindings. | : Just a wrapper to <code style="color: #bb0000;">LV_GRID_FR</code> for bindings. | ||
− | ; void lv_style_set_grid_row_dsc_array( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_row_dsc_array( *style, const lv_coord_t value[])</span> |
: | : | ||
− | ; void lv_style_set_grid_column_dsc_array( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_column_dsc_array( *style, const lv_coord_t value[]) </span> |
: | : | ||
− | ; void lv_style_set_grid_row_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_row_align( *style, value) </span> |
: | : | ||
− | ; void lv_style_set_grid_column_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_column_align( *style, value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_column_pos( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_column_pos( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_column_span( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_column_span( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_row_pos( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_row_pos( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_row_span( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_row_span( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_x_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_x_align( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_style_set_grid_cell_y_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_style_set_grid_cell_y_align( *style, lv_coord_t value) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_row_dsc_array( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_row_dsc_array( *obj, const lv_coord_t value[], lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_column_dsc_array( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_column_dsc_array( *obj, const lv_coord_t value[], lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_row_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_row_align( *obj, value, lv_style_selector_t selector)</span> |
: | : | ||
− | ; void lv_obj_set_style_grid_column_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_column_align( *obj, value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_column_pos( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_column_pos( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_column_span( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_column_span( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_row_pos( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_row_pos( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_row_span( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_row_span( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_x_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_x_align( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; void lv_obj_set_style_grid_cell_y_align( | + | <span style="background-color: #e7f2fa; color: #2980b9;">void lv_obj_set_style_grid_cell_y_align( *obj, lv_coord_t value, lv_style_selector_t selector) </span> |
: | : | ||
− | ; static inline const lv_coord_t *lv_obj_get_style_grid_row_dsc_array(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline const lv_coord_t *lv_obj_get_style_grid_row_dsc_array(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline const lv_coord_t *lv_obj_get_style_grid_column_dsc_array(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline const lv_coord_t *lv_obj_get_style_grid_column_dsc_array(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_obj_get_style_grid_row_align(const *obj, uint32_t part) |
: | : | ||
− | ; static inline | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_obj_get_style_grid_column_align(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const *obj, uint32_t part) </span> |
: | : | ||
− | ; static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const | + | <span style="background-color: #e7f2fa; color: #2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const *obj, uint32_t part) </span> |
: | : | ||
Variables | Variables | ||
− | ; uint32_t LV_LAYOUT_GRID | + | <span style="background-color: #e7f2fa; color: #2980b9;">uint32_t LV_LAYOUT_GRID </span> |
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_COLUMN_DSC_ARRAY </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_COLUMN_ALIGN </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_ROW_DSC_ARRAY </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_ROW_ALIGN </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_COLUMN_POS </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_COLUMN_SPAN </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_X_ALIGN </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_ROW_POS </span> | ||
+ | : | ||
+ | |||
+ | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_ROW_SPAN </span> | ||
: | : | ||
− | ; | + | <span style="background-color: #e7f2fa; color: #2980b9;"> LV_STYLE_GRID_CELL_Y_ALIGN</span> |
+ | |'''列挙型''' | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">列挙'''型lv_grid_align_t'''</span> | ||
+ | |||
+ | : ''値:'' | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_START</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_CENTER</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_END</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_STRETCH</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_EVENLY</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_AROUND</span> | ||
+ | :: | ||
+ | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_BETWEEN</span> | ||
+ | :: | ||
+ | |||
+ | '''機能''' | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">LV_EXPORT_CONST_INT(LV_GRID_CONTENT)</span> | ||
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">LV_EXPORT_CONST_INT(LV_GRID_TEMPLATE_LAST)</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_grid_init(void)</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_grid_dsc_array('''lv_obj_t''' * obj、const lv_coord_t col_dsc []、const lv_coord_t row_dsc [])</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_grid_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' column_align、'''lv_grid_align_t''' row_align)</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_grid_cell('''lv_obj_t''' * obj、'''lv_grid_align_t''' column_align、uint8_t col_pos、uint8_t col_span、'''lv_grid_align_t''' row_align、uint8_t row_pos、uint8_t row_span)</span> |
+ | |||
+ | : オブジェクトのセルを設定します。オブジェクトの親はグリッドレイアウトである必要があります。そうでない場合、何も起こりません。 | ||
+ | : パラメーター | ||
+ | ::* obj-オブジェクトへのポインタ | ||
+ | ::* column_align-セルの垂直方向の配置。<code style="color: #bb0000;">LV_GRID_START/END/CENTER/STRETCH</code> | ||
+ | ::* col_pos-列ID | ||
+ | ::* col_span-取得する列の数(> = 1) | ||
+ | ::* row_align-セルの水平方向の配置。<code style="color: #bb0000;">LV_GRID_START/END/CENTER/STRETCH</code> | ||
+ | ::* row_pos-行ID | ||
+ | ::* row_span-取得する行数(> = 1) | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">静的インラインlv_coord_tlv_grid_fr(uint8_t x)</span> | ||
+ | |||
+ | : <font class="goog-text-highlight">オブジェクト間にグリッドが挿入する最小スペースを変更するには、グリッドコンテナスタイルに次のプロパティを設定できます。</font><code style="color: #bb0000;">LV_GRID_FR</code>バインディングの単なるラッパー。 | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_row_dsc_array('''lv_style_t''' * style、const lv_coord_t value [])</span> | ||
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_column_dsc_array('''lv_style_t''' * style、const lv_coord_t value [])</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_row_align('''lv_style_t''' * style、'''lv_grid_align_t''' value)</span> |
+ | |||
: | : | ||
− | ; | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_column_align('''lv_style_t''' * style、'''lv_grid_align_t''' value)</span> |
+ | |||
: | : | ||
− | ; [ | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_column_pos('''lv_style_t''' * style、lv_coord_t value)</span> |
− | + | ||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_column_span('''lv_style_t''' * style、lv_coord_t value)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_row_pos('''lv_style_t''' * style、lv_coord_t value)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_row_span('''lv_style_t''' * style、lv_coord_t value)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_x_align('''lv_style_t''' * style、lv_coord_t value)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_y_align('''lv_style_t''' * style、lv_coord_t value)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_row_dsc_array('''lv_obj_t''' * obj、const lv_coord_t value []、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_column_dsc_array('''lv_obj_t''' * obj、const lv_coord_t value []、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_row_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_column_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_column_pos('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_column_span('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_row_pos('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_row_span('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_x_align('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_obj_set_style_grid_cell_y_align('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline const lv_coord_t * lv_obj_get_style_grid_row_dsc_array(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline const lv_coord_t * lv_obj_get_style_grid_column_dsc_array(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline '''lv_grid_align_t''' lv_obj_get_style_grid_row_align(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline '''lv_grid_align_t''' lv_obj_get_style_grid_column_align(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const '''lv_obj_t''' * obj、uint32_t part)</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | 変数 | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">uint32_t LV_LAYOUT_GRID</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_DSC_ARRAY</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_ALIGN</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_ROW_DSC_ARRAY</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_ROW_ALIGN</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_POS</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_SPAN</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_X_ALIGN</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_POS</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_SPAN</span> | ||
+ | |||
+ | : | ||
+ | |||
+ | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_Y_ALIGN</span> | ||
|} | |} | ||
381行目: | 687行目: | ||
:[[App:Library:LVGL#Widgets|戻る : Previous]] | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
− |
2022年6月29日 (水) 13:00時点における最新版
https://docs.lvgl.io/8.2/widgets/index.html
Grid
Overview
英文 | 自動翻訳 |
---|---|
The Grid layout is a subset of CSS Flexbox. It can arrange items into a 2D "table" that has rows or columns (tracks). The item can span through multiple columns or rows. The track's size can be set in pixel, to the largest item ( To make an object a grid container call Note that the grid layout feature of LVGL needs to be globally enabled with |
グリッドレイアウトはCSSFlexboxのサブセットです。
行または列(トラック)を持つ2D「テーブル」にアイテムを配置できます。アイテムは、複数の列または行にまたがることができます。トラックのサイズは、ピクセル単位、最大項目( オブジェクトをグリッドコンテナにするには、 LVGLのグリッドレイアウト機能は、 |
Terms
英文 | 自動翻訳 |
---|---|
|
|
Simple interface
英文 | 自動翻訳 |
---|---|
With the following functions you can easily set a Grid layout on any parent. |
次の関数を使用すると、任意の親にグリッドレイアウトを簡単に設定できます。 |
Grid descriptors
英文 | 自動翻訳 |
---|---|
First you need to describe the size of rows and columns. It can be done by declaring 2 arrays and the track sizes in them. The last element must be For example: static lv_coord_t column_dsc[] = {100, 400, LV_GRID_TEMPLATE_LAST}; /*2 columns with 100 and 400 ps width*/
static lv_coord_t row_dsc[] = {100, 100, 100, LV_GRID_TEMPLATE_LAST}; /*3 100 px tall rows*/
To set the descriptors on a parent use Besides simple settings the size in pixel you can use two special values:
|
まず、行と列のサイズを説明する必要があります。これは、2つの配列とその中のトラックサイズを宣言することで実行できます。 最後の要素は 例えば: static lv_coord_t column_dsc [] = {100、400、LV_GRID_TEMPLATE_LAST}; /*100および400ps幅の2列*/
static lv_coord_t row_dsc [] = {100、100、100、LV_GRID_TEMPLATE_LAST}; / *3100ピクセルの高さの行*/
親に記述子を設定するには、 ピクセル単位のサイズの簡単な設定に加えて、2つの特別な値を使用できます。
|
Grid items
英文 | 自動翻訳 |
---|---|
By default, the children are not added to the grid. They need to be added manually to a cell. To do this call
|
デフォルトでは、子はグリッドに追加されません。それらは手動でセルに追加する必要があります。
|
Grid align
英文 | 自動翻訳 |
---|---|
If there are some empty space the track can be aligned several ways:
|
空きスペースがある場合は、トラックをいくつかの方法で整列させることができます。
|
Style interface
英文 | 自動翻訳 |
---|---|
All the Grid related values are style properties under the hood and you can use them similarly to any other style properties. The following Grid related style properties exist:
|
グリッドに関連するすべての値は、内部のスタイルプロパティであり、他のスタイルプロパティと同様に使用できます。次のグリッド関連のスタイルプロパティが存在します。
|
Internal padding
英文 | 自動翻訳 |
---|---|
To modify the minimum space Grid inserts between objects, the following properties can be set on the Grid container style:
|
オブジェクト間にグリッドが挿入する最小スペースを変更するには、グリッドコンテナスタイルに次のプロパティを設定できます。
|
Other features
RTL
英文 | 自動翻訳 |
---|---|
If the base direction of the container is set to The columns will be placed from right to left. |
コンテナのベース方向がLV_BASE_DIR_RTL に設定されている場合、LV_GRID_ALIGN_STAR とTLV_GRID_ALIGN_END の意味が入れ替わります。つまり、START は右端を意味します。
列は右から左に配置されます。 |
Example
英文 | 自動翻訳 |
---|---|
A simple grid |
|
Demonstrate cell placement and span |
|
Demonstrate grid's "free unit" |
|
Demonstrate track placement |
|
Demonstrate column and row gap |
|
Demonstrate RTL direction on grid |
API
英文 | 自動翻訳 |
---|---|
Enums enum lv_grid_align_t
Functions LV_EXPORT_CONST_INT(LV_GRID_CONTENT) LV_EXPORT_CONST_INT(LV_GRID_TEMPLATE_LAST) void lv_grid_init(void) void lv_obj_set_grid_dsc_array( *obj, const lv_coord_t col_dsc[], const lv_coord_t row_dsc[]) void lv_obj_set_grid_align( *obj, column_align, row_align) void lv_obj_set_grid_cell( *obj, column_align, uint8_t col_pos, uint8_t col_span, row_align, uint8_t row_pos, uint8_t row_span)
static inline lv_coord_t lv_grid_fr(uint8_t x)
void lv_style_set_grid_row_dsc_array( *style, const lv_coord_t value[]) void lv_style_set_grid_column_dsc_array( *style, const lv_coord_t value[]) void lv_style_set_grid_row_align( *style, value) void lv_style_set_grid_column_align( *style, value) void lv_style_set_grid_cell_column_pos( *style, lv_coord_t value) void lv_style_set_grid_cell_column_span( *style, lv_coord_t value) void lv_style_set_grid_cell_row_pos( *style, lv_coord_t value) void lv_style_set_grid_cell_row_span( *style, lv_coord_t value) void lv_style_set_grid_cell_x_align( *style, lv_coord_t value) void lv_style_set_grid_cell_y_align( *style, lv_coord_t value) void lv_obj_set_style_grid_row_dsc_array( *obj, const lv_coord_t value[], lv_style_selector_t selector) void lv_obj_set_style_grid_column_dsc_array( *obj, const lv_coord_t value[], lv_style_selector_t selector) void lv_obj_set_style_grid_row_align( *obj, value, lv_style_selector_t selector) void lv_obj_set_style_grid_column_align( *obj, value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_column_pos( *obj, lv_coord_t value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_column_span( *obj, lv_coord_t value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_row_pos( *obj, lv_coord_t value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_row_span( *obj, lv_coord_t value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_x_align( *obj, lv_coord_t value, lv_style_selector_t selector) void lv_obj_set_style_grid_cell_y_align( *obj, lv_coord_t value, lv_style_selector_t selector) static inline const lv_coord_t *lv_obj_get_style_grid_row_dsc_array(const *obj, uint32_t part) static inline const lv_coord_t *lv_obj_get_style_grid_column_dsc_array(const *obj, uint32_t part) static inline lv_obj_get_style_grid_row_align(const *obj, uint32_t part) static inline lv_obj_get_style_grid_column_align(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const *obj, uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const *obj, uint32_t part) Variables uint32_t LV_LAYOUT_GRID LV_STYLE_GRID_COLUMN_DSC_ARRAY LV_STYLE_GRID_COLUMN_ALIGN LV_STYLE_GRID_ROW_DSC_ARRAY LV_STYLE_GRID_ROW_ALIGN LV_STYLE_GRID_CELL_COLUMN_POS LV_STYLE_GRID_CELL_COLUMN_SPAN LV_STYLE_GRID_CELL_X_ALIGN LV_STYLE_GRID_CELL_ROW_POS LV_STYLE_GRID_CELL_ROW_SPAN LV_STYLE_GRID_CELL_Y_ALIGN |
列挙型
列挙型lv_grid_align_t
機能 LV_EXPORT_CONST_INT(LV_GRID_CONTENT) LV_EXPORT_CONST_INT(LV_GRID_TEMPLATE_LAST) void lv_grid_init(void) void lv_obj_set_grid_dsc_array(lv_obj_t * obj、const lv_coord_t col_dsc []、const lv_coord_t row_dsc []) void lv_obj_set_grid_align(lv_obj_t * obj、lv_grid_align_t column_align、lv_grid_align_t row_align) void lv_obj_set_grid_cell(lv_obj_t * obj、lv_grid_align_t column_align、uint8_t col_pos、uint8_t col_span、lv_grid_align_t row_align、uint8_t row_pos、uint8_t row_span)
静的インラインlv_coord_tlv_grid_fr(uint8_t x)
void lv_style_set_grid_row_dsc_array(lv_style_t * style、const lv_coord_t value []) void lv_style_set_grid_column_dsc_array(lv_style_t * style、const lv_coord_t value []) void lv_style_set_grid_row_align(lv_style_t * style、lv_grid_align_t value) void lv_style_set_grid_column_align(lv_style_t * style、lv_grid_align_t value) void lv_style_set_grid_cell_column_pos(lv_style_t * style、lv_coord_t value) void lv_style_set_grid_cell_column_span(lv_style_t * style、lv_coord_t value) void lv_style_set_grid_cell_row_pos(lv_style_t * style、lv_coord_t value) void lv_style_set_grid_cell_row_span(lv_style_t * style、lv_coord_t value) void lv_style_set_grid_cell_x_align(lv_style_t * style、lv_coord_t value) void lv_style_set_grid_cell_y_align(lv_style_t * style、lv_coord_t value) void lv_obj_set_style_grid_row_dsc_array(lv_obj_t * obj、const lv_coord_t value []、lv_style_selector_tセレクター) void lv_obj_set_style_grid_column_dsc_array(lv_obj_t * obj、const lv_coord_t value []、lv_style_selector_tセレクター) void lv_obj_set_style_grid_row_align(lv_obj_t * obj、lv_grid_align_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_column_align(lv_obj_t * obj、lv_grid_align_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_column_pos(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_column_span(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_row_pos(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_row_span(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_x_align(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) void lv_obj_set_style_grid_cell_y_align(lv_obj_t * obj、lv_coord_t value、lv_style_selector_tセレクター) static inline const lv_coord_t * lv_obj_get_style_grid_row_dsc_array(const lv_obj_t * obj、uint32_t part) static inline const lv_coord_t * lv_obj_get_style_grid_column_dsc_array(const lv_obj_t * obj、uint32_t part) static inline lv_grid_align_t lv_obj_get_style_grid_row_align(const lv_obj_t * obj、uint32_t part) static inline lv_grid_align_t lv_obj_get_style_grid_column_align(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const lv_obj_t * obj、uint32_t part) static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const lv_obj_t * obj、uint32_t part) 変数 uint32_t LV_LAYOUT_GRID lv_style_prop_t LV_STYLE_GRID_COLUMN_DSC_ARRAY lv_style_prop_t LV_STYLE_GRID_COLUMN_ALIGN lv_style_prop_t LV_STYLE_GRID_ROW_DSC_ARRAY lv_style_prop_t LV_STYLE_GRID_ROW_ALIGN lv_style_prop_t LV_STYLE_GRID_CELL_COLUMN_POS lv_style_prop_t LV_STYLE_GRID_CELL_COLUMN_SPAN lv_style_prop_t LV_STYLE_GRID_CELL_X_ALIGN lv_style_prop_t LV_STYLE_GRID_CELL_ROW_POS lv_style_prop_t LV_STYLE_GRID_CELL_ROW_SPAN lv_style_prop_t LV_STYLE_GRID_CELL_Y_ALIGN |