项目某些应用程序需要这样一个窗体，该窗体的布局可在窗体重新调整大小或在内容更改大小时对自身进行排列。 当你需要动态布局并且不希望在代码中显式处理 Layout 事件时，请考虑使用布局面板。 FlowLayoutPanel 控件和 TableLayoutPanel 控件提供可用于排列窗体上的控件的直观方式。 两种控件均提供一种自动的可配置能力来控制包含在控件内的子控件的相对位置，并且两种控件均在运行时提供动态布局功能，以便它们可以在父窗体的尺寸更改时重新调整子控件的大小和对其进行重新定位。 布局面板可以嵌套在布局面板内，从而实现复杂的用户界面。 在 TableLayoutPanel 网格中排列其内容，提供类似于 HTML < table 元素的功能 > 。 其单元格排列为行和列，并且这些行和列可具有不同的大小。 有关详细信息，请参阅 Walkthrough: Arranging Controls on Windows Forms Using a TableLayoutPanel。 FlowLayoutPanel 以特定的流向排列其内容：水平或垂直。 可从一行到下一行，或从一列到下列进行内容换行。 还可以剪切内容，而不是进行换行。 本演练涉及以下任务： 创建 Windows 窗体项目 沿水平方向和垂直方向排列控件 更改流方向 插入分流符 使用填充和边距排列控件 通过在工具箱中双击控件将其插入 通过绘制控件轮廓将其插入 使用插入符号插入控件 将现有控件重新分配给另一个父控件
完成后，你将了解这些重要布局功能所扮演的角色。 创建项目在 Visual Studio 中，创建一个名为 "FlowLayoutPanelExample" 的基于 Windows 的应用程序项目 (FileNewProjectVisual c #或Visual Basic经典桌面Windows 窗体应用程序) 。 在 “窗体设计器”中选择窗体。
沿水平方向和垂直方向排列控件FlowLayoutPanel 控件允许你沿行或列放置控件，而无需精确指定每个控件的位置。 FlowLayoutPanel 控件可在父窗体的尺寸更改时重新调整其子控件的大小或对其进行重排。 使用 FlowLayoutPanel 沿水平和垂直方向排列控件从 FlowLayoutPanel “工具箱” FlowLayoutPanel 控件拖到你的窗体上。 从 Button “工具箱” Button 控件拖入 FlowLayoutPanel。 请注意，会自动将其移动到 FlowLayoutPanel 控件的左上角。 将另一个 Button 控件从 Button 拖入 FlowLayoutPanel。 请注意，会自动将 Button 控件移动到第一个 Button 控件旁边的位置。 如果你的 FlowLayoutPanel 过窄而导致两个控件无法位于同一行，则新的 Button 控件将被自动移动到下一行。 从 Button “工具箱” Button 控件也拖入 FlowLayoutPanel。 继续放置 Button 控件，直到有一个被换到下一行。 将 FlowLayoutPanel 控件的 WrapContents 属性值更改为 false。 请注意，子控件不再流到下一行。 相反，会将其移动到第一行并将其剪切。 将 FlowLayoutPanel 控件的 WrapContents 属性值更改为 true。 请注意，子控件会再次流到下一行。 减小 FlowLayoutPanel 控件的宽度直至将所有 Button 控件移入第一列。 增加 FlowLayoutPanel 控件的宽度直至将所有 Button 控件移入第一行。 你可能需要重新调整窗体大小以容纳更大宽度。
更改流方向FlowDirection 属性允许你更改控件排列的方向。 你可以从左到右、从右到左、从顶部到底部或从底部到顶部排列子控件。 若要在 FlowLayoutPanel 中更改流方向将 FlowLayoutPanel 控件的 FlowDirection 属性值更改为 TopDown。 请注意，子控件排列为一列或多列，具体取决于控件的高度。 重新调整 FlowLayoutPanel 的大小，以使其高度小于 Button 控件的列高。 请注意， FlowLayoutPanel 会重新排列子控件以流入下一列。 继续减小高度，并注意，子控件会流入连续列。 将 FlowLayoutPanel 控件的 FlowDirection 属性值更改为 RightToLeft。 请注意，子控件的位置会反转。 将 FlowDirection 属性的值更改为 BottomUp时，请观察布局。
插入分流符FlowLayoutPanel 控件向其子控件提供 FlowBreak 属性。 将 FlowBreak 属性的值设置为 true 导致 FlowLayoutPanel 控件停止按当前排列方向对控件进行布局，并换行到下一行或下一列。 插入分流符将 FlowLayoutPanel 控件的 FlowDirection 属性值更改为 TopDown。 在最左边那一列的中间选择一个 Button 控件。 将 Button 控件的 FlowBreak 属性的值设为 true。 请注意，此列将断开，并且所选定的 Button 控件后面的控件将流入下一列。 将 Button 控件的 FlowBreak 属性的值设置为 false 以返回到初始行为。
使用停靠和锚定来定位控件子控件的停靠和锚定行为不同于其他容器控件中的行为。 停靠和锚定均相对于流方向上的最大控件。 使用停靠和锚定定位控件增加 FlowLayoutPanel 的大小直到 Button 控件全部排列在一列中。 选择顶部 Button 控件。 增加其宽度，以使其宽度约为其他 Button 控件的两倍。 选择第二个 Button 控件。 将其 Anchor 属性的值更改为 Right。 请注意，此操作会将它移动，使其右边框对齐第一个 Button 控件的右边框。 将其 Anchor 属性的值更改为 Right 和 Left。 请注意，会将其大小调整为与第一个 Button 控件的宽度相同。 选择第三个 Button 控件。 将其 Dock 属性的值更改为 Fill。 请注意，会将其大小调整为与第一个 Button 控件的宽度相同。
使用填充和边距排列控件还可以通过更改 FlowLayoutPanel 和 Padding 属性排列 Margin 控件中的控件。 Padding 属性允许你在 FlowLayoutPanel 控件的单元格内控制控件的放置。 它指定子控件和 FlowLayoutPanel 控件的边框之间的间距。 Margin 属性允许你控制控件之间的间距。 使用“填充”和“边距”属性排列控件将 FlowLayoutPanel 控件的 Dock 属性值更改为 Fill。 如果你的窗体足够大，则 Button 控件将被移动到 FlowLayoutPanel 控件的第一列中。 通过在 FlowLayoutPanel “属性” Padding 窗口中展开 Padding 条目并将 FlowLayoutPanel 20 All ，可更改 Padding属性的值。 有关详细信息，请参阅演练：通过填充、边距和 AutoSize 属性排放 Windows 窗体控件。 请注意，会将子控件向 FlowLayoutPanel 控件的中心移动。 增加 Padding 属性的值会使子控件远离 FlowLayoutPanel 控件的边框。 选择 Button 中全部的 FlowLayoutPanel 控件，并将 Margin 属性的值设置为 Button。 请注意， Button 控制之间的间距会增加，因此它们会分得更开。 你可能需要重新调整 FlowLayoutPanel 控件的大小，以使其变的更大，从而可看到全部子控件。
通过在工具箱中双击控件将其插入可通过在 FlowLayoutPanel “工具箱” FlowLayoutPanel控件。 若要通过在工具箱中双击控件将其插入在“工具箱” ButtonButton控件图标。 请注意，新的 Button 控件会出现在 FlowLayoutPanel 控件中。 在 “工具箱”中再双击几个控件。 请注意，新控件会相继出现在 FlowLayoutPanel 控件中。
通过绘制控件轮廓将其插入你可以通过在单元格中绘制控件轮廓将控件插入 FlowLayoutPanel 控件并指定其大小。 通过绘制控件轮廓插入控件在“工具箱” 中，单击 控件图标。 请勿将其拖到窗体上。 将鼠标指针移到 FlowLayoutPanel 控件上。 请注意，指针会更改为十字形，同时会附上 Button 控件图标。 单击并按住鼠标按钮。 拖动鼠标指针以绘制 Button 控件的轮廓。 当获得所需大小时，释放鼠标。 请注意，将在 Button 控件的下一个打开位置创建 FlowLayoutPanel 控件。
使用插入栏插入控件可在 FlowLayoutPanel 控件的特定位置插入控件。 将控件拖入 FlowLayoutPanel 控件的客户端区域时，会显示一个插入栏，指示控件将插入的位置。 若要使用插入符号插入控件从 Button “工具箱” Button 控件拖入 FlowLayoutPanel 控件并指向两个 Button 控件之间的空白区域。 请注意，会绘制一个插入栏，指示 Button 将放置到控件中的位置 FlowLayoutPanel 。 将新的 Button 控件放入 FlowLayoutPanel 控件之前，移动鼠标指针以观察插入栏移动的方式。 将新的 Button 控件放入 FlowLayoutPanel 控件。 请注意，新的 Button 控件与其他控件未对齐，因为其 Margin 属性具有不同的值。
将现有控件重新分配给另一个父控件可以将窗体中的控件分配给新的 FlowLayoutPanel 控件。 若要重新设置现有控件的父级将三个 Button 控件从“工具箱” Button 拖到窗体上。 将其相邻放置，但不用对齐它们。 在“工具箱” 中，单击 控件图标。 请勿将其拖到窗体上。 将鼠标指针移至靠近这 3 个 Button 控件。 请注意，指针会更改为十字形，同时会附上 FlowLayoutPanel 控件图标。 单击并按住鼠标按钮。 拖动鼠标指针以绘制 FlowLayoutPanel 控件的轮廓。 在这三个 Button 控件周围绘制轮廓。 释放鼠标按钮。 请注意，这三个 Button 控件插入到 FlowLayoutPanel 控件中。
后续步骤可使用布局面板和控件的组合实现复杂布局。 建议了解的其他内容包括： 另请参阅
|
