「App:Library:LVGL:docs:Layouts:Grid」の版間の差分
(同じ利用者による、間の1版が非表示) | |||
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" | ||
32行目: | 23行目: | ||
LVGLのグリッドレイアウト機能は、<code style="color: #bb0000;">lv_conf.h</code>の中の<code style="color: #bb0000;">LV_USE_GRID</code>でグローバルに有効にする必要があることに注意してください。 | LVGLのグリッドレイアウト機能は、<code style="color: #bb0000;">lv_conf.h</code>の中の<code style="color: #bb0000;">LV_USE_GRID</code>でグローバルに有効にする必要があることに注意してください。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
48行目: | 40行目: | ||
* ギャップ:行と列の間のスペース、またはトラック上のアイテム | * ギャップ:行と列の間のスペース、またはトラック上のアイテム | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
59行目: | 52行目: | ||
|次の関数を使用すると、任意の親にグリッドレイアウトを簡単に設定できます。 | |次の関数を使用すると、任意の親にグリッドレイアウトを簡単に設定できます。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
102行目: | 96行目: | ||
* <code style="color: #bb0000;">LV_GRID_FR(X)</code>残りのスペースのどの部分をこのトラックで使用するかを指定します。値が大きいほど、スペースが大きくなります。 | * <code style="color: #bb0000;">LV_GRID_FR(X)</code>残りのスペースのどの部分をこのトラックで使用するかを指定します。値が大きいほど、スペースが大きくなります。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
142行目: | 137行目: | ||
<code style="color: #bb0000;">colum_span</code>と<code style="color: #bb0000;">row_span</code>はアイテムが開始セルからいくつのトラックを含むべきかを意味します。>1である必要があります。 | <code style="color: #bb0000;">colum_span</code>と<code style="color: #bb0000;">row_span</code>はアイテムが開始セルからいくつのトラックを含むべきかを意味します。>1である必要があります。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
173行目: | 169行目: | ||
トラックの配置を設定するには、<code style="color: #bb0000;">lv_obj_set_grid_align(obj, column_align, row_align)</code>を使用します。 | トラックの配置を設定するには、<code style="color: #bb0000;">lv_obj_set_grid_align(obj, column_align, row_align)</code>を使用します。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
207行目: | 204行目: | ||
* <code style="color: #bb0000;">GRID_CELL_ROW_SPAN</code> | * <code style="color: #bb0000;">GRID_CELL_ROW_SPAN</code> | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
225行目: | 223行目: | ||
* <code style="color: #bb0000;">pad_column</code>列間のパディングを設定します。 | * <code style="color: #bb0000;">pad_column</code>列間のパディングを設定します。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
241行目: | 240行目: | ||
列は右から左に配置されます。 | 列は右から左に配置されます。 | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
278行目: | 278行目: | ||
| | | | ||
|} | |} | ||
+ | :[[App:Library:LVGL#Widgets|戻る : Previous]] | ||
+ | |||
== API == | == API == | ||
460行目: | 462行目: | ||
|'''列挙型''' | |'''列挙型''' | ||
− | 列挙'''型lv_grid_align_t''' | + | <span style="background-color:#e7f2fa;color:#2980b9;">列挙'''型lv_grid_align_t'''</span> |
: ''値:'' | : ''値:'' | ||
− | : 列挙子LV_GRID_ALIGN_START | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_START</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_CENTER | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_CENTER</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_END | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_END</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_STRETCH | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_STRETCH</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_SPACE_EVENLY | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_EVENLY</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_SPACE_AROUND | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_AROUND</span> |
:: | :: | ||
− | : 列挙子LV_GRID_ALIGN_SPACE_BETWEEN | + | : <span style="background-color: #eeeeee;">列挙子LV_GRID_ALIGN_SPACE_BETWEEN</span> |
:: | :: | ||
'''機能''' | '''機能''' | ||
− | 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('''lv_obj_t''' * obj、const lv_coord_t col_dsc []、const lv_coord_t row_dsc []) | + | <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> |
: | : | ||
− | void lv_obj_set_grid_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' column_align、'''lv_grid_align_t''' row_align) | + | <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> |
: | : | ||
− | 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 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> |
: オブジェクトのセルを設定します。オブジェクトの親はグリッドレイアウトである必要があります。そうでない場合、何も起こりません。 | : オブジェクトのセルを設定します。オブジェクトの親はグリッドレイアウトである必要があります。そうでない場合、何も起こりません。 | ||
512行目: | 514行目: | ||
::* row_span-取得する行数(> = 1) | ::* row_span-取得する行数(> = 1) | ||
− | 静的インラインlv_coord_tlv_grid_fr(uint8_t x) | + | <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>バインディングの単なるラッパー。 | : <font class="goog-text-highlight">オブジェクト間にグリッドが挿入する最小スペースを変更するには、グリッドコンテナスタイルに次のプロパティを設定できます。</font><code style="color: #bb0000;">LV_GRID_FR</code>バインディングの単なるラッパー。 | ||
− | void lv_style_set_grid_row_dsc_array('''lv_style_t''' * style、const lv_coord_t value []) | + | <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> |
: | : | ||
− | void lv_style_set_grid_column_dsc_array('''lv_style_t''' * style、const lv_coord_t value []) | + | <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> |
: | : | ||
− | void lv_style_set_grid_row_align('''lv_style_t''' * style、'''lv_grid_align_t''' value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_row_align('''lv_style_t''' * style、'''lv_grid_align_t''' value)</span> |
: | : | ||
− | void lv_style_set_grid_column_align('''lv_style_t''' * style、'''lv_grid_align_t''' value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_column_align('''lv_style_t''' * style、'''lv_grid_align_t''' value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_column_pos('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_column_pos('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_column_span('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_column_span('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_row_pos('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_row_pos('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_row_span('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_row_span('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_x_align('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_x_align('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_style_set_grid_cell_y_align('''lv_style_t''' * style、lv_coord_t value) | + | <span style="background-color:#e7f2fa;color:#2980b9;">void lv_style_set_grid_cell_y_align('''lv_style_t''' * style、lv_coord_t value)</span> |
: | : | ||
− | void lv_obj_set_style_grid_row_dsc_array('''lv_obj_t''' * obj、const lv_coord_t value []、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_column_dsc_array('''lv_obj_t''' * obj、const lv_coord_t value []、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_row_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_column_align('''lv_obj_t''' * obj、'''lv_grid_align_t''' value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_column_pos('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_column_span('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_row_pos('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_row_span('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_x_align('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | void lv_obj_set_style_grid_cell_y_align('''lv_obj_t''' * obj、lv_coord_t value、lv_style_selector_tセレクター) | + | <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> |
: | : | ||
− | static inline const lv_coord_t * lv_obj_get_style_grid_row_dsc_array(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline const lv_coord_t * lv_obj_get_style_grid_column_dsc_array(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline '''lv_grid_align_t''' lv_obj_get_style_grid_row_align(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline '''lv_grid_align_t''' lv_obj_get_style_grid_column_align(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_column_pos(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_column_span(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_row_pos(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_row_span(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_x_align(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
− | static inline lv_coord_t lv_obj_get_style_grid_cell_y_align(const '''lv_obj_t''' * obj、uint32_t part) | + | <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> |
: | : | ||
638行目: | 640行目: | ||
変数 | 変数 | ||
− | uint32_t LV_LAYOUT_GRID | + | <span style="background-color:#e7f2fa;color:#2980b9;">uint32_t LV_LAYOUT_GRID</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_DSC_ARRAY | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_DSC_ARRAY</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_ALIGN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_COLUMN_ALIGN</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_ROW_DSC_ARRAY | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_ROW_DSC_ARRAY</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_ROW_ALIGN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_ROW_ALIGN</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_POS | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_POS</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_SPAN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_COLUMN_SPAN</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_X_ALIGN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_X_ALIGN</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_POS | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_POS</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_SPAN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_ROW_SPAN</span> |
: | : | ||
− | '''lv_style_prop_t''' LV_STYLE_GRID_CELL_Y_ALIGN | + | <span style="background-color:#e7f2fa;color:#2980b9;">'''lv_style_prop_t''' LV_STYLE_GRID_CELL_Y_ALIGN</span> |
|} | |} | ||
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 |