容器 (Container)
::: hljs-center
:::
容器是 `lvgl` 相当重要的一个控件了，可以设置布局，容器的大小也会自动进行调整，利用容器可以创建出自适应成都很高的界面布局。
## 代码示例
```lua
-- 创建容器
cont = lvgl.cont_create(lvgl.scr_act(), nil)
lvgl.obj_set_auto_realign(cont, true)
lvgl.obj_align(cont, nil, lvgl.ALIGN_CENTER, 0, 0)
lvgl.cont_set_fit(cont, lvgl.FIT_TIGHT)
lvgl.cont_set_layout(cont, lvgl.LAYOUT_COLUMN_MID)
-- 添加标签
label = lvgl.label_create(cont, nil)
lvgl.label_set_text(label, "Short text")
label = lvgl.label_create(cont, nil)
lvgl.label_set_text(label, "It is a long text")
label = lvgl.label_create(cont, nil)
lvgl.label_set_text(label, "Here is an even longer text")
```
## 创建
容器是通过函数 lvgl.cont_create 创建的。几乎所有的控件创建函数都是需要两个参数，第一个参数是父对象，通常这个控件传的都是容器控件。因为控件父子关系展现的是一个包含关系，在一个 `按钮` 里创建`另一个按钮`，虽然也可以这么做，但是从正常角度来看很少有这种需求，毕竟不是谁家门前都有两棵枣树的。
```
cont = lvgl.cont_create(lvgl.scr_act(), nil)
```
## 布局
这个概念是容器控件的一个重点，自动添加到容器内的控件是在左上角叠加显示的。
```lua
function img(cont, path)
local pic = lvgl.img_create(cont, nil)
lvgl.img_set_src(pic, path)
end
-- 创建主容器
cont = lvgl.cont_create(nil, nil)
lvgl.disp_load_scr(cont)
img(cont, "/lua/png50.png")
img(cont, "/lua/png40.png")
img(cont, "/lua/png30.png")
```
这段代码首先创建了一个容器，然后向容器添加了三张图片，依靠容器的默认布局显示内容如下：
`lvgl.LAYOUT_OFF` 也就是没有布局, 所有内容全部叠加显示
::: hljs-center
:::
我们再来看另一种常用的布局 `lvgl.LAYOUT_CENTER` 居中布局
::: hljs-center
:::
接着看看剩下的布局 `lvgl.LAYOUT_COLUMN_LEFT` 元素靠左按列排布
::: hljs-center
:::
`lvgl.LAYOUT_COLUMN_MID` 元素居中按列排布
::: hljs-center
:::
`lvgl.LAYOUT_COLUMN_RIGHT` 元素靠右按列排布
::: hljs-center
:::
`lvgl.LAYOUT_GRID` 元素按顶部高度行排列
::: hljs-center
:::
`lvgl.LAYOUT_PRETTY_BOTTOM` 元素按照底部高度等距排列
::: hljs-center
:::
`lvgl.LAYOUT_PRETTY_MID` 元素按照居中高度等距排列
::: hljs-center
:::
`lvgl.LAYOUT_PRETTY_TOP` 元素按照顶部高度等距排列
::: hljs-center
:::
`lvgl.LAYOUT_ROW_BOTTOM` 元素靠底排列
::: hljs-center
:::
`lvgl.LAYOUT_ROW_MID` 元素居中排列
::: hljs-center
:::
`lvgl.LAYOUT_ROW_TOP` 元素靠顶排列
::: hljs-center
:::
以上就是容器所有的布局方式。
## 自适应
容器的另一个特点就是自适应，可以根据子对象或者父对象自动更改容器大小。
```
lvgl.FIT_NONE -- 不会自动更改大小
lvgl.FIT_TIGHT -- 将容器紧缩在内容周围
lvgl.FIT_PARENT -- 父容器的大小减去 pad_top/bottom/left/right 后的空间。
lvgl.FIT_MAX -- 容器至少是父容器大小
```
## API
### lvgl.cont_create
|调用|lvgl.cont_create(par, copy)|
|-|-|
|功能|创建一个容器对象|
|返回|指向创建的容器的指针|
|参数||
|par|指向对象的指针, 它将是新容器的父对象|
|copy|指向容器对象的指针, 如果不为 nil, 则将从其复制新对象|
### lvgl.cont_set_layout
|调用|lvgl.cont_set_layout(cont, layout)|
|-|-|
|功能|设置容器的布局方式|
|参数||
|cont|指向容器对象的指针|
|layout|容器的布局方式|
### lvgl.cont_set_fit4
|调用|lvgl.cont_set_fit4(cont, left, right, top, bottom)|
|-|-|
|功能|分别设置容器四个方向上的拟合方式|
|参数||
|cont|指向容器对象的指针|
|left|左边的拟合方式|
|right|右边的拟合方式|
|top|顶部的拟合方式|
|bottom|底部的拟合方式|
### lvgl.cont_set_fit2
|调用|lvgl.cont_set_fit2(cont, hor, ver)|
|-|-|
|功能|设置水平和垂直方向的拟合方式|
|参数||
|cont|指向容器对象的指针|
|hor|水平方向上的拟合方式|
|ver|垂直方向上的拟合方式|
### lvgl.cont_set_fit
|调用|lvgl.cont_set_fit(cont, fit)|
|-|-|
|功能|一次性设置容器四个方向上的拟合方式|
|参数||
|cont|指向容器对象的指针|
|fit|容器四个方向上的拟合方式|
### lvgl.cont_get_layout
|调用|lvgl.cont_get_layout(cont)|
|-|-|
|功能|获取容器的布局|
|返回|容器当前的布局方式|
|参数||
|cont|指向容器对象的指针|
### lvgl.cont_get_fit_left
|调用|lvgl.cont_get_fit_left(cont)|
|-|-|
|功能|获取容器左边的拟合方式|
|返回|获取容器左边的拟合方式|
|参数||
|cont|指向容器对象的指针|
### lvgl.cont_get_fit_right
|调用|lvgl.cont_get_fit_right(cont)|
|-|-|
|功能|获取容器右边的拟合方式|
|返回|获取容器右边的拟合方式|
|参数||
|cont|指向容器对象的指针|
### lvgl.cont_get_fit_top
|调用|lvgl.cont_get_fit_top(cont)|
|-|-|
|功能|获取容器顶部的拟合方式|
|返回|获取容器顶部的拟合方式|
|参数||
|cont|指向容器对象的指针|
### lvgl.cont_get_fit_bottom
|调用|lvgl.cont_get_fit_bottom(cont)|
|-|-|
|功能|获取容器底部的拟合方式|
|返回|获取容器底部的拟合方式|
|参数||
|cont|指向容器对象的指针|
|
[参考链接(C语言)](https://docs.lvgl.io/7.11/widgets/cont.html)