Partilhar via


Como: Ancorar e acoplar controles filho num controlo FlowLayoutPanel

O controle FlowLayoutPanel suporta as propriedades Anchor e Dock em seus controles filho.

Para ancorar e encaixar controles filho em um controle FlowLayoutPanel

  1. Crie um controle de FlowLayoutPanel em seu formulário.

  2. Defina o Width do controle FlowLayoutPanel como 300e defina sua FlowDirection como TopDown.

  3. Crie dois controles Button e coloque-os no controle FlowLayoutPanel.

  4. Defina a Width do primeiro botão para 200.

  5. Defina a propriedade Dock do segundo botão como Fill.

    Observação

    O segundo botão assume a mesma largura que o primeiro. Ele não se estende pela largura do controle de FlowLayoutPanel.

  6. Defina a propriedade Dock do segundo botão como None. Isso faz com que o botão assuma sua largura original.

  7. Defina a propriedade Anchor do segundo botão como Left, Right.

    Importante

    O segundo botão assume a mesma largura que o primeiro. Ele não se estende pela largura do controle de FlowLayoutPanel. Esta é a regra geral para ancorar e encaixar no controle FlowLayoutPanel: para direções de fluxo verticais, o controle FlowLayoutPanel calcula a largura de uma coluna implícita a partir do controle filho mais largo na coluna. Todos os outros controles nesta coluna com propriedades Anchor ou Dock são alinhados ou esticados para se ajustarem a esta coluna implícita. O comportamento funciona de forma semelhante para direções de fluxo horizontais. O controlo FlowLayoutPanel calcula a altura de uma linha implícita a partir do subcontrolo mais alto na linha, e todos os subcontroles acoplados ou ancorados nessa linha são alinhados ou dimensionados para se ajustar à linha implícita.

Exemplo

A ilustração a seguir mostra quatro botões ancorados e encaixados em relação ao botão azul num FlowLayoutPanel. O FlowDirection é LeftToRight.

Captura de ecrã de FlowLayoutPanel horizontal, nomeando quatro botões que estão ancorados e encaixados num botão centralizado.

A ilustração a seguir mostra quatro botões ancorados e encaixados em relação ao botão azul num FlowLayoutPanel. O FlowDirection é TopDown.

Captura de tela do FlowLayoutPanel vertical, nomeando quatro botões que estão ancorados e encaixados no botão centralizado.

O exemplo de código a seguir demonstra vários valores de propriedade Anchor para um controle Button em um controle FlowLayoutPanel.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Windows.Forms;

public class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }
    private FlowLayoutPanel flowLayoutPanel3;
    private Label label2;
    private Button button11;
    private Button button12;
    private Button button13;
    private Button button14;
    private Button button15;
    private FlowLayoutPanel flowLayoutPanel1;
    private Label label1;
    private Button button1;
    private Button button2;
    private Button button3;
    private Button button4;
    private Button button5;

    private System.ComponentModel.IContainer components = null;

    protected override void Dispose(bool disposing)
    {
        if (disposing && (components != null))
        {
            components.Dispose();
        }
        base.Dispose(disposing);
    }

    private void InitializeComponent()
    {
        this.flowLayoutPanel3 = new System.Windows.Forms.FlowLayoutPanel();
        this.label2 = new System.Windows.Forms.Label();
        this.button11 = new System.Windows.Forms.Button();
        this.button12 = new System.Windows.Forms.Button();
        this.button13 = new System.Windows.Forms.Button();
        this.button14 = new System.Windows.Forms.Button();
        this.button15 = new System.Windows.Forms.Button();
        this.flowLayoutPanel1 = new System.Windows.Forms.FlowLayoutPanel();
        this.label1 = new System.Windows.Forms.Label();
        this.button1 = new System.Windows.Forms.Button();
        this.button2 = new System.Windows.Forms.Button();
        this.button3 = new System.Windows.Forms.Button();
        this.button4 = new System.Windows.Forms.Button();
        this.button5 = new System.Windows.Forms.Button();
        this.flowLayoutPanel3.SuspendLayout();
        this.flowLayoutPanel1.SuspendLayout();
        this.SuspendLayout();
        //
        // flowLayoutPanel3
        //
        this.flowLayoutPanel3.Anchor = ((System.Windows.Forms.AnchorStyles)((((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Bottom)
                    | System.Windows.Forms.AnchorStyles.Left)
                    | System.Windows.Forms.AnchorStyles.Right)));
        this.flowLayoutPanel3.BorderStyle = System.Windows.Forms.BorderStyle.FixedSingle;
        this.flowLayoutPanel3.Controls.Add(this.label2);
        this.flowLayoutPanel3.Controls.Add(this.button11);
        this.flowLayoutPanel3.Controls.Add(this.button12);
        this.flowLayoutPanel3.Controls.Add(this.button13);
        this.flowLayoutPanel3.Controls.Add(this.button14);
        this.flowLayoutPanel3.Controls.Add(this.button15);
        this.flowLayoutPanel3.Location = new System.Drawing.Point(12, 12);
        this.flowLayoutPanel3.Name = "flowLayoutPanel3";
        this.flowLayoutPanel3.Size = new System.Drawing.Size(631, 100);
        this.flowLayoutPanel3.TabIndex = 2;
        //
        // label2
        //
        this.label2.Anchor = System.Windows.Forms.AnchorStyles.None;
        this.label2.AutoSize = true;
        this.label2.Location = new System.Drawing.Point(3, 28);
        this.label2.Name = "label2";
        this.label2.Size = new System.Drawing.Size(138, 14);
        this.label2.TabIndex = 10;
        this.label2.Text = "FlowDirection=LeftToRight";
        //
        // button11
        //
        this.button11.Anchor = System.Windows.Forms.AnchorStyles.Bottom;
        this.button11.AutoSize = true;
        this.button11.Location = new System.Drawing.Point(147, 44);
        this.button11.Name = "button11";
        this.button11.Size = new System.Drawing.Size(86, 23);
        this.button11.TabIndex = 5;
        this.button11.Text = "Anchor=Bottom";
        //
        // button12
        //
        this.button12.Anchor = ((System.Windows.Forms.AnchorStyles)((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Bottom)));
        this.button12.AutoSize = true;
        this.button12.Location = new System.Drawing.Point(239, 3);
        this.button12.Name = "button12";
        this.button12.Size = new System.Drawing.Size(111, 64);
        this.button12.TabIndex = 6;
        this.button12.Text = "Anchor=Top, Bottom";
        //
        // button13
        //
        this.button13.Anchor = System.Windows.Forms.AnchorStyles.None;
        this.button13.BackColor = System.Drawing.SystemColors.GradientActiveCaption;
        this.button13.Location = new System.Drawing.Point(356, 3);
        this.button13.Name = "button13";
        this.button13.Size = new System.Drawing.Size(75, 64);
        this.button13.TabIndex = 7;
        //
        // button14
        //
        this.button14.Dock = System.Windows.Forms.DockStyle.Bottom;
        this.button14.Location = new System.Drawing.Point(437, 44);
        this.button14.Name = "button14";
        this.button14.TabIndex = 8;
        this.button14.Text = "Dock=Bottom";
        //
        // button15
        //
        this.button15.Dock = System.Windows.Forms.DockStyle.Fill;
        this.button15.Location = new System.Drawing.Point(518, 3);
        this.button15.Name = "button15";
        this.button15.Size = new System.Drawing.Size(75, 64);
        this.button15.TabIndex = 9;
        this.button15.Text = "Dock=Fill";
        //
        // flowLayoutPanel1
        //
        this.flowLayoutPanel1.Anchor = ((System.Windows.Forms.AnchorStyles)(((System.Windows.Forms.AnchorStyles.Bottom | System.Windows.Forms.AnchorStyles.Left)
                    | System.Windows.Forms.AnchorStyles.Right)));
        this.flowLayoutPanel1.BorderStyle = System.Windows.Forms.BorderStyle.FixedSingle;
        this.flowLayoutPanel1.Controls.Add(this.label1);
        this.flowLayoutPanel1.Controls.Add(this.button1);
        this.flowLayoutPanel1.Controls.Add(this.button2);
        this.flowLayoutPanel1.Controls.Add(this.button3);
        this.flowLayoutPanel1.Controls.Add(this.button4);
        this.flowLayoutPanel1.Controls.Add(this.button5);
        this.flowLayoutPanel1.FlowDirection = System.Windows.Forms.FlowDirection.TopDown;
        this.flowLayoutPanel1.Location = new System.Drawing.Point(12, 118);
        this.flowLayoutPanel1.Name = "flowLayoutPanel1";
        this.flowLayoutPanel1.Size = new System.Drawing.Size(200, 209);
        this.flowLayoutPanel1.TabIndex = 3;
        //
        // label1
        //
        this.label1.AutoSize = true;
        this.label1.Location = new System.Drawing.Point(3, 3);
        this.label1.Name = "label1";
        this.label1.Size = new System.Drawing.Size(128, 14);
        this.label1.TabIndex = 11;
        this.label1.Text = "FlowDirection=TopDown";
        //
        // button1
        //
        this.button1.Anchor = System.Windows.Forms.AnchorStyles.Right;
        this.button1.Location = new System.Drawing.Point(74, 23);
        this.button1.Name = "button1";
        this.button1.TabIndex = 5;
        this.button1.Text = "Anchor=Right";
        //
        // button2
        //
        this.button2.Anchor = ((System.Windows.Forms.AnchorStyles)((System.Windows.Forms.AnchorStyles.Left | System.Windows.Forms.AnchorStyles.Right)));
        this.button2.Location = new System.Drawing.Point(3, 52);
        this.button2.Name = "button2";
        this.button2.Size = new System.Drawing.Size(146, 23);
        this.button2.TabIndex = 6;
        this.button2.Text = "Anchor=Left, Right";
        //
        // button3
        //
        this.button3.BackColor = System.Drawing.SystemColors.GradientActiveCaption;
        this.button3.Location = new System.Drawing.Point(3, 81);
        this.button3.Name = "button3";
        this.button3.Size = new System.Drawing.Size(146, 23);
        this.button3.TabIndex = 7;
        //
        // button4
        //
        this.button4.Dock = System.Windows.Forms.DockStyle.Right;
        this.button4.Location = new System.Drawing.Point(74, 110);
        this.button4.Name = "button4";
        this.button4.TabIndex = 8;
        this.button4.Text = "Dock=Right";
        //
        // button5
        //
        this.button5.Dock = System.Windows.Forms.DockStyle.Fill;
        this.button5.Location = new System.Drawing.Point(3, 139);
        this.button5.Name = "button5";
        this.button5.Size = new System.Drawing.Size(146, 23);
        this.button5.TabIndex = 9;
        this.button5.Text = "Dock=Fill";
        //
        // Form1
        //
        this.ClientSize = new System.Drawing.Size(658, 341);
        this.Controls.Add(this.flowLayoutPanel1);
        this.Controls.Add(this.flowLayoutPanel3);
        this.Name = "Form1";
        this.Text = "Form1";
        this.flowLayoutPanel3.ResumeLayout(false);
        this.flowLayoutPanel3.PerformLayout();
        this.flowLayoutPanel1.ResumeLayout(false);
        this.flowLayoutPanel1.PerformLayout();
        this.ResumeLayout(false);
    }

    [STAThread]
    static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new Form1());
    }
}
Imports System.Collections.Generic
Imports System.ComponentModel
Imports System.Drawing
Imports System.Windows.Forms




Public Class Form1
   Inherits Form
   
   Public Sub New()
      InitializeComponent()
   End Sub
   Private flowLayoutPanel3 As FlowLayoutPanel
   Private label2 As Label
   Private button11 As Button
   Private button12 As Button
   Private button13 As Button
   Private button14 As Button
   Private button15 As Button
   Private flowLayoutPanel1 As FlowLayoutPanel
   Private label1 As Label
   Private button1 As Button
   Private button2 As Button
   Private button3 As Button
   Private button4 As Button
   Private button5 As Button
   
   Private components As System.ComponentModel.IContainer = Nothing
   
   
   Protected Overrides Sub Dispose(disposing As Boolean)
      If disposing AndAlso (components IsNot Nothing) Then
         components.Dispose()
      End If
      MyBase.Dispose(disposing)
   End Sub
   
   
   Private Sub InitializeComponent()
      Me.flowLayoutPanel3 = New System.Windows.Forms.FlowLayoutPanel()
      Me.label2 = New System.Windows.Forms.Label()
      Me.button11 = New System.Windows.Forms.Button()
      Me.button12 = New System.Windows.Forms.Button()
      Me.button13 = New System.Windows.Forms.Button()
      Me.button14 = New System.Windows.Forms.Button()
      Me.button15 = New System.Windows.Forms.Button()
      Me.flowLayoutPanel1 = New System.Windows.Forms.FlowLayoutPanel()
      Me.label1 = New System.Windows.Forms.Label()
      Me.button1 = New System.Windows.Forms.Button()
      Me.button2 = New System.Windows.Forms.Button()
      Me.button3 = New System.Windows.Forms.Button()
      Me.button4 = New System.Windows.Forms.Button()
      Me.button5 = New System.Windows.Forms.Button()
      Me.flowLayoutPanel3.SuspendLayout()
      Me.flowLayoutPanel1.SuspendLayout()
      Me.SuspendLayout()
      ' 
      ' flowLayoutPanel3
      ' 
      Me.flowLayoutPanel3.Anchor = CType(System.Windows.Forms.AnchorStyles.Top Or System.Windows.Forms.AnchorStyles.Bottom Or System.Windows.Forms.AnchorStyles.Left Or System.Windows.Forms.AnchorStyles.Right, System.Windows.Forms.AnchorStyles)
      Me.flowLayoutPanel3.BorderStyle = System.Windows.Forms.BorderStyle.FixedSingle
      Me.flowLayoutPanel3.Controls.Add(Me.label2)
      Me.flowLayoutPanel3.Controls.Add(Me.button11)
      Me.flowLayoutPanel3.Controls.Add(Me.button12)
      Me.flowLayoutPanel3.Controls.Add(Me.button13)
      Me.flowLayoutPanel3.Controls.Add(Me.button14)
      Me.flowLayoutPanel3.Controls.Add(Me.button15)
      Me.flowLayoutPanel3.Location = New System.Drawing.Point(12, 12)
      Me.flowLayoutPanel3.Name = "flowLayoutPanel3"
      Me.flowLayoutPanel3.Size = New System.Drawing.Size(631, 100)
      Me.flowLayoutPanel3.TabIndex = 2
      ' 
      ' label2
      ' 
      Me.label2.Anchor = System.Windows.Forms.AnchorStyles.None
      Me.label2.AutoSize = True
      Me.label2.Location = New System.Drawing.Point(3, 28)
      Me.label2.Name = "label2"
      Me.label2.Size = New System.Drawing.Size(138, 14)
      Me.label2.TabIndex = 10
      Me.label2.Text = "FlowDirection=LeftToRight"
      ' 
      ' button11
      ' 
      Me.button11.Anchor = System.Windows.Forms.AnchorStyles.Bottom
      Me.button11.AutoSize = True
      Me.button11.Location = New System.Drawing.Point(147, 44)
      Me.button11.Name = "button11"
      Me.button11.Size = New System.Drawing.Size(86, 23)
      Me.button11.TabIndex = 5
      Me.button11.Text = "Anchor=Bottom"
      ' 
      ' button12
      ' 
      Me.button12.Anchor = CType(System.Windows.Forms.AnchorStyles.Top Or System.Windows.Forms.AnchorStyles.Bottom, System.Windows.Forms.AnchorStyles)
      Me.button12.AutoSize = True
      Me.button12.Location = New System.Drawing.Point(239, 3)
      Me.button12.Name = "button12"
      Me.button12.Size = New System.Drawing.Size(111, 64)
      Me.button12.TabIndex = 6
      Me.button12.Text = "Anchor=Top, Bottom"
      ' 
      ' button13
      ' 
      Me.button13.Anchor = System.Windows.Forms.AnchorStyles.None
      Me.button13.BackColor = System.Drawing.SystemColors.GradientActiveCaption
      Me.button13.Location = New System.Drawing.Point(356, 3)
      Me.button13.Name = "button13"
      Me.button13.Size = New System.Drawing.Size(75, 64)
      Me.button13.TabIndex = 7
      ' 
      ' button14
      ' 
      Me.button14.Dock = System.Windows.Forms.DockStyle.Bottom
      Me.button14.Location = New System.Drawing.Point(437, 44)
      Me.button14.Name = "button14"
      Me.button14.TabIndex = 8
      Me.button14.Text = "Dock=Bottom"
      ' 
      ' button15
      ' 
      Me.button15.Dock = System.Windows.Forms.DockStyle.Fill
      Me.button15.Location = New System.Drawing.Point(518, 3)
      Me.button15.Name = "button15"
      Me.button15.Size = New System.Drawing.Size(75, 64)
      Me.button15.TabIndex = 9
      Me.button15.Text = "Dock=Fill"
      ' 
      ' flowLayoutPanel1
      ' 
      Me.flowLayoutPanel1.Anchor = CType(System.Windows.Forms.AnchorStyles.Bottom Or System.Windows.Forms.AnchorStyles.Left Or System.Windows.Forms.AnchorStyles.Right, System.Windows.Forms.AnchorStyles)
      Me.flowLayoutPanel1.BorderStyle = System.Windows.Forms.BorderStyle.FixedSingle
      Me.flowLayoutPanel1.Controls.Add(Me.label1)
      Me.flowLayoutPanel1.Controls.Add(Me.button1)
      Me.flowLayoutPanel1.Controls.Add(Me.button2)
      Me.flowLayoutPanel1.Controls.Add(Me.button3)
      Me.flowLayoutPanel1.Controls.Add(Me.button4)
      Me.flowLayoutPanel1.Controls.Add(Me.button5)
      Me.flowLayoutPanel1.FlowDirection = System.Windows.Forms.FlowDirection.TopDown
      Me.flowLayoutPanel1.Location = New System.Drawing.Point(12, 118)
      Me.flowLayoutPanel1.Name = "flowLayoutPanel1"
      Me.flowLayoutPanel1.Size = New System.Drawing.Size(200, 209)
      Me.flowLayoutPanel1.TabIndex = 3
      ' 
      ' label1
      ' 
      Me.label1.AutoSize = True
      Me.label1.Location = New System.Drawing.Point(3, 3)
      Me.label1.Name = "label1"
      Me.label1.Size = New System.Drawing.Size(128, 14)
      Me.label1.TabIndex = 11
      Me.label1.Text = "FlowDirection=TopDown"
      ' 
      ' button1
      ' 
      Me.button1.Anchor = System.Windows.Forms.AnchorStyles.Right
      Me.button1.Location = New System.Drawing.Point(74, 23)
      Me.button1.Name = "button1"
      Me.button1.TabIndex = 5
      Me.button1.Text = "Anchor=Right"
      ' 
      ' button2
      ' 
      Me.button2.Anchor = CType(System.Windows.Forms.AnchorStyles.Left Or System.Windows.Forms.AnchorStyles.Right, System.Windows.Forms.AnchorStyles)
      Me.button2.Location = New System.Drawing.Point(3, 52)
      Me.button2.Name = "button2"
      Me.button2.Size = New System.Drawing.Size(146, 23)
      Me.button2.TabIndex = 6
      Me.button2.Text = "Anchor=Left, Right"
      ' 
      ' button3
      ' 
      Me.button3.BackColor = System.Drawing.SystemColors.GradientActiveCaption
      Me.button3.Location = New System.Drawing.Point(3, 81)
      Me.button3.Name = "button3"
      Me.button3.Size = New System.Drawing.Size(146, 23)
      Me.button3.TabIndex = 7
      ' 
      ' button4
      ' 
      Me.button4.Dock = System.Windows.Forms.DockStyle.Right
      Me.button4.Location = New System.Drawing.Point(74, 110)
      Me.button4.Name = "button4"
      Me.button4.TabIndex = 8
      Me.button4.Text = "Dock=Right"
      ' 
      ' button5
      ' 
      Me.button5.Dock = System.Windows.Forms.DockStyle.Fill
      Me.button5.Location = New System.Drawing.Point(3, 139)
      Me.button5.Name = "button5"
      Me.button5.Size = New System.Drawing.Size(146, 23)
      Me.button5.TabIndex = 9
      Me.button5.Text = "Dock=Fill"
      ' 
      ' Form1
      ' 
      Me.ClientSize = New System.Drawing.Size(658, 341)
      Me.Controls.Add(flowLayoutPanel1)
      Me.Controls.Add(flowLayoutPanel3)
      Me.Name = "Form1"
      Me.Text = "Form1"
      Me.flowLayoutPanel3.ResumeLayout(False)
      Me.flowLayoutPanel3.PerformLayout()
      Me.flowLayoutPanel1.ResumeLayout(False)
      Me.flowLayoutPanel1.PerformLayout()
      Me.ResumeLayout(False)
   End Sub
    
   
   <STAThread()>  _
   Shared Sub Main()
      Application.EnableVisualStyles()
      Application.Run(New Form1())
   End Sub
End Class

Compilando o código

Este exemplo requer:

  • Referências aos assemblies System, System.Data, System.Drawing e System.Windows.Forms.

Ver também