awtk/docs/layout.md

# 控件布局器 (layouter)

## 一、为什么需要控件布局器 (layouter)

如果界面上元素是预先知道的，而且窗口的大小也是固定的，通过可视化的工具，以所见即所得的方式，去创建界面是最轻松的方式。但是在下列情况下，使用布局参数是更好的选择。

* 需要适应不同大小的屏幕。
* 窗口的大小可以动态调整的。
* 界面上的元素是动态的，需要用程序创建界面。

[AWTK](https://github.com/zlgopen/awtk) 提供了简单而又强大的布局参数。

## 二、概述

AWTK 的布局器 (layouter) 分为两类，一类用于对控件自身进行布局，另外一类用于对子控件进行布局。

* self\_layout 对控件自身进行布局
* children\_layout 用于对子控件进行布局

![layout_overview](images/layout_overview.png)

AWTK 提供了灵活的扩展机制，可以方便的扩展新的布局方式，所以 self\_layouter 和 children\_layouter 都是接口。

## 三、控件自身的布局

![self_layouter](images/layout_self_layouter.png)

* 1.[缺省控件布局器介绍](self_layouter_default.md)
* 2.[菜单布局器介绍](self_layouter_menu.md)

> 以后会陆续实现 css flex 等布局方式。

## 三、子控件的布局

![children_layouter](images/layout_children_layouter.png)

* 1.[缺省子控件布局器介绍](children_layouter_default.md)
* 2.[ListView 子控件布局器介绍](children_layouter_list_view.md)

> 以后会陆续实现 css flex 等布局方式。
update docs and demos 2021-02-04 09:38:57 +08:00			`# 控件布局器 (layouter)`
add docs 2018-03-12 21:24:24 +08:00
update docs and demos 2021-02-04 09:38:57 +08:00			`## 一、为什么需要控件布局器 (layouter)`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`如果界面上元素是预先知道的，而且窗口的大小也是固定的，通过可视化的工具，以所见即所得的方式，去创建界面是最轻松的方式。但是在下列情况下，使用布局参数是更好的选择。`
add docs 2018-03-12 21:24:24 +08:00
			`* 需要适应不同大小的屏幕。`
rework layout 2018-12-20 11:01:37 +08:00			`* 窗口的大小可以动态调整的。`
add docs 2018-03-12 21:24:24 +08:00			`* 界面上的元素是动态的，需要用程序创建界面。`

update docs and demos 2021-02-04 09:38:57 +08:00			`[AWTK](https://github.com/zlgopen/awtk) 提供了简单而又强大的布局参数。`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`## 二、概述`
add docs 2018-03-12 21:24:24 +08:00
update docs and demos 2021-02-04 09:38:57 +08:00			`AWTK 的布局器 (layouter) 分为两类，一类用于对控件自身进行布局，另外一类用于对子控件进行布局。`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`* self\_layout 对控件自身进行布局`
			`* children\_layout 用于对子控件进行布局`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`![layout_overview](images/layout_overview.png)`
add docs 2018-03-12 21:24:24 +08:00
update docs and demos 2021-02-04 09:38:57 +08:00			`AWTK 提供了灵活的扩展机制，可以方便的扩展新的布局方式，所以 self\_layouter 和 children\_layouter 都是接口。`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`## 三、控件自身的布局`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`![self_layouter](images/layout_self_layouter.png)`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`* 1.[缺省控件布局器介绍](self_layouter_default.md)`
add menu layouter 2019-07-01 08:48:36 +08:00			`* 2.[菜单布局器介绍](self_layouter_menu.md)`
add docs 2018-03-12 21:24:24 +08:00
update docs and demos 2021-02-04 09:38:57 +08:00			`> 以后会陆续实现 css flex 等布局方式。`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`## 三、子控件的布局`
add docs 2018-03-12 21:24:24 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`![children_layouter](images/layout_children_layouter.png)`
update docs 2018-10-11 11:32:06 +08:00
rework layout 2018-12-20 11:01:37 +08:00			`* 1.[缺省子控件布局器介绍](children_layouter_default.md)`
update docs and demos 2021-02-04 09:38:57 +08:00			`* 2.[ListView 子控件布局器介绍](children_layouter_list_view.md)`
update docs 2018-10-11 11:32:06 +08:00
update docs and demos 2021-02-04 09:38:57 +08:00			`> 以后会陆续实现 css flex 等布局方式。`