winform入门篇 第六章 -- 布局器

布局器

布局器 LayoutEngine:负责子控件的布局

默认地，一个Form 或Panel都自带了一个布局器

在窗口改变大小时，由窗口的布局器来负责调整布局

在官方文档中，搜索Panel 在底部属性中，能找到LayoutEngine

自定义的布局器

SimpleLayoutPanel:自定义一个Panel，并自己实现-个LayoutEngine 。
观察代码。。

自定义的布局器

自定义布局器的 使用步骤:
1 工具I选项，Windows窗体设计器|常规
自动填充工具箱:设为True

2 添加自定义Panel或Control的类

3 生成解决方案 F7

4 重新打开Form1.cs，在工具箱界面可以看到自己的控件

直接拖动过来就可以使用

将其他控件拖入到该布局器中，发现他按照一定的规则自动布局了

可以给自定义panel添加一些间距属性

运行

小结

了解布局器 LayóutEngine 的作用会使用自定义的布局器，知道怎么显示到工具箱中
注 : 不要求自己会写一个布局器

FlowLayoutPanel

FlowLayoutPanel，流式布局
子控件依次排列，一行排满之后换行继续排。

演示:。。

填满一行后，换行排列

缩放这个布局器，发现他会自动调整

更多练习

练习:
1 布局的嵌套
flowLayoutPanel本身也是控件，也有Anchor/Dock属性

设置为停靠在上方

运行项目，调整窗口大小，发现他会自动调整 布局器里面的控件（超过一行，自动排列到下方）

2 属性的设置
试着设一下 Padding 等属性

3 控件的选择
右键，选择控件或该控件所在的面板

右键button2的时候，你相当于同时选中 按钮、panel、 form；

要点与细节

1 注意 FlowLayoutPanel本身不是布局器，它只是一个面板。是它内部实现了一个布局器。

TableLayoutPanel

TableLayoutPanel，
表格布局以表格的形式进行布局。。
演示:。

右键点击，可以添加 行 或 列

练习:(以单行表格为例)

也可 右键 属性 选择布局下的 Rows

1增加列、删除列

2设置列的属性列的宽度:

-绝对值(固定大小)
-百分比(占据剩余空间的百分比)
-自动大小(根据所需的空间自动分配)

第一列设置为 固定值 100px

第二列 占用50%

第三列 50%

第二、三列50%的意思是，排除了第一列的100px,剩下的 各取50%

设置dock 停靠

拖动窗口，发现第一列没有变换，它为固定100px ,第二三列为动态调整的，各占剩下宽度的50%

自动调整大小的意思是，根据列里面放的控件大小 自动调整。

演示:使用TableLayoutPanel来布局界面

1 添加 TableLayoutPanel，停靠在上方

2 添加 Button,TextBox到表格，设置列的宽度

第一个设置为100%，第二列设置为自动调整大小

3 添加 PictureBox，停靠在中央

停靠在中间

在属性，外观中，添加背景色

4 设置 TextBox的Dock，填满单元格

运行

当我们调整窗口大小的时候，文本框 总是占满剩余空间

要点与细节

1表格中的控件也可以设置Dock属性
如何利用 Dock属性，其规则是由布局器决定的

AfDockLayout

至此，已经学了三种自带的布局器:
1 默认布局(Anchor, Dock)
2 FlowLayoutPanel
3 TableLayoutPanel
对于初学练习来说，已经够用。但在项目中，还不够。

比如，默认的Dock停靠布局并不好用

演示对比:

第一种情况:先Left后Fill
添加panel ,添加两个按钮，设置dock, 先left ，再Fill

此时是正常的，各占据了一部分

第二种情况:先Fill 后Left

此时拖动，button2大小,button1并不会变换。

最终的布局效果依赖于控件添加的顺序，非常不方便

AfDockLayout:是对默认Dock布局的优化版

演示:

1 添加 Af.Winform.DockLayout.cs 到项目

因为是自定义的
自己复制到项目中，再重新生成解决方案，关闭重新打开Form1.cs

2 重新生成项目

3 在工具箱里找到 AfDockLayout，添加到布局

4在面板中添加子控件，设置Dock

添加一个button, 设置Dock 占据整个空间

再添加一个button,占据左部分空间

此时发现他们之间是分明的

再添加一个，停靠于上层

此时左上角，有个空缺

5 设置AfDockLayout.DockFlags属性

属性，设置DockFlags

AfDockLayout 的特点:

1 支持上、下、左、右、中位置，顺序无关
2 支持各个控件的 Margin
3 支持设置容器本身的Padding